2016年前端開發學習計劃

時間 2019-11-16

標籤 2016年前端開發學習計劃简体版

原文原文鏈接

2015年，軟件開發界發生了不少變化。有不少流行的新語言發佈了，也有不少重要的框架和工具發佈了新版本。下面有一個咱們以爲最重要的簡短清單，同時也有咱們以爲值得你在2016年花時間精力去學習的新事物的一些建議。
javascript

1、開發工具

1. atom

Atom 代碼編輯器支持 Windows、Mac、Linux 三大桌面平臺，徹底免費，而且已經在 GitHub 上開放了所有的源代碼。在通過一段長時間的迭代開發和不斷改進後，Atom 終於從早期的測試版達到了 1.0 正式版了！相比以前的版本，在性能和穩定性方面都有着顯著的改善。css

2. idea

IDEA 全稱IntelliJ IDEA，是java語言開發的集成環境，IntelliJ在業界被公認爲最好的java開發工具之一，尤爲在智能代碼助手、代碼自動提示、重構、J2EE支持、Ant、JUnit、CVS整合、代碼審查、創新的GUI設計等方面的功能能夠說是超常的。IDEA是JetBrains公司的產品，這家公司總部位於捷克共和國的首都布拉格，開發人員以嚴謹著稱的東歐程序員爲主。html

3. webpack

webpack是近期最火的一款模塊加載器兼打包工具，它能把各類資源，例如JS（含JSX）、coffee、樣式（含less/sass）、圖片等都做爲模塊來使用和處理。前端

4. gulp

Gulp.js 是一個自動化構建工具,開發者可使用它在項目開發過程當中自動執行常見任務。Gulp.js 是基於 Node.js 構建的,利用 Node.js 流的威力,你能夠快速構建項目...html5

5. lodash

lodash一開始是Underscore.js庫的一個fork，由於和其餘(Underscore.js的)貢獻者意見相左。John-David Dalton的最初目標，是提供更多「一致的跨瀏覽器行爲……，並改善性能」。以後，該項目在現有成功的基礎之上取得了更大的成果。最近lodash也發佈了3.5版，成爲了npm包倉庫中依賴最多的庫。它正在擺脫屌絲身份，成爲開發者的常規的選擇之一。java

6. fetch

對於 AJAX，如今通常都是使用各類框架實現，其本質是 XMLHttpRequest。使用過原生XMLHttpRequest的人都知道，這種方法實現起來不太方便。如今，咱們有了新的選擇：Fetch API。node

7. Electron

Electron 框架的前身是 Atom Shell，可讓你寫使用 JavaScript，HTML 和 CSS 構建跨平臺的桌面應用程序。它是基於io.js 和 Chromium 開源項目，並用於在 Atom 編輯器中。Electron 是開源的，由 GitHub 維護，有一個活躍的社區。最重要的是，Electron 應用服務構建和運行在 Mac，Windows 和 Linux。mysql

2、javascript框架

1. angular2

跨平臺開發

學習如何基於 Angular 構建應用程序，並複用代碼和技能來構建適用於全部平臺的應用。好比： Web 應用、移動 Web 應用、原生移動應用和原生桌面應用等。react

速度與性能

經過 Web Worker 和服務端渲染，達到在現在 ( 以及將來）的 Web 平臺上所能達到的最高速度。
Angular 讓你有效掌控可伸縮性。基於 RxJS 、 Immutable.js 和其它推送模型，能適應海量數據需求。jquery

美妙的工具

使用簡單的聲明式模板，快速實現各類特性。使用自定義組件和大量現有組件，擴展模板語言。在幾乎全部的 IDE 中得到針對 Angular 的即時幫助和反饋。全部這一切，都是爲了幫助你編寫漂亮的應用，而不是絞盡腦汁的讓代碼「能用」。

2. react+redux

React+Redux很是精煉，良好運用將發揮出極強勁的生產力。但最大的挑戰來自於函數式編程（FP）範式。在工程化過程當中，架構（頂層）設計將是一個巨大的挑戰。要否則作出來的東西多是一團亂麻。說到底，傳統框架與react+redux就是OO與FP編程範式的對決。

3. jquery

JQuery是繼prototype以後又一個優秀的Javascript庫。它是輕量級的js庫，它兼容CSS3，還兼容各類瀏覽器（IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+），jQuery2.0及後續版本將再也不支持IE6/7/8瀏覽器。

4. antd

Ant Design 是螞蟻金服開發和正在使用的一套企業級的前端設計語言和基於 React 的前端框架實現。企業級金融產品的交互語言和視覺體系。豐富實用的 React UI 組件。基於 React 的組件化開發模式。背靠 npm 生態圈。基於 webpack 的調試構建方案，支持 ES6。

3、node相關技術

1. npm

NPM（node package manager），一般稱爲node包管理器。顧名思義，它的主要功能就是管理node包，包括：安裝、卸載、更新、查看、搜索、發佈等。

2. express

Express 是一個基於 Node.js 平臺的極簡、靈活的 web 應用開發框架，它提供一系列強大的特性，幫助你建立各類 Web 和移動設備應用。

3. koa2

koa 是由 Express 原班人馬打造的，致力於成爲一個更小、更富有表現力、更健壯的 Web 框架。使用 koa 編寫 web 應用，經過組合不一樣的 generator，能夠免除重複繁瑣的回調函數嵌套，並極大地提高錯誤處理的效率。koa 不在內核方法中綁定任何中間件，它僅僅提供了一個輕量優雅的函數庫，使得編寫 Web 應用變得駕輕就熟。

4. rxjs

是一組庫使用可觀察到的集合和陣列、演員風格組成，組成異步和基於事件的程序。

5. zonejs

在ng2的開發過程當中，Angular團隊爲咱們帶來了一個新的庫 – zone.js。zone.js的設計靈感來源於Dart語言，它描述JavaScript執行過程的上下文，能夠在異步任務之間進行持久性傳遞，它相似於Java中的TLS（thread-local storage: 線程本地存儲）技術，zone.js則是將TLS引入到JavaScript語言中的實現框架。

4、設計模式

1. javascript設計模式

5、編程語言

1. javascript

JavaScript一種直譯式腳本語言，是一種動態類型、弱類型、基於原型的語言，內置支持類型。它的解釋器被稱爲JavaScript引擎，爲瀏覽器的一部分，普遍用於客戶端的腳本語言，最先是在HTML（標準通用標記語言下的一個應用）網頁上使用，用來給HTML網頁增長動態功能。

2. ecmscript6

ES6是繼ES5以後的一次主要改進，語言規範由ES5.1時代的245頁擴充至600頁。ES6增添了許多必要的特性，例如：模塊和類，以及一些實用特性，例如Maps、Sets、Promises、生成器（Generators）等。儘管ES6作了大量的更新，可是它依舊徹底向後兼容之前的版本，標準化委員會決定避免由不兼容版本語言致使的「web體驗破碎」。結果是，全部老代碼均可以正常運行，整個過渡也顯得更爲平滑，但隨之而來的問題是，開發者們抱怨了多年的老問題依然存在。

3. typesript

typescript是JavaScript的超集。TypeScript是JavaScript類型的超集，它能夠編譯成純JavaScript。TypeScript能夠在任何瀏覽器、任何計算機和任何操做系統上運行，而且是開源的。

6、數據存儲

1. mysql

MySQL是一個關係型數據庫管理系統，由瑞典MySQL AB 公司開發，目前屬於 Oracle 旗下公司。MySQL 最流行的關係型數據庫管理系統，在 WEB 應用方面MySQL是最好的 RDBMS (Relational Database Management System，關係數據庫管理系統) 應用軟件之一。

2. mongodb

MongoDB 是一個基於分佈式文件存儲的數據庫。由 C++ 語言編寫。旨在爲 WEB 應用提供可擴展的高性能數據存儲解決方案。MongoDB 是一個介於關係數據庫和非關係數據庫之間的產品，是非關係數據庫當中功能最豐富，最像關係數據庫的。

3. redis

Redis是一個開源的使用ANSI C語言編寫、支持網絡、可基於內存亦可持久化的日誌型、Key-Value數據庫，並提供多種語言的API。

4. cookie

Cookie，有時也用其複數形式Cookies，指某些網站爲了辨別用戶身份、進行session跟蹤而儲存在用戶本地終端上的數據（一般通過加密）

5. access token

Windows操做系統安全性的一個概念。一個訪問令牌包含了此登錄會話的安全信息。當用戶登錄時，系統建立一個訪問令牌，而後以該用戶身份運行的的全部進程都擁有該令牌的一個拷貝。該令牌惟一表示該用戶、用戶的組和用戶的特權。系統使用令牌控制用戶能夠訪問哪些安全對象，並控制用戶執行相關係統操做的能力。有兩種令牌：主令牌和模擬的令牌。主令牌是與進程相關的；模擬的令牌是與模擬令牌的線程相關的。

7、html5+css3

1. html5

HTML5是HTML最新的修訂版本，2014年10月由萬維網聯盟（W3C）完成標準制定。
HTML5的設計目的是爲了在移動設備上支持多媒體。
HTML5 簡單易學。

2. ejs

EJS是一個JavaScript模板庫，用來從JSON數據中生成HTML字符串。引入EJS 建立一個模板使用視圖工具組件與最初的JavaScript相比較，一些不太瞭解你的代碼的人能夠更容易地經過EJS模板代碼看得懂你的代碼。讓咱們放鬆一下，一塊兒來享受下使人激動的乾淨簡潔的感受。

3. canvas

TML5 <canvas> 標籤用於繪製圖像（經過腳本，一般是 JavaScript）。不過，<canvas> 元素自己並無繪製能力（它僅僅是圖形的容器） - 您必須使用腳原本完成實際的繪圖任務。getContext() 方法可返回一個對象，該對象提供了用於在畫布上繪圖的方法和屬性。

4. css3

CSS3是CSS技術的一個升級版本，是由Adobe、Systems、Apple、Google、HP、IBM、Microsoft、Mozilla、Opera、Sun Microsystems 等許多WEB界的巨頭聯合組織的一個名爲「CSS Working Group」的組織共同協商策劃的。雖然目前不少細節還在討論之中，但它仍是不斷地朝前發展着。2010年在HTML5成爲IT界人士關注的焦點的同時，它也開始慢慢地普及開來。

5. sass

SASS是一種CSS的開發工具，提供了許多便利的寫法，大大節省了設計者的時間，使得CSS的開發，變得簡單和可維護。

6. postcss

PostCSS 是使用 JS 插件來轉換 CSS 的工具，支持變量，混入，將來 CSS 語法，內聯圖像等等。
PostCSS 已經被許多大公司使用：谷歌，推特，阿里巴巴和 Shopify。 Autoprefixer PostCSS 插件是最流行的 CSS 處理器插件之一。

7. 白鷺引擎

白鷺引擎是一個開源的、跨平臺的手機遊戲開發引擎,你能夠快速地建立HTML5類型的移動遊戲,也能夠將遊戲項目編譯輸出成爲目標移動平臺的原生遊戲應用。

8、算法和數據結構

1. 線型查找

在一列給定的值中進行搜索，從一端開始逐一檢查每一個元素，直到找到所需元素的過程。線性查找又稱爲順序查找·若是查找池是某種類型的一個表，好比一個數組，簡單的查找方法是從表頭開始，一次將每個值與目標元素進行比較，最後，或者查找到目標，或者達到表尾，而目標不存在於組中，這個方法稱爲線性查找。

2. 二分查找

二分查找又稱折半查找，優勢是比較次數少，查找速度快，平均性能好；其缺點是要求待查表爲有序表，且插入刪除困難。所以，折半查找方法適用於不常常變更而查找頻繁的有序列表。首先，假設表中元素是按升序排列，將表中間位置記錄的關鍵字與查找關鍵字比較，若是二者相等，則查找成功；不然利用中間位置記錄將表分紅前、後兩個子表，若是中間位置記錄的關鍵字大於查找關鍵字，則進一步查找前一子表，不然進一步查找後一子表。重複以上過程，直到找到知足條件的記錄，使查找成功，或直到子表不存在爲止，此時查找不成功。

3. 冒泡排序

冒泡排序（Bubble Sort），是一種計算機科學領域的較簡單的排序算法。它重複地走訪過要排序的數列，一次比較兩個元素，若是他們的順序錯誤就把他們交換過來。走訪數列的工做是重複地進行直到沒有再須要交換，也就是說該數列已經排序完成。

4. 選擇排序

選擇排序（Selection sort）是一種簡單直觀的排序算法。它的工做原理是每一次從待排序的數據元素中選出最小（或最大）的一個元素，存放在序列的起始位置，直到所有待排序的數據元素排完。選擇排序是不穩定的排序方法（好比序列[5， 5， 3]第一次就將第一個[5]與[3]交換，致使第一個5挪動到第二個5後面）。

5. 插入排序

插入排序的基本思想是：每步將一個待排序的紀錄，按其關鍵碼值的大小插入前面已經排序的文件中適當位置上，直到所有插入完爲止。

6. 字符串反轉

var str = '123';
var newStr = str.split("").reverse().join("");
alert(newStr);

7. 搜索算法

搜索算法是利用計算機的高性能來有目的的窮舉一個問題解空間的部分或全部的可能狀況，從而求出問題的解的一種方法。搜索算法其實是根據初始條件和擴展規則構造一棵「解答樹」並尋找符合目標狀態的節點的過程。

8. 貪心算法

貪心算法（又稱貪婪算法）是指，在對問題求解時，老是作出在當前看來是最好的選擇。也就是說，不從總體最優上加以考慮，他所作出的是在某種意義上的局部最優解。貪心算法不是對全部問題都能獲得總體最優解，關鍵是貪心策略的選擇，選擇的貪心策略必須具有無後效性，即某個狀態之前的過程不會影響之後的狀態，只與當前狀態有關。

9. tween算法

Flash作動畫時會用到Tween類，利用它能夠作不少動畫效果，例如緩動、彈簧等等。

10. javascript算法庫

9、測試框架

1. mocha

mocha 是一個簡單、靈活有趣的 JavaScript 測試框架，用於 Node.js 和瀏覽器上的 JavaScript 應用測試。Mocha 是具備豐富特性的 JavaScript 測試框架，能夠運行在 Node.js 和瀏覽器中，使得異步測試更簡單更有趣。Mocha 能夠持續運行測試，支持靈活又準確的報告，當映射到未捕獲異常時轉到正確的測試示例。

2. karma

Karma是Testacular的新名字，在2012年google開源了Testacular，2013年Testacular更名爲Karma。Karma是一個讓人感到很是神祕的名字，表示佛教中的緣分，因果報應，比Cassandra這種名字更讓人猜不透！Karma是一個基於Node.js的JavaScript測試執行過程管理工具（Test Runner）。該工具可用於測試全部主流Web瀏覽器，也可集成到CI（Continuous integration）工具，也可和其餘代碼編輯器一塊兒使用。這個測試工具的一個強大特性就是，它能夠監控(Watch)文件的變化，而後自行執行，經過console.log顯示測試結果。