Angular2でHelloWorld

みなさんこんにちは。技術推進部のhamaです。
昨年まではAndroidアプリの開発を行っていました。いまどきのJavaScriptのことはネットの記事でしか知りませんでしたが、最近Angular2でJavaScriptを検証する機会がありました。
環境構築はとても苦労する印象でしたが意外と簡単でしたので、今回はその時に行ったHelloWorldまでの手順を紹介します。

こちらを参考にしました。
https://github.com/angular/quickstart

事前準備

あらかじめgitクライアントをインストールします。
https://git-for-windows.github.io/

続いてNode.jsをインストールします。
https://nodejs.org/ja/download/

環境構築

ここからはコマンドを実行していきます。
Windowsの場合はスタートメニューや右クリックのメニューからGit Bashを起動します。
quickstartをgit cloneした後、rmでgit関連のファイルを削除します。

git clone https://github.com/angular/quickstart  my-proj
cd my-proj
rm -rf .git

実行するとこのようになります。

次にnpmパッケージをインストールし、ソースコードをコンパイルしてサーバーを起動します。
Node.jsのインストール先へPATH環境変数が設定されていない場合はnpmコマンドの前にNode.jsをインストールしたディレクトリまでフルパス指定してください。

npm install
npm start

もしくはフルパス指定して実行します。

コマンドが最後まで終わり、ブラウザでアクセスするとHelloWorldが表示されます。
http://localhost:3000/

カテゴリー: HTML5 タグ: , パーマリンク

コメントを残す

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