メインコンテンツへ飛ぶ

Electron のシンプルなサンプル

· 読むのにかかる時間 1 分

先日、サンフランシスコにある女性のためのプログラミングスクール Hackbright Academy の会員のために、 GitHub 本社で Electron ハッカソンを開催しました。 参加者がプロジェクトを開始しやすくするために、 Kevin Sawicki がいくつかのサンプル Electron アプリケーションを作ってくれました。


あなたが Electron での開発を始めたばかりか、まだ試したことないのであれば、これらのサンプルアプリケーションは良いスタートとなるでしょう。 小さく、読みやすく、丁寧にコメントされたコードがどのように動いているかを説明してくれます。

始めるには、このリポジトリをクローンします:

git clone https://github.com/electron/simple-samples

いずれかのアプリを起動するには、そのアプリのディレクトリに入り、依存をインストールして開始します:

cd activity-monitor
npm install
npm start

アクティビティモニター​

CPU におけるシステム、ユーザ、アイドル状態の時間をドーナツグラフで表示します。

スクリーンショット

ハッシュ​

入力されたテキストのハッシュ値をいくつかのアルゴリズムを使って表示します。

スクリーンショット

ミラー​

最大化されたサイズで、鏡を見ているかのようにコンピュータのカメラの映像を再生します。 任意で CSS アニメーションを利用した虹色フィルタ効果を含みます。

価格​

Yahoo Finance API を用いて、現在の原油、金、銀の価格を表示します。

スクリーンショット

URL​

コマンドラインで渡された URL をウィンドウに表示します。

その他の資料​

Electron の利用を開始するためにこれらのアプリが役立つことを願います。 さらに学習するための便利な資料がこちらです:

  • electron-quick-start: 最小の Electron アプリケーションテンプレート。
  • Electron API Demos: Electron API のコア機能を試すためのインタラクティブアプリ。
  • electronjs.org/docs/all: すべての Electron ドキュメントが検索しやすい 1 ページに。
  • hokein/electron-sample-apps: Electron メンテナ Haojian Wu によってコンパイルされたサンプルアプリケーションたち。
  • awesome-electron - 最新で最良の Electron に関するチュートリアル、本、動画などを集めた GitHub リポジトリ。