はてなブックマーク

本記事では、WebブラウザでPDFファイルを表示するためによく使われるオープンソースライブラリの1つ「PDF.js」を使用して、WebページでPDFファイルを表示する方法を紹介します。 PDF.jsを使用してPDFファイルを表示する方法は2つあります。１つ目は<canvas>要素にPDFファイルをレンダリングする方法と、PDF.jsに付属のPDFビューワーを埋め込む方法です。 HTMLのcanvas要素にPDFファイルをレンダリングする方法 ビルド済みのPDF.jsを以下からダウンロードします。2023年3月時点で最新はv3.4.120です。 https://github.com/mozilla/pdf.js/releases pdfjs-hello-worldフォルダを作成して、そこにダウンロードしたpdfjs-3.4.120-dist.zipからbuildフォルダとフォルダ内のファイル

普段のお仕事に役立つ普遍的なプログラミングTIPSや、業界で注目度が高い最新情報をお届けする「編集部ピックアップ」。 今回は認知度が急上昇しているJavaScriptフレームワーク「Svelte」をご紹介します。 はじめに JavaScriptはプログラミング言語の1つで、Webサイトに動きをつけたり、Webアプリケーションで動的なコンテンツを提供するのに使用されます。JavaScriptには開発をサポートするフレームワークが数多くありますが、今回は2019年頃から認知度が急上昇し、「The State of JS 2021」でも高いユーザ満足度を獲得した「Svelte」をご紹介します。 Svelteとは SvelteはWebアプリケーションにおけるフロントエンド（画面）部分を構築するためのJavaScriptフレームワークです。 同様のフレームワークにはAngular、React、Vue

メシウス株式会社のDeveloper Solutions〈開発支援ツール〉の情報発信メディア「MESCIUS.devlog」 .NET 5で対応されないASP.NET Web Formsの移行先としても注目を集める「ASP.NET Core Blazor」ですが、その本命とも言われている「Blazor WebAssembly」が2020年5月に正式リリースされました。 こちらは2020年7月17日まで開催中のオンラインイベント「de:code 2020」にて、マイクロソフト コーポレーションの井上章さんのセッションの中で詳しい解説やデモを見ることができます。 今回の記事では、Blazor WebAssemblyの公式のプロジェクトテンプレートをベースに、Blazor WebAssemblyの基本的な使い方や、標準のテーブルを高機能なデータグリッドに置き換える手順などをご紹介したいと思います

普段のお仕事に役立つ普遍的なプログラミングTIPSや、業界で注目度が高い最新情報をお届けする「編集部ピックアップ」。 今回はSPA（Single Page Application）と、SPAを開発するのに最適な3大JavaScriptフレームワークについてお届けします。 新しいWebアプリケーションの形式として、SPA（Single Page Application）が注目され始めてしばらく経ちますが、今もフレームワークの開発が積極的に行われるなど、未だ勢いは衰えていません。 この記事では、SPAの基本的な考え方と、開発に便利なフレームワーク（React、Angular、Vue.js）の2023年の最新動向を紹介します。 SPAの概要 SPAは近年注目を集めているWebアプリケーションの形式の1つで、「1つのWebページによって、1つのアプリを構築する」というものです。 従来型のアプリケー

普段のお仕事に役立つ普遍的なプログラミングTIPSや、業界で注目度が高い最新情報をお届けする「編集部ピックアップ」。今回はVisual Studio Codeの代替として注目される「Eclipse Theia」についてお届けします。 「Visual Studio Code」（以下、VS Code）はクロスプラットフォームで使えるコードエディタとして多くの開発者に使用されていますが、そのVS Codeの代替を目指し、Eclipse Foundationが提供しているのが「Eclipse Theia」（以下、Theia）です。 本記事では、2020年4月3日にバージョン1.0がリリースされた、Theiaの基本的な特徴や使い方を紹介します。 Theiaとは？ Theiaは、VS Codeの代替を目指す新興のエディタです。Web・クラウドベースのツールと統合開発環境（IDE）を構築するためのオープ

メシウス株式会社のDeveloper Solutions〈開発支援ツール〉の情報発信メディア「MESCIUS.devlog」 Visual Studio Codeでコードを表示しながらデータを確認する場合に役立つ拡張機能の紹介です。 スクリーンショットの工夫 Excelファイルを操作するライブラリDioDocs（ディオドック）は、ユーザーインタフェースが無いので、スクリーンショットを撮影する際に工夫が必要です。 GrapeCity.devlogで利用方法を解説する場合も、成果物であるExcelファイルやPDFファイルを表示した画像になるケースがほとんどです。 また、.NET CoreのConsoleアプリの場合、コマンドラインのUI（CLI）になるためVisual Studio Code（以下、VSCode）にコードを表示した画面になります。 しかし上図では、右側にグリッド画面が見えます。

メシウス株式会社のDeveloper Solutions〈開発支援ツール〉の情報発信メディア「MESCIUS.devlog」 先日公開した記事では、.NET Coreで作成したWindowsアプリケーションの新しい配布方法「自己完結型」を試してみました。 今回は前回紹介できなかったMSIXパッケージを作成してアプリケーションを配布する方法を試してみたいと思います。 前回に引き続き、使用するのは入力支援コンポーネント「InputManPlus for WPF（インプットマンプラス）」です。 配布するアプリケーションの準備 MSIXパッケージで配布する MSIXパッケージの作成 インストーラーファイルの設定 アプリケーションのインストール アプリケーションの更新 おわりに 配布するアプリケーションの準備 InputManとJPAddressで作成した郵便番号検索アプリを使用します。事前準備とし

今回は、WPFと密接な関係にあるMVVM（Model-View-ViewModel）パターンのアプリケーション開発を強力にサポートしてくれるPrismフレームワーク上で「SPREAD for WPF（スプレッド）」を使用する例をご紹介します。 MVVMとPrism Prism Template Packのインストール SPREADとPrismを使ったサンプルの作成 おわりに 1. MVVMとPrism MVVMは、マイクロソフトのWPFとSilverlightを対象として考えられたアーキテクチャパターンで、モデル（Model）とビュー（View）そしてビューモデル（ViewModel）の３層構造になっています。 一方、Prismは、Prism Libraryの冒頭で述べられているように「疎結合で保守とテストを容易にするXAMLアプリケーションをWPF、Windows 10 UWP、そしてX

メシウス株式会社のDeveloper Solutions〈開発支援ツール〉の情報発信メディア「MESCIUS.devlog」 2018年6月27日に以下の製品の運用環境のサポート対象に「Microsoft RemoteApp」（以下RemoteApp）を追加しました。 InputManPlus for Windows Forms（Update 2以降で対応） InputManPlus for WPF MultiRowPlus for Windows Forms（Update 2以降で対応） RemoteAppに対応している製品の詳細はこちらをご覧ください。 RemoteAppは、Windows Serverのリモート デスクトップ サービス（旧称：ターミナルサービス）が提供する機能の１つで、ホストで実行されるアプリケーションの画面だけを転送してクライアントのデスクトップ上に表示・操作させる

これを「グレープシティ製品の記事」と紹介して良いのだろうか？ その濃密な内容に驚き、通常の製品紹介記事と同列にするのはもったいない！ そう思わせる文書が公開されましたので共有します。 その記事は、東京のSI企業に勤務する現役エンジニア、アーキテクトである中村充志さんが執筆し、 デベロッパーの成長と課題解決に貢献するメディア「CodeZine」で公開されました。 中村さんは、主にWPFやASP.NETをプラットフォームとする業務システム開発が本業ですが、活動範囲は幅広くXamarinに関する技術書籍の執筆や、今回の記事でも採用しているMVVMフレームワーク「Prism」のコントリビューターです。 また、XamarinやPrismをテーマにした講演でもご活躍されています。 今回公開された記事は、概要編、実践編の二部構成です。 MicrosoftのサンプルデータベースであるAdventureWo