<< Node.js(Pug)入門編その4 | main | Node.js(Express)入門編その6 >>

Node.js(Express)入門編その5

 

前回からの続きです。

 

ここまで、お疲れ様でした。

Webプログラムを進めていくと、どんどん覚えることが多くなります。

これまで、かなり内容を省略してきたにもかかわらず、

まだフレームワークにすら到達していません(ブログ的には、書く内容に困りまりませんが)

ですが、Webプログラムを理解すれば、世界中のweb上のデータ、APIを使うことができ、

または、各種サービスを提供できることができますので、損はありません。

もう少し、我慢してください

 

前置きが長くなりましたが、

前回のmain-app.jpの説明です。

 

 

解説:

5行目で

var url = require('url');

でurlモジュールを使えるようにします。

 

8・9行目で

var index_page = fs.readFileSync('./index.pug','utf8');
var style_css = fs.readFileSync('./style.css','utf8');

でファイルの内容を呼び込みます。

前に行ったのは、fs.readFile()でしたが、

今回はfs.readFileSync(ファイル名,文字コード)を使っています。

違いは、同期か非同期の違いです。

今回は、処理が終わるまでプロセスを待ちます。(同期)

 

14行目で

console.log('Server start');

を使っていますが、console.log(値)は、

プログラムがちゃんと動いているか確認するために、ログを表示します。

または、一時的に変数などを表示させて、バグがないか(デバッグ)などに、よく使われます。

 

18行目で

var url_p = url.parse(_req.url);

リクエストされたURLのパスを取得します。(url.parse(リクエストのURL))

 

19行目で

switch (url_p.pathname){

パスの値(url_p.pathname)によって処理を分岐します。

switch文:

switch(値){

   case '値': 処理;break;

 case '値': 処理;break;

 default:処理(上のcaseの値にない場合);break;

}

breakがないと止まりません次の命令を実行してしまいます。

ちなみに、if文を使ってもいいですが、switch文の方が見やすいです。

 

 

 

ちゃんと、外部CSS(style.css)が適応されました。

 

 

EXPRESSについて

Node.jsで一番よく使われるフレームワーク(ひな形)です。

簡単にプログラム、システムが作れます。

 

さて、ここまで来れば、expressのフレームワークを見ても理解できると思います。

 

まずは、入門編その3と同じように、フォルダを作ってください。

ここでは、フォルダー名をexpress-appとしました。

ここに、

npm install express-generator -g

でexpressのプログラム(CLI)をインストールしてください

 

 

次に

express --view=pug myapp

express オプション プログラム名

でフレームワーク(枠組み)が出来てしまいます。

 

 

作った、myappフォルダに移動します。

 

 

 

依存するモジュールをインストールします。

npm install

 

 

 

 

プログラミングの実行するには、

npm start

です。

プラウザで

http://localhost:3000/

をアクセスすれば、

 

 

と表示されます。

 

終了するときは、CTRL+Cです。

 

 

 

参考:公式サイト

GitHub-expressgenerator

 

Expressのインストールまで終了しました。

 

次回からは、やっとプログラムを書くことができます。

 

 

その6につづきます

 

 

 

JUGEMテーマ:プログラミング

| JavaScript | 09:22 | comments(0) | trackbacks(0) |
Comment









Trackback
url: トラックバック機能は終了しました。

07
--
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
--
>>
<<
--
Profile
New entries
Archives
Categories
Recent comment
カウンター


今日
昨日
レンタルサーバ/プロバイダー




ファッション
カタログ通販ベルーナ(Belluna)

イマージュ - IMAGEアウトレットセール
yahoo・その他


買い物
ビックカメラ.com



Mobile
qrcode
Links
Others
無料ブログ作成サービス JUGEM