Part2:express-generator

海未「さて、ExpressにはWebアプリケーションの雛形を自動生成してくれる機能があります。今回はその機能を提供するexpress-generatorについて見てみましょう」

海未「まず始めに、express-generatorをグローバルインストールします」

$ npm -g install express-generator

海未「これで準備は完了です」
ことり「これも、簡単だね」

海未「次に、アプリケーションの雛形を生成してみます」

$ express exampleapp
 
create : exampleapp
create : exampleapp/package.json
create : exampleapp/app.js
create : exampleapp/public
create : exampleapp/public/javascripts
create : exampleapp/routes
create : exampleapp/routes/index.js
create : exampleapp/routes/users.js
create : exampleapp/public/images
create : exampleapp/public/stylesheets
create : exampleapp/public/stylesheets/style.css
create : exampleapp/views
create : exampleapp/views/index.jade
create : exampleapp/views/layout.jade
create : exampleapp/views/error.jade
create : exampleapp/bin
create : exampleapp/bin/www
 
install dependencies:
$ cd exampleapp && npm install
 
run the app:
$ DEBUG=exampleapp:* npm start

穂乃果「わっ、なんかいっぱいできた」
海未「ここで生成されたファイル群は、アプリケーションのスケルトンになるものです。これだけでも動きますから、試してみましょう」

$ cd exampleapp
$ npm install

海未「これで各種依存関係がインストールされます。準備が整いましたから、サーバを起動してみましょう」

$ npm start
 
> exampleapp@0.0.0 start /home/umi/exampleapp
> node ./bin/www

海未「ポートは特に指定しなければ3000番が使われます。ではブラウザでサーバの3000番ポートにアクセスしてみてください」
穂乃果「Welcome to Expressって出た!」
ことり「コンソールの方にもアクセスログが出てるね」
海未「1行のコードも書かずして、ここまでの状態になるのです。あとは、この雛形を基にして実装していく形になります」

海未「ポートは環境変数PORTがあればそちらが優先して使われますから、起動時にPORT=25252 npm startのようにすると変更できます」

海未「ExpressはMVCアーキテクチャに則っています。データを司るモデル、表示を司るビュー、それらのルーティングを行うコントローラ。次回からそれぞれを説明していきますね」


LINEで送る
Pocket


返信を残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です