Windows8.1でAngular2を触ってみる

2016年10月4日

Angular2、何それ？おいしいの？

よくわからないが、Javascript(Typescript？)によるWEBフレームワークらしい。

何のためのフレームワークか、わたしにはよく分からない。

とりあえず、やってみる

（環境）
Windows8,1
C:\js\ フォルダに、angular2-quickstart フォルダを作成

Angluar2のクイックスタートとチュートリアルを実施 – その1
Angular2Angular2181JavaScriptJavaScript11012TypeScriptTypeScript674
gambareが2016/09/09に投稿(2016/09/23に編集)
http://qiita.com/gambare/items/e52b49c09890e1180610

の通りにやってみる。

（０）事前に必要なもの
npm
node.js
TypeScript

npmが入っているのは分かるが、node.js と、TypeScriptが入っているのかどうかは確認できず。。。たしか、以前、node.js　はインストールした記憶が、、、

TypeScriptはこれで入っているのかな？？？WARN　が出ているけど、、、

（１）プロジェクトの作成と設定

http://qiita.com/gambare/items/e52b49c09890e1180610#%E3%82%B9%E3%83%86%E3%83%83%E3%83%971%E3%83%97%E3%83%AD%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88%E3%81%AE%E4%BD%9C%E6%88%90%E3%81%A8%E8%A8%AD%E5%AE%9A

の通りに。

C:\js\ フォルダに、angular2-quickstart フォルダを作成

angular2-quickstart フォルダに、package.json、systemjs.config.js、tsconfig.json、typings.jsonを作成して、

https://angular.io/docs/ts/latest/quickstart.html#!#add-config-files

からコピペしてから、端末で、

npm install

結構時間がかかる。

（２）アプリケーションの作成

http://qiita.com/gambare/items/e52b49c09890e1180610#%E3%82%B9%E3%83%86%E3%83%83%E3%83%972-%E3%82%A2%E3%83%97%E3%83%AA%E3%82%B1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E3%81%AE%E4%BD%9C%E6%88%90

の通りにやるだけ。

C:\js\angular2-quickstart フォルダに、app フォルダを作成し、さらにその下に、

app.module.ts
app.component.ts
main.ts

を作成し、上記サイトの内容をコピペ。

（３）WEBページを作る。

C:\js\angular2-quickstart フォルダに、以下の２つを作成して、上記サイトの内容をコピペ。

index.html
styles.css

そうしてから、端末で、

npm start

すると、自動的に、ブラウザが立ち上がり、以下のように表示される。

とりあえず、ここまで。

次は、以下をやってみたい。

Angluar2のクイックスタートとチュートリアルを実施 – その2
Angular2Angular2181JavaScriptJavaScript11014TypeScriptTypeScript674
gambareが2016/09/12に投稿(2016/09/16に編集)
http://qiita.com/gambare/items/52ab19f8937ffc228cec