Angular2 是現在比較新的網頁制作技術，加上自己對網頁制作比較感興趣。因此對該技術比較感興趣，所以現在開始學習該技術。我使用的教材是Ang-book 2，另外還有一本 Angular 2 Development on Typescript。Ang-book 2算是Angular2的官方文檔，因此打算從Angular開始學習。

之前其實已經看了幾十頁了，不過之前都沒有系統的記筆記。因此打算從到再來！本來之前已經把環境搭好了的，但是折騰了以下Deepin系統，把在windows上建好的環境全部干掉了。今天才把Angular的環境完全搞定。

Step1： IDE

工欲善其事，必先利其器。選擇一款自己喜歡的IDE是很有必要的，就這幾年的學習情況來看。我個人是很喜歡簡潔、深色的工作環境的。現在主要工作是在一家土木公司做安卓程序開發，所以用的環境除了Android Studio外，還有個人十分喜歡的一款IDE產品，Intelij IDEA。Angular屬于Web APP開發的范疇，本來應該裝一個WebStorm的，不過Intelij IDEA裝一個Angular JS的插件，妥妥的就是WebStorm了。

Step2：Node

在Angular的學習過程中，不一定要用到Node js，不過Node提供了包管理軟件npm，一些環境需要使用npm來搭建。Node的安裝在官網下載MSI文件就好。Node安裝好之后，就可以使用npm來安裝Angular的命令行工具了。但是npm由于國內的種種，訪問很慢，因此可以換成淘寶的源。可以安裝cnpm使用淘寶在國內的鏡像：

npm install -g cnpm --registry=https://registry.npm.taobao.org

安裝完成后就可以使用cnpm安裝包了，用法和npm幾乎一樣。

Step3：Typescript

安裝Typescript的過程比較順利，運行：

cnpm install -g typescript

一次成功！！！！

Step4：@angular/cli

angular/cli是Angular的命令行工具，用來自動生成一些代碼。因此該工具對于Angular的開發工作來說應該是必備神器啊。使用cnpm安裝就可，但是教材上使用的命令是：

npm install -g angular-cli

安裝完成后就可以使用ng命令了。不過可能是我安裝的node版本比較新的問題，運行ng后提示angular-cli將會在下一個發行版本更名為@angular/cli，于是我又重新安裝了@angular/cli：

cnpm install -g @angular/cli

Step5：Python

node的運行是需要python支持的，因此還要在電腦上安裝python。python的安裝方法可以使用windows平臺上的一個包管理工具chocolatey（類似于linux上的apt-get），chocolatey的安裝方法可以自行百度。安裝好chocolatey后，就可以使用choco install packagename來安裝你想要的軟件了~~~~ such as：

choco install python

這個命令安裝的python版本是v3.6.0，足夠node的運行需要了。

Step6：Hello World

Hello World的意義不多說，對于每一門語言，成功運行個Hello World足以讓很多學習人員開心半天！！！Hello World是有故事的有，看到這篇文章的人一定要百度到了評論告訴我，因為我忘了這個故事了！！！首先，我需要跟著Ang-book 2的指導，新建我的第一個Hello World On Angular2項目，建立項目可以使用ng命令來完成：

ng new projectname

如我的第一個Hello項目：ng new AngTe

等了longlongatime以后，終于搞定了。

接著使用：

ng serve

就可以編譯你的項目并運行了，在瀏覽器打開 http://localhost:4200即可，發個圖慶祝一下：

看到app works就說明你的第一個hello 項目已經成功了，雖然不是輸出的hello world，但畢竟整個過程沒有自己些一行代碼呢~

Step7：today‘s note

component是Angular特有的，它的前身是AngularJS1中的directives。簡單一點就是你實現的一個個想讓瀏覽器展示的個中組件啦，比如一個componet叫weather，你定義后之后，在頁面上寫一個weather標簽，瀏覽器就直接給你顯示天氣信息了。

annotation：這個真不是什么神奇的東西，相比大家在java中已經見過了把，比如@Override。中文翻譯是注解，其實就是給編譯器看的一些預編譯信息，告訴編譯器我這里想搞什么事，你配合配合就好，不要用編譯錯誤和我嗶嗶。

今天就寫道這里了，如果這邊文章通不過審核，那就自己留著，備以后復習之用。如果有幸被感興趣的同學們看到，希望能被指點指點，一起進步~