爲何還要選擇angular與angular學前準備

哈哈[一臉尬笑]，算了，仍是別學angular了，來跟我學react吧。
修改於2017-11-29

爲何還要選擇angular

我知道這個時間段學習angular在大環境來看彷佛比較尷尬，並不是明智之舉，react如日中天，angular2即將發佈，angular1.x 已通過了大熱期，這是一個後angular時代。也有認真拜讀過網上各路大神的文章，對react的確定彷佛更多一點。

所以在決定學習angular以前，我有認真的學習過一段時間react。

react有許多很是優秀的特性，好比上手很容易，須要掌握的新東西並很少，咱們只須要跟着官方文檔動手寫一些demo就可以對react有一個比較直觀的瞭解，加上有平時許多的項目積累，每每在學習的時候就會不禁自主的想到用react來處理這些問題會如何，這種思考讓我更加快速的上手。因爲react自身的api並很少，所以經常須要藉助原生的js方法，這讓熟悉js的我感受更加親切。固然，由於沒有實際的將react運用於正式項目中，致使還有許多優勢我暫時體會不到，好比優秀的性能等。

可是對我我的來講，react仍是有許多我不太喜歡的特色。

react將大量html代碼，經過jsx寫在js文件裏，可我是一個重度依賴emmet插件寫html的人，html代碼跑到js文件裏去了，我就沒辦法快速的敲出html代碼了，必須一個字母一個字母的敲，這嚴重影響了個人開發效率。爲了找到可以彌補這塊的插件，我幾乎放棄atom，由於據說vscode對於jsx的支持程度很高，所以花了一成天的時間研究vscode，找相關的插件，可是無果。所以，若是使用react，就表示個人開發效率會嚴重受到影響，希望之後可以有強大的插件可以解決這個問題吧！

和angular相比，react並非一個完整的框架，它僅僅只是一個框架的v層。也就是常說的UI層。也就是說，若是咱們想要掌握好react，除了學習react自己，我還須要學習大量的其餘插件來擴充react的功能。這直接致使了學習成本的劇增。

react的組裝特性讓我沒有信心可以掌握好他。大一的時候上計算機組裝的某節課，有個十分使人討厭的老師在課上問我：咱們班有沒有同窗已經買過本身的電腦了？ 我舉手。 老師問：你是怎麼買的。 我很直接的回答道： 給了學校教學樓下那個商店老闆3000塊錢，給他說我想弄一臺玩遊戲的電腦，而後就讓他幫我弄了。被老師當面嘲笑。他認爲咱們學計算機的怎麼好意思讓別人組裝電腦！必定會被坑。然而事實證實，在玩了幾年大型燒顯卡遊戲以後，只有個人電腦還可以繼續high。一塊兒玩的那些同窗的電腦由於各類緣由早就歇菜了。 因此我一直認爲組裝是一個很是考驗水平的事情，並非誰都可以掌握好。

由於沒有過實際經驗，所以在面對一個項目的時候，我也不知道如何用react去構建一個項目纔算是一個比較好的方案，這讓我很是困惑，不知如何下手。

總之，諸多的緣由，讓我肯定，經過自學，也許我可以將react學會，但必定沒能力把它用好。由於我早早就感覺過，若是水平不夠，就算用世界上最優秀的框架，照樣可以寫出屎同樣的代碼。

從國內的實際環境來講，一個穩定的東西，纔是最值得信賴的，因此目前來講，至少尚未哪一個團隊會低看一個angular水平很高的人。

並且angular還有許多十分優秀的特色。

angular足夠穩定成熟，這麼多年來有許許多多的人分享了大量的使用經驗，咱們能夠找到許多優秀的文章。雖然初學angular時對於這種模式的不適應感比較明顯，所以形成了學習成本高的假象，可是認真學過來以後，感受其實將angular運用到一個比較好的程度，所花費的時間與精力確定要比react要少不少。對我來講，感覺最深的是在學自定義服務的時候，發現其實都是返回一個單例，這對於已經可以熟練使用js單例模式的我來講，就感受十分輕鬆了。

angular的官方文章足夠詳細。也就是說，若是咱們的英語足夠好，學習angular也會變得很容易。

angular的社區足夠成熟，目前已經有很是多成熟的第三方模塊，基本上能夠解決前端遇到的各類問題。

對我來講，還有一個重要的因素就是，住在我隔壁的大神強哥，以及辦公室坐在我背後老大，對angular的掌握都已經到了爐火純青的地步，遇到什麼難以解決的問題，問一問立馬就可以獲得解決[一臉賤笑]。

還有最重要的一點那就是：學好了angular，依然可以找到工做。

所以，全面分析了react與angular，並結合自身的實際狀況，最終仍是以爲，先把angular學比如較靠譜。

學前準備

廢話了那麼多，這篇文章其實主要是跟你們分享一下angular的學前準備的。下面一一列舉。

學習資源：

1. 英語好的，直接官方文檔
   docs.angularjs.cn/

2. 有秒味vip的能夠直接看視頻入門學習
   
   
   
   
   

   

3. angular中文社區
   angularjs.cn/ 有許多有價值的文章。
   

4. google 搜索
   遇到的問題百度搜索找到的東西大多數都跟屎同樣！因此，google搜索仍是很重要的，它可以帶咱們找到許多很是有價值的文章。
   

5. Plunker
   plnkr.co/
   專門用angular開發的在線coding工具，雖然界面比較醜，可是上面有許多有價值的demo，並且支持多文件，好比咱們須要寫一個路由相關的demo，那麼在Plunker上完成是最合適的。
   

插件

1. angular-ui
   在Atom上搜索 angularjs，做者名叫作angular-ui
   爲angular指令和angular的api提供代碼高亮的插件，方便咱們識別。

2. atom-ternjs
   api補全插件，支持包括ES5, ES6, node.js，angular等

1. Batarang
   Batarang 是一個chrome插件。是對chrome開發者工具的一個擴展。可用於視察基於angular的web應用程序，方便查看並可視化應用的運行時的特徵。

入門學習期間可重點關注的一些知識點：

1. 整個應用程序的執行順序
   config -> run -> directive compile -> controller -> directive link

2. 數據綁定及其原理
   關鍵詞：dirty checking, $diget, $watch, $apply

3. 做用域
   關鍵詞：$rootScope, $scope

4. 自定義指令
   關鍵詞：directive, $compile, link

5. 自定義服務
   關鍵詞：provider, factory, service

6. 指令間如何交互
   關鍵詞：require, controller, link

7. 如何有效的分層

8. 如何進行DOM操做
   關鍵詞：directive link

9. 路由
   ngRoute

10. 事件

11. 如何實現動畫
    關鍵詞 ng-if/ng-show/ng-hide ngAnimate

12. 異步編程
    $q, $http

由於我也剛開始學習不到半個月，所以若是在學習中你們發現更多值得學習的點，歡迎相互交流補充！

給本身準備一些實戰項目

我用angular將本身之前工做中作過的東西都抽空重作了一遍，感受學到了不少，對angular的掌握也逐步熟練，所以在這裏建議你們初學時可以找一些小項目來作，幫助很大。

好比官方爲你們提供的：phonecat

好比我想搞一個帳號密碼管理小工具，這是我正在準備抽空給本身作的，若是哪天弄完了能夠分享給你們

固然也能夠藉助angular將本身的我的博客弄成一個單頁應用。