随分間が空きましたがこつこつ進めてますよ！

npm で AngularJS 入れると node_modules の下に入ってしまい面倒なので Bower を使ってみることに。

Angular.js 2.0 や React.js など、ES6 の流れをくんでいるスクリプトは、Node.js の世界で完結させることができるので、今後 Bower は使いドコロが減ってゆきそうです。

ぐぬぬ。初心者なのでちょっと枯れてるくらいが丁度いいんですよ！

Bower 入れる

Bower

アイコンかわいい！

Bower はフロントエンドで使われるパッケージマネージャ。npm はバックエンド(Node.js)用と考えておけば OK っぽい。

1

$ npm install -g bower

以下の内容で.bowerrcを作る。

1
2
3
4

{
  "directory": "public/components",
  "json": "bower.json"
}

1

$ bower init

余計な静的ファイルを見えないようにする

bower のパッケージを public の下にしたので、app.jsの静的ファイルのルーティングを修正して、余計なファイル(Bowerde 入れたパッケージの README.md とか)を見えないように、必要な物だけ見せるように設定する。

1
2
3
4
5
6

-app.use(express.static(path.join(__dirname, 'public')));
+app.use('/images', express.static(path.join(__dirname, 'public','images')));
+app.use('/javascripts',express.static(path.join(__dirname, 'public','javascripts')));
+app.use('/stylesheets',express.static(path.join(__dirname, 'public','stylesheets')));
+app.use('/semantic',express.static(path.join(__dirname, 'public','semantic')));
+app.use('/angular',express.static(path.join(__dirname, 'public','components','angular')));

AngularJS を入れる

1

$ bower install --save angular

あとは以下を参考に。

小ネタ

ファイル変更で自動サーバ再起動

1

$ npm install -g nodemon

以下のコマンドで起動する。

1

$ nodemon ./bin/www