勉強会JS編＜3＞フロントエンド開発環境構築 #JavaScript

node

node.jsとは

サーバーサイドJavaScriptの実行環境

設置

homebrewが設置されていない場合、設置する。
- homebrewはmacでパッケージを管理するためのツール
- macでパッケージを設置したい場合はhomebrewを使って管理したほうがいい。

  ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

nodeとnpmを分離して設置する。
- homebrewでnodeを設置した場合npmが一緒に設置される。
- npm update npm -gを実行するとエラーが発生するので、以下の手順で既存設置されたnodeをアンインストールし、nodeとnpmをそれぞれ設置する。

  rm -rf /usr/local/lib/node_modules
  brew uninstall node
  brew install node --without-npm
  echo prefix=~/.node >> ~/.npmrc
  curl -L https://www.npmjs.com/install.sh | sh

~/.nodeというディレクトリを確認する。
~/.node/binをPATHに追加する。

  export PATH="$HOME/.node/bin:$PATH"

設置途中でnpm関連エラーが発生する場合
- 古いバージョンのnodeを見ている可能性がある。
- brewで設置したnodeのバージョンとnode -vで確認したバージョンが一致しないとダメ。
- 古いバージョンのnode及びnpmを削除してもう一度上の手順でやり直し。

npm

npmとは

node.jsのモジュールを管理するためのツール
主要なモジュールを設置する。

  npm install -g phantomjs
  npm install -g backbone
  npm install -g bower
  npm install -g coffee-script
  npm install -g grunt-cli
  npm install -g yo
  npm install -g generator-backbone
  npm install -g generator-mocha
  npm install -g generator-backbone-mocha

設置結果

  [devnote@hooni:~] % npm ls -g --dept=0
  /Users/devnote/.node/lib
  ├── backbone@1.2.3
  ├── bower@1.7.2
  ├── coffee-script@1.10.0
  ├── generator-backbone@0.4.0
  ├── generator-backbone-mocha@0.1.1
  ├── generator-mocha@0.2.0
  ├── grunt-cli@0.1.13
  ├── npm@3.5.3
  ├── phantomjs@1.9.19
  └── yo@1.6.0

backbone.js：クライアントサイドフレームワーク
bower（バウワー）：フロントエンドライブラリの依存性管理ツール
coffee-script：javascriptをより簡単な文法で生成してくれるAltJS（JavaScript代替言語）
phantomjs：scriptable headless webkit（ブラウザが不要なjavascriptが実行できるwebkit）
yeoman（ヨーマン）：scaffolding tool
grunt：タスクを自動化するタスクランナー

参考書籍

JavaScript徹底攻略
JavaScriptエンジニア養成読本

勉強会JS編＜3＞ フロントエンド開発環境構築

関連記事

node

node.jsとは

設置

npm

npmとは

参考書籍

勉強会JS編＜3＞フロントエンド開発環境構築