Angular4
の勉強してみようと思って、環境構築の方法を調べてたら、npm
を使ってAngular
をインストールする必要があるみたいなので、実際にインストールした時の手順をまとめました。
Angular4
の環境構築にはnpm
をインストールする前にNode.js
のインストールが必要ですが、Node.js
のインストール手順については、こちらを参考にしてもらえればと思います。

MacにNode.jsをインストールする
AngularJSの勉強してみようと思って、環境構築の方法を調べてたら、Node.jsをインストールする必要があるみたい...
npm(Node Packaged Module)とは

npm
Node.js
のパッケージマネージャです。Node.js
をインストールすると一緒にインストールされます。
Node.js
で利用するライブラリやパッケージの「インストール」「削除」「依存関係の整理」などを行うツールです。
Angularとは
オープンソースのフロントエンドWebアプリケーションフレームワークです。
詳しくはこちらを確認してもらえればと思います。
Angular
angular-cliインストール
もし、古いバージョンのangular-cli
をインストールしてる場合は、一度アンインストールしてからインストールする必要があります。
# 古いangular-cliをアンインストール
$ npm uninstall -g angular-cli
$ npm cache clear
# angular-cliインストール
$ npm install -g @angular/cli
Node.js
のバージョンは6.9.0
以上が必要です。
プロジェクトを作成する
# プロジェクトを作成するディレクトリに移動する
$ cd /path/to/project
# プロジェクトを作成する
$ ng new my-app
作成したプロジェクトを動かしてみる
下記コマンドを実行してプロジェクトを実行します。
$ cd my-app
$ ng serve --open
[–open]オプションを指定することで、http://localhost:4200
のURL
でブラウザが自動で起動します。
こんな画面が表示されれば成功です!!
最後に
以上、Angular4
の開発環境構築手順になります。
最近はフロントエンドとバックエンドを分離させる開発手法も流行っているので、Angular
に限らず、他のフロントエンドのWebアプリケーションフレームワークの動向もチェックしていきたいですね。
コメント