実例でわかる JavaScript ローカルアプリ開発講座 Windows版 node.js NW.js
5.0 (27 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
459 students enrolled
Wishlisted Wishlist

Please confirm that you want to add 実例でわかる JavaScript ローカルアプリ開発講座 Windows版 node.js NW.js to your Wishlist.

Add to Wishlist

実例でわかる JavaScript ローカルアプリ開発講座 Windows版 node.js NW.js

node.jsとNW.js(旧node-webkit)を使い、JavaScriptで、Windows用のローカルアプリケーション(CUI、GUIアプリ)を作ろう!
5.0 (27 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
459 students enrolled
Created by 柳井 政和
Last updated 5/2017
Japanese
Current price: $10 Original price: $85 Discount: 88% off
5 hours left at this price!
30-Day Money-Back Guarantee
Includes:
  • 5.5 hours on-demand video
  • 1 Supplemental Resource
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • HTML+JavaScript+CSSを利用した、Windows用ローカルアプリケーションの開発。
  • 開発したアプリケーションを、他人に配布するためのファイルの作成。
  • ローカルアプリケーション開発に必要な処理(ファイルアクセス、テキスト、バイナリの読み書き、EXEファイルの実行、通信、ZIPファイルの操作など)。
View Curriculum
Requirements
  • 事前の準備は特に必要ありません。
  • Windows上に開発環境を構築して、Windows用のローカルアプリケーションを開発します。
Description

 このコースは、Webページ作成の知識を利用して、JavaScriptで、Windows用のローカルアプリケーションを、手軽に開発する方法を網羅しています。

 node.js、NW.js(旧node-webkit)をWindows環境で使いこなし、アプリケーション開発を行うために必要な知識と、豊富な作例をまとめています。

 このコースを習得すれば、次のような事ができるようになります。

- Windowsでの開発環境の構築。

- 配布可能なアプリケーションの作成。

- node.js、NW.jsの利用。

- ファイルアクセスなど、ローカルアプリケーション開発に必要な知識の習得。

- JavaScriptとnode.jsを利用した、Windows用CUIアプリケーションの作成。

- HTML、JavaScript、NW.jsを利用した、Windows用GUIアプリケーションの作成。

 コースで紹介されるコードは、サンプルコードとして、全てダウンロードすることができます。

 本講座では、Windowsでの開発環境の構築からはじめ、ファイルアクセスなど、ローカルアプリケーション開発に必要な知識を学び、配布可能なアプリケーションを作成するまでをマスターします。

‥‥‥‥‥‥‥‥‥‥

 このコースは、以下のように進みます。

● CUIアプリの準備(node.js)

 ・node.jsの紹介、導入、使い方。

● node.jsのリファレンス

 ・パスとファイル。ファイル読み書き、実行。通信。その他(ZIPの読み書き)。

● CUIアプリの開発

 ・「ディレクトリ内のファイル一覧」アプリ

 ・「指定ファイルをローカルサーバーで開く」アプリ

● GUIアプリの準備(NW.js)

 ・NW.jsの紹介、導入、使い方。配布ファイルの作り方。

● GUIアプリの開発

 ・「文字コード変換」アプリ

 ・「Webアプリに独自機能を追加」アプリ

 ・「検索順位の自動保存」アプリ

 ・「Webページ画像キャプチャ」アプリ

‥‥‥‥‥‥‥‥‥‥

 このコースでは、以下のようなアプリケーションを作ります。ほとんどのアプリは、ソースコードが100~200行ほどで、容易に理解、改造が行えます。

 各アプリケーションの動作は、無料プレビューで確認可能です。

●「ディレクトリ内のファイル一覧」アプリ

 ドラッグ&ドロップしたディレクトリの、「ディレクトリ内のファイル一覧」を、表示するアプリです。

 Windowsの「送る」にショートカットを保存しておけば、手軽にディレクトリ内のファイル一覧を、テキストファイルとして得ることができます。

●「指定ファイルをローカルサーバーで開く」アプリ

 HTMLファイルなどをドラッグ&ドロップすると、ローカルサーバーを起動して、ブラウザで開くアプリケーションです。

 セキュリティ上の問題(ファイルを読み込むなど)で、Webページにファイルを置いてからWebブラウザで確認することは、Web開発の現場ではよくあります。

 そうした際に、手軽にサーバーを起動させて、ローカルのIPアドレスでWebページを確認する。このアプリケーションのショートカットを、Windowsの「送る」に保存しておけば、Explorerの右クリックから、手軽にそうした確認ができるようになります。

●「文字コード変換」アプリ

 GUI(ウィンドウ、入力欄、ボタン、プルダウンリストなどのユーザーインターフェース)で、文字コードを変換するアプリケーションです。

 このアプリケーションは、ファイルを開くダイアログ、ファイルを保存ダイアログを利用するサンプルになっています。

 また、ウィンドウへのファイルのドラッグ&ドロップで、読み込むファイルを切り替えるコードのサンプルにもなっています。

●「Webアプリに独自機能を追加」アプリ

 URL指定でWebアプリを読み込み、保存ボタンなどの独自機能を追加する、アプリケーションのサンプルです。

 特定のWebサイトに、機能を追加したい。また、公開済みのWebアプリのローカル版を手軽に作りたい。そうした用途に使える技術です。

 ここでは、「画像をセピア調に変換するWebアプリ」に、保存ボタンを外部から挿入して、保存機能を追加します。

●「検索順位の自動保存」アプリ

 ブラウザを自動操縦して、複数のキーワードの、検索結果の順位を保存するアプリです。

 サイトの自動巡回や定期投稿、そうしたアプリケーション作成のひな形にできる、サンプルです。NW.jsでは、こうした自動化ツールを簡単に作れます。

●「Webページ画像キャプチャ」アプリ

 Webページの、スクリーンショットを撮影するアプリケーションです。

 NW.jsには、ブラウザで表示している画面を、手軽に画像として得る機能が備わっています。そうした機能を利用して、ウェブページの画像を定期保存したり、サムネールを作ったりすることが可能です。

‥‥‥‥‥‥‥‥‥‥

 JavaScriptは、Webページの作成でよく利用されているプログラミング言語です。この簡単なプログラミング言語、そしてHTML、CSSといった知識を利用して、手軽にWindows向けローカルアプリケーションを作成しましょう!

Who is the target audience?
  • JavaScriptで、Windows用のローカルアプリケーションを開発したい方。
  • 既存のWebアプリを、ローカルアプリケーションにしたい方。
  • 手間をかけずに、手軽にPC用アプリケーションを作りたい方。
  • node.js、NW.js(旧node-webkit)を使って、アプリケーションを作りたい方。
Students Who Viewed This Course Also Viewed
Curriculum For This Course
102 Lectures
05:21:03
+
第1章 イントロダクション
5 Lectures 08:18

本講座の説明をおこない、おおまかなロードマップを示します。

Preview 03:09

本講座で出てくるソースコードは、本レクチャーの「ダウンロード可能なリソース」から一括してダウンロードできます(2017-05-31 最新の「sample_code_170531.zip」を追加しました。genApp、wrap_web_appの改良)。

ソースコードについて
00:31

CUIアプリ、GUIアプリとはどのようなものか、そして、それらをどうやって作るかを解説します。

CUIアプリとGUIアプリの開発
02:07

今後よく出てくる、コマンドプロンプトの起動の仕方を、説明しておきます。

コマンドプロンプトの起動の仕方
01:22

本講座は、ある程度JavaScriptの基本文法を知っている方向けの講座です。そのため、JavaScriptの基本文法を、手軽に学ぶ方法を紹介します。

JavaScriptの基本文法について
01:09
+
第2章 CUIアプリ 環境構築編
9 Lectures 19:06

「第2章 CUIアプリ 環境構築編」についての前置きです。

[章頭] CUIアプリ 環境構築編
00:25

node.jsとは何かという話をします。また、CUIアプリを作る道具として、node.jsをどのように使うかを説明します。また、公式サイトやドキュメントのURLも紹介します。

Preview 01:34

Windowsで、手軽にnode.jsの開発環境を構築するnodistを利用して、node.jsを導入します。また、公式サイトやドキュメントのURLも紹介します。

nodistを利用した開発環境の構築
02:20

node.jsを利用しやすいようにパスを通します。

パスを通す
02:46

環境構築でエラーが発生した時の対策を紹介します。

エラー時の対策
01:24

package.jsonの作成の仕方を説明します。また、このファイルの各項目の意味についても解説します。

package.jsonの作成
03:19

node.jsのモジュールと、requireを使った呼び出しの仕組みについて学習します。

モジュールとrequire
01:53

各種パッケージをインストールする方法を紹介します。グローバルインストールとローカルインストールについて理解して、使いこなせるようになります。

npm install
03:41

node.jsで、プログラムのファイルを分けたい際に、自作モジュールを使う、簡単な方法を紹介します。

自作モジュール
01:44
+
第3章 CUIアプリ 実行編
5 Lectures 15:01

「第3章 CUIアプリ 実行編」についての前置きです。

[章頭] CUIアプリ 実行編
00:17

Windowsで、node.jsをCUIアプリとして使うための、バッチファイルのテンプレートを示します。また、そのプログラムについて解説します。

バッチファイルのテンプレート
06:26

console.logを利用して、コマンドプロンプトに「hello world」と出力するシンプルなプログラムを書けるようになります。

Preview 01:31

node.jsのCUIアプリで、引数を受け取る方法を紹介します。バッチファイルに、各種ファイルをドラッグ&ドロップすることで、そのパスを得ることができるようになります。

引数を受け取る
03:22

node.jsの実行ファイルは単一ファイルです。「node.exe+JSのプログラム+バッチファイル」を、ディレクトリに適切に配置することで、単独で実行可能なファイル構成を作ることができます。その方法を紹介します。

node.jsを持っていないユーザーへの配布
03:25
+
第4章 node.js リファレンス編1 パスとファイル
10 Lectures 41:58

「第4章 node.js リファレンス編1 パスとファイル」についての前置きです。

[章頭] node.js リファレンス編1 パスとファイル
00:27

pathモジュールについての概要を説明します。

パス1 - path
00:55

カレントパスの得方、また、そのパスからの相対パスを、絶対パスに変換する方法を身に付けます。

パス2 - カレントパスからの相対パスを絶対パスに変換
02:56

パスから、ディレクトリ名やファイル名、拡張子などを取り出す方法を身に付けます。

パス3 - パスの分解
04:33

fsモジュールについての概要を説明します。また、非同期関数と、Syncの付く同期関数の違いについて学びます。

ファイル操作1 - fs、Sync
03:01

ファイルの存在確認方法を学びます。複数あるので、その特製の違いを理解します。

ファイル操作2 - ファイルの存在確認
08:37

ファイルの存在確認方法を学びます。複数あるので、その特製の違いを理解します。 その2。

ファイル操作2 - ファイルの存在確認2
05:47

ディレクトリ内を走査して、ファイルやサブディレクトリのパスを得る方法を学習します。

Preview 04:51

ファイルのコピー方法を学びます。簡易な方法と、丁寧な方法を紹介します。

ファイル操作4 - ファイルのコピー
06:36

ファイルの削除方法を学びます。

ファイル操作5 - ファイルの削除
04:15
+
第5章 node.js リファレンス編2 ファイル読み書き、実行
8 Lectures 37:20

「第5章 node.js リファレンス編2 ファイル読み書き、実行」についての前置きです。

[章頭] node.js リファレンス編2 ファイル読み書き、実行
00:30

テキストファイルの読み込み方法をマスターします。

テキストファイル1 - 読み込み
04:56

テキストファイルの書き込み方法をマスターします。

テキストファイル2 - 書き込み
05:03

バイナリファイルの読み書き方法をマスターします。

バイナリファイル - 読み書き
04:20

Windowsのexeファイル(実行ファイル)を、node.jsから引数付きで実行する方法を学びます。

exe実行1 - exec、execSync
06:56

node.jsから、バッチファイルなどで使用するWindowsコマンドを実行する方法を学びます。

exe実行2 - Windowsコマンド
03:06

テキストファイルの文字コードを、変換する方法を学びます。Windowsでは、ShifJISが主流なので、Windowsでローカルアプリを作る際には、必須の知識になります。

文字コード1 - ファイルを変換
08:38

exeファイルやWindowsコマンドを実行した際のエラーをnode.jsでそのまま受け取ると、文字化けします。そのエラーメッセージの文字コードを変換して読み取る方法を学びます。

文字コード2 - exe実行のエラーを変換
03:51
+
第6章 node.js リファレンス編3 通信
4 Lectures 16:46

「第6章 node.js リファレンス編3 通信」についての前置きです。

[章頭] node.js リファレンス編3 通信
00:33

テキストファイルをダウンロードする方法を学びます。

ファイルのDL1 - テキストファイル
04:54

画像をダウンロードする方法を学びます。

ファイルのDL2 - 画像
03:04

node.jsは、元々サーバーとして動作することを目的とした実行環境です。そのため、サーバーになる機能が備わっています。そのサーバー化の方法を学び、実際にサーバーとして動作させます。

サーバー化
08:15
+
第7章 node.js リファレンス編4 その他
6 Lectures 25:10

「第7章 node.js リファレンス編4 その他」についての前置きです。

[章頭] node.js リファレンス編4 その他
00:20

node.js を終了する方法を学びます。プログラムを途中で打ち切りたい時に必要な知識です。

node.js を終了
01:26

ZIPファイルの作成について学びます。

ZIP1 - ZIPの作成
05:20

ZIPファイルから、ファイルを取り出して展開する方法について学びます。

ZIP2 - ZIPの展開
05:54

7-Zipのコマンドライン版を使い、ファイルを圧縮する方法を学びます。

ZIP3 - 7-Zipでの圧縮
07:42

7-Zipのコマンドライン版を使い、ファイルを解凍する方法を学びます。

ZIP4 - 7-Zipでの解凍
04:28
+
第8章-1 CUIアプリ アプリ開発編1「ディレクトリ内のファイル一覧」
3 Lectures 06:59

「第8章-1 CUIアプリ アプリ開発編1 ディレクトリ内のファイル一覧」についての前置きです。

[章頭] CUIアプリ アプリ開発編1「ディレクトリ内のファイル一覧」
00:23

本章で作成するアプリが、どのようなアプリなのか紹介します。引数のディレクトリ内のファイル一覧を、テキストで出力して表示するアプリです。

Preview 01:34

「ディレクトリ内のファイル一覧」アプリのコード解説です。

コード解説
05:02
+
第8章-2 CUIアプリ アプリ開発編2「指定ファイルをローカルサーバーで開く」
3 Lectures 06:14

「第8章-2 CUIアプリ アプリ開発編2 指定ファイルをローカルサーバーで開く」についての前置きです。

[章頭] CUIアプリ アプリ開発編2「指定ファイルをローカルサーバーで開く」
00:40

本章で作成するアプリが、どのようなアプリなのか紹介します。実行とともにサーバーを起動して、引数のファイルをサーバー上のファイルとして開くアプリです。

Preview 01:23

「指定ファイルをローカルサーバーで開く」アプリのコード解説です。

コード解説
04:11
+
第9章 GUIアプリ 開発準備編
8 Lectures 22:33

「第9章 GUIアプリ 開発準備編」についての前置きです。

[章頭] GUIアプリ 開発準備編
00:21

NW.js(旧node-webkit)とは何なのかを学びます。また、その使いどころを紹介します。

Preview 02:41

古いNW.jsと、新しいNW.jsで、いくつか仕様が異なる点があります。その紹介をおこなっておきます。以降の動画のいくつかの箇所では、この新しい情報に読み換えてください。

[補足] 古いNW.jsと、新しいNW.jsの違い
05:14

NW.jsのファイルをダウンロードして、開発の準備を行います。また、ドキュメントのURLを紹介します。

開発環境の準備
02:31

NW.jsを使いやすくするために、実行ファイルのある場所にパスを通します。

パスを通す
04:02

NW.jsでローカルアプリを作成する際に、使いやすいファイル構成を紹介します。

ファイル構成
02:11

NW.js用のpackage.jsonを作成します。node.jsのpackage.jsonを拡張したものになっています。また、それらの情報がまとまっているURLも紹介します。

package.jsonの作成
03:23

NW.jsでデバッグを行うための、開発者ツールを紹介します。

開発者ツール
02:10
6 More Sections
About the Instructor
柳井 政和
4.3 Average rating
316 Reviews
2,966 Students
6 Courses
ゲーム、アプリケーション開発、書籍の執筆、JavaScript、Java

2002年にクロノス・クラウン合同会社を設立。代表社員。ゲームやアプリケーションの開発、書籍や記事の執筆をおこなう。

秀和システムより「マンガでわかるJavaScript」「マンガでわかるAndroidプログラミング」「マンガでわかるJavaプログラミング」他、技術評論社より「JavaScript 仕事の現場でサッと使える! デザイン教科書」「プログラマのためのコードパズル」を出版。

2001年度のオンラインソフトウェア大賞に「めもりーくりーなー」で入賞。

2016年に第23回松本清張賞の最終候補となり、文藝春秋より「裏切りのプログラム」で小説家デビュー。