メインコンテンツに移動
ホーム

古松

メインナビゲーション

  • ホーム
  • ビデオ
  • ご連絡

パンくず

  • ホーム
  • Electron
  • Electronの入門2:デモアプリのインストールと動作確認

Electronの入門2:デモアプリのインストールと動作確認

GitHub上のElectron公式アカウントで公開されているElectron API Demosというデモアプリは、基本的なElectron APIのを具体的にどんなことができるのかを知るのに便利だ。よく使うクラスと使い方が、デモの中で解説されているため、これを見ていけばElectronのAPIで何ができるのかが効率的に理解できる。

Electron API Demoのインストール

  • Electron API Demos:https://github.com/electron/electron-api-demos
  • そのパッケージをダウンロードして、Electron開発ソースディレクトリに置けばよいです
  • Windowsのコマンドプロンプトでデモアプリを起動します
    //デモアプリのディレクトリ内で、以下のコマンドでアプリを起動
    electron .
    
  • 起動途中で以下のエラーが発生するかもしれないです
    globモジュールが足りないエラー

    • Error:Cannot find module 'glob'

globモジュールが足りないエラー

  • Electron API Demoアプリがglobモジュールを要求します
  • globモジュールはファイルをパタン(例:*、?、+ など)でマッチング機能であります
  • Windowsのコマンドプロンプトでglobモジュールをインストールします
    //任意のディレクトリで以下のコマンドでglobをインストール
    npm install glob --save
    

Electronデモアプリの起動

  • 再度Windowsのコマンドプロンプトを起動して、Electronのデモアプリを起動
    //デモアプリのディレクトリ内で、以下のコマンドでアプリを起動
    electron .

    Electronデモアプリ

Electronの入門1:Winodws上でのインストールと動作確認

Electronについて

  • オーペンソースフレームワーク(Open Source Platform)、GitHubで管理されています
  • Node.jpをベースにして、クローズプラットフォーム(Windows,MacOS、Linunxなど)上のネーティブApp構築ができます
  • バックエンドはJavascript+html+CSSで記述(フロントエンドのエンジニアに習得するコストは高くないはず)
  • Chromiumでコンテンツを表示します

Windows上でのインストール

  • 最新バージョンのNode.jsをWindowsにインストールします
  • Node.jsの管理ツール:npm(Node Package Manager)でElectronを以下のコマンドでインストール
    npm install electron -g

     

  • Electronのインストール状況、バージョンを以下のコマンドでチェックします
    electron -v

     

Electronの基本情報を表示

  • Windowsのコマンドプロンプト(cmd)を起動して、以下の実行コマンドで
    npx electron

    electronの基本情報


検索フォーム

カテゴリ別

  • laravel
  • drupal
  • javascript
  • windows
  • html
  • mysql
  • php
  • apache
  • css
  • SEO
  • video
  • wordpress
  • linux
  • python
  • Electron
  • Visual Studio Code

google ads