Angular2入門系列教程1-使用Angular-cli搭建Angular2開發環境

　　一直在學Angular2，百忙之中抽點時間來寫個簡單的教程。

　　2016年是前端飛速發展的一年，前端愈來愈造成了（web component）組件化的編程模式；之前Jquery通吃一切的田園時代一去不復返，若是你想了解前端最近究竟有什麼變化，不妨去看看這篇文章：在2016年學習javascript是一種什麼樣的體驗？

　　在學習以前，你可能須要先粗略瞭解幾個東西！

　　1.nodejs

　　2.npm 包管理

　　如下的東西就當你是知道了這些概念了

     1.首先，到nodejs 官網下載nodejs並安裝

　　

 

　　2.添加淘寶的npm鏡像（因爲國內訪問國外網站的速度實在是太慢了），因爲咱們只有要用到的一些東西，咱們採用如下的添加鏡像方法

　　（windows 用戶使用cmd，輸入如下命令，新手請去看看npm使用教程吧）
　　　　npm config set registry https://registry.npm.taobao.org 
　　值得說明一下的是不要直接使用淘寶的npm官方鏡像安裝模式，這樣咱們只能使用cnpm命令，而Angular-cli建立新項目的時候是直接使用的npm，
會致使訪問速度奇慢，直接使用上面的這個命令就好了

 3.使用npm 安裝Angular-cli

　　Angular-cli是angular團隊針對Angular2提供的腳手架，用於環境搭建，運行等；具體參考Angular-cli GitHub
　　在命令行中輸入 

　　npm install -g angular-cli 

　　以後咱們就能夠在全局使用ng命令了

　　4.使用Angular-cli搭建開發環境

　　首先到你的工做目錄下創建Angular工程目錄
　　而後而後用命令行進入該目錄，輸入
　　ng new projectName
　　
　　而後腳手架會幫咱們搭建初始環境，因爲初始化的時候Angualr-cli會去初始化node-modules依賴，因此會比較慢；若是沒有切換淘寶鏡像，那不是通常的慢
　　


　　最終安裝好了是這樣的

　　

　　5.　　運行Angular

　　這個時候整個Angular2已經搭建好了，命令行進入進入剛纔的工程目錄，輸入

　　ng serve

　　Angular-cli會編譯整個項目，只有打開localhost:4200 （能夠切換其餘端口，具體參考Angular-cli的使用）就能夠看到效果了

　　

　　關於工程目錄結構是下面這個樣子的

　　

 

　　

　　 結束語：Angular2可使用javascript,typescript,dart來編寫;我的推薦使用typescript來編寫。TypeScript最近也發佈了2.1版本，咱們可使用可愛的Async/await來編寫咱們的項目了。Angular2有專門的中文官方網站Angular.cn,上面有對全部的概念的詳細的解釋，而且有一個完整小項目的教程，頗有幫助；還有，我推薦你們使用我寫的模式來搭建本身的Angular項目，一方面Angualr-cli是官方出的腳手架（雖然仍是beta版），另外一方面，你若是本身獨立去使用Webpack或者SystemJs又增長了學習難度，項目出錯你都不知道是代碼錯了仍是打包的問題！

　　代碼編輯器推薦兩個：vs code和sublime;

　　有些人學習前端不知道該學哪一個框架，就我而言，目前值得學習和廣爲大衆接受的是Vue.js,angular,reactjs;我受不了React語法，pass;vue有着簡單的結構，容易上手且速度很快，可是Angular更像是一個工業級別的產品，工程化程度更高，並且有着web app 開發神器IONIC，是一個很是不錯的選擇!

　　之後的文章會開始介紹Angular2的語法等

　　更新ing。。。