對於「前端」開發咱們須要什麼？

來自：http://lcepy.github.io/2015/07/20/%E5%AF%B9%E4%BA%8E%E2%80%9C%E5%89%8D%E7%AB%AF%E2%80%9D%E5%BC%80%E5%8F%91%E6%88%91%E4%BB%AC%E9%9C%80%E8%A6%81%E4%BB%80%E4%B9%88%EF%BC%9F/

我始終認爲「工具」是第一輩子產力，爲何說英國「第一次工業革命」開始，蒸氣機的發明，「工具」變的很是重要，可是有時候又會想， 真的如此麼？我在家鄉湘西地區開始生態農業的試驗，更多的是對生物多樣態的利用和研究，食物鏈的結合轉化，才能生產出有機食材，測量工具的使用功不可沒。

那麼「前端」咱們須要什麼樣的工具？

Mac OS X 是基於 Unix 的，這過重要了，這意味着Unix下一堆好東西能夠隨便撿，相信我，你值得擁有。在Mac上的開發環境，各類shell，應有盡有，不要客氣，隨便用。而 且Mac的工具以及操做方式，能讓你沉浸在編程的世界中，這無形中提高了程序員的生產構思的效率。

有了retina顯示屏你會更追究細節，我本身一向追崇「細節」決定一切，好的產品，細節會讓人感受很舒服，纔會留住「回頭客」。

因此Mac OS X 也是迄今爲止我認爲開發最好的工具，無論從程序的運行效率，工具的多樣性，以及兼容unix來看，這都是我惟一的選擇。

廢話很少說，推薦一本書池建強老師的書《MacTalk 人生元編程》,推薦一個開源項目收集&推薦優秀的 Apps/硬件/技巧/周邊等，以及總結我的2015提升前端效率的方法和工具，不來看看絕對是你的損失。

在上一篇博文中闡述了我我的使用的提升效率的工具和方法，而今天，我想更進一步的闡述一些這麼多年來的總結：咱們須要什麼？

狀態

就目前的形勢來看「前端」這個行業的熱火程度，應該能夠用「爆發式」來描述，不論是PC端的原始開發技術， 移動端這幾年膨脹的「框架」，手機App混合開發的ionic以及react native，連接硬件的cylonjs和osbean，服務端的Nodejs，都預示着「前端」應該說是JavaScript這門語言的可應用程度，超 出了不少人的預期，那麼我須要問本身，「學的完嗎？」

顯而易見，學不完。

該如何起航

若是是一個初學者，我想極可能會被這「玩意」嚇着了，平心而論，咱們應該學會適應它，從你的職業規劃中尋找一個方向，方向會指引你的路途，佛教中講述「方向」是從修行者的實際出發，那麼咱們，也應該從你的職業規劃中出發，找尋一個方向。

一些借鑑該如何起航：

就初學來看HTML，CSS，JavaScript是你惟一的入門方式，若是反過來，我真心的推薦Apple的Swift作爲你的入門語言，爲何？由於你須要瞭解程序的實質是什麼，Swift能夠很好的讓你瞭解什麼是類型系統，什麼是面向對象，什麼是編譯器。

瞭解「程序」是你起航的開始。

====

前端多是這樣的

分類	技術表明	評價
PC	原始生產HTML，CSS，JavaScript，最有表明的技術是jQuery	相信是大多數人的入門，適合傳統頁面的編程。
PC	開始考慮模塊以及代碼結構，最有表明的技術是RequireJS和Backbone.js，這一階段也會使用了一些工具函數庫，開始流行自動構建工具，好比Underscore.js和Grunt	相信你們到了這個階段，也是Ajax使用最多的時候，無刷新頁面，客戶端模板也開始應用。
PC	從Angular開始，整個業界開始風靡雙向綁定，依賴注入，自動化測試，Nodejs愈來愈多的應用在「前端」領域中，國內比較有表明的是司徒正美老師的avalon和尤小右老師的vue	WebApp興起，以及硬件設備愈來愈給力的計算能力和內存利用率，意味着「前端」開始更加的追求體驗，細緻，的問題
PC	reactjs的出現，又開啓了一次新的嘗試，Nodejs也開啓了從分裂成iojs，又合併成爲了Nodejs的進程	Nodejs開始對於前端的工程化愈來愈重要，想一想你使用的工具，多多少少都構建在Nodejs之上。
PC	將來我的感受web components，編譯型的JavaScript會成爲不少團隊的首選選擇，好比Flow，TypeScript	編譯能夠減小在運行時的錯誤，能夠檢查代碼有利於維護。
Mobile	基於HTML5，CSS3編寫的頁面，好比營銷廣告，最有表明性的技術是Zepto，基於它的效果插件很是多	也許你們開始適應了沒有960px像素的時候
Mobile	HTML5單頁應用的出現	大多數人會選擇把PC端WebApp實現的技術移到這裏來，相應的HTML5，CSS3技術開始大量的使用
Mobile	HTML5遊戲的出現，《神經貓》在微信中的瘋傳，最有表明性的技術是COCOS2D-JS	遊戲是你複習數學幾何知識最好的基友
Mobile	PhoneGap的出現，讓使用HTML CSS JavaScript開發App成爲了可能	探索與摸索
Mobile	ionic讓Angular與Apache Cordova結合開啓了高級HTML5混合移動應用開發框架的進程，它最有表明性。	利用HTML5 CSS3 JavaScript編寫的大量應用開始在市場上能夠被找到。
Mobile	React Native讓開發移動App有了一個新選擇，雖然它實現的邏輯，已經有不少人在從前就實現了，可是願意嘗試使用這個技術的人仍是蠻多的	經過中間語言JavaScript轉換成Native語言實現，雖然只有UI
Mobile	將來我的感受HTML5 CSS3 JavaScript會成爲不少團隊開發App首選選擇，拋開一些（遊戲）等須要高性能，複雜動畫的領域，爲何？	快速，簡單，週期短，試錯的機會增長
Server	Node.js我相信這應該是最有表明性的，並且將來也會愈來愈重要	使用JavaScript的用戶數量巨大，服務器知識的普及，會讓學習成本低
Database	MongoDB應該是在這個領域比較有表明性	數據庫的出現，讓存儲的解決方案成爲了可能
Docker	也許你應該要了解一下什麼是Docker	你的開發效率會進一步提高
硬件領域	據說有人使用cylonjs開發機器人	國內也有一家公司推出了智能機器控制器與快速開發框架，嗨，JavaScript已經入侵硬件領域了
自動化	最有表明的應該是Grunt	可是你依然有不少選擇，gulp是其中之一
2015年	經過了ES2015，也許你目前還不清楚這是什麼，那麼我告訴你，這就是ECMA6，隨着今年（2015）Apple WWDC和Google I/O的落幕，一大波的硬件，軟件即將更新，數不盡的各類服務類SDK，以及HTML5 Device Api	少年，將來的你面對無盡的學習，以及從PC切換到移動的思惟邏輯，可能還有可穿戴設備喔

寫到這裏，本身都有點感慨，原來這纔是「前端」，在這個拼快速迭代，拼細緻，拼用戶體驗的時代，若是你只具有div+css佈局，會寫一點動畫效果，無疑在下一個五年極可能會被淘汰。

咱們須要什麼？

就工做來看移動確定是大頭，那麼咱們還須要PC麼？也須要，畢竟不少場景仍是要在電腦上完成，好比在工做時，你可能就在工做的電腦上，瀏覽一些網站，下訂單，市場大不大？上班的人有多少，它就有多大。

作爲一個過來人，我很認真的說，咱們須要的是解放本身的心。一句老話，心有多大，你前進的力量就有多大。也許你不在編程領域，你的風采也會在別的領域綻開。

那麼，不巧，你選擇了「前端」，你還須要堅決的信念，信念是你能夠堅持下去的基石，是你不斷提升本身專業的力量源泉，不少人說編程是一個青春飯，我 我的以爲編程是一次青春思想的解放，是邏輯思惟造成的開始，它帶給你的無形價值勝於「錢」這樣的有形價值，雖然「錢」也很重要。

你還須要規劃，這幾日我經常坐在雪峯山的山頭看星空，愈加的感受到我的的眇小，以及時間的寶貴，若是你不規劃，只會讓時間消耗在不少瑣碎的事情上，學習不成系統，實踐沒有沉澱。人腦是一個容器，可是隨着時間，不少信息片斷將被遺忘。

你還須要「放棄」，學會放棄可能很艱難，確實，放棄是你一切的開始，無論以前或者以後，你都要有一個從零開始的心態，面對這些孜孜不倦。

下雨天，我也會瞪着三輪車去拖木屑，固然我指的放棄不是說放棄你的領域，而是要保持敬畏，生活就是這樣，拖完木屑，我會到下河街去吃完米豆腐和米粉，

最後你還須要前瞻性，瞭解技術將來的發展趨勢，你才能跟上隊伍。

孜孜不倦

前端對於你來講，這纔剛剛開始。

我的建議：

• Swift是你瞭解編程，很好的去處中文版 Apple 官方 Swift 教程《The Swift Programming Language》，如今已經開啓Swift 2.0翻譯了喲～

• 開始學習CSS佈局咯學習CSS佈局也順便學習一下HTML（不要看我，這個真的很是簡單），再來份指導吧，更易理解通用 CSS 筆記、建議與指導

• 瞭解一下基礎的JavaScriptJavaScript 標準參考教程（alpha）順便再看一下簡單使用jQuery

恭喜你，你能夠作一些PC的網站了。

---

• 如今咱們開始嘗試看一下編程的風格指南Airbnb 英文，中譯，以及Google JavaScript Style Guide，良好的習慣，是你能夠進一步的基礎。

• 湯姆大叔翻譯的深刻理解JavaScript系列（可能有點老了，印象中仍是三,四年前閱讀過），不過沒關係只要不是ES2015，它還有用，順便若是有時間，也能夠看一下《JavaScript 模式》

• 建議，從Angular開始，學習一個MVVM框架（其實它也是能夠當作」MVC」喔，只不過C變成了ViewModel），一個入門的資源AngularJS入門教程——AngularJS中文社區提供，而後再來一個進一步的翻譯「AngularJS」中譯本 -《AngularJS》，以及模塊化思想。

• 而後學習，你的第一款自動化構建工具吧gulp，全中文的喔，少年，Gulp

又要恭喜親了，刷副本要升級了，如今你能夠嘗試一下WebApp了。

---

• 進一步改變咱們開發的方式，學習一下git，據說這玩意猴子都能學會。

• 開始嘗試學習一下HTML5，API真的很全和CSS3CSS3 Tutorial 《CSS3 教程》，這玩意，你不學，我只能告訴你絕對吃虧。

• 準備好總結的項目Mars-騰訊移動Web前端知識庫和之前認識的一個朋友搞的開源總結mobileTech，順帶看一看zepto，是否是跟jQuery很像呀？

• Nodejs也是不能錯過的七天學會NodeJS

這一次，你還未升級，不過能夠開始嘗試作一些基於Nodejs的工具，和HTML5手機網站，小同志，你有向移動傾向咯。

---

• Mac工具，是你最好的良師益友，向某人給你推薦總結我的2015提升前端效率的方法和工具
• 能夠看一看ECMA6和promises了
• 學習一下混合開發的框架ionic
• Nodejs也順帶看一看吧《Node.js 包教不包會》

這一次，ding了，快來行動吧，兄弟，製做你的第一款App併發布到市場

---

目前爲止，「前端」的基礎打好了。

將來

多屏設備是你盡心盡力的戰場，可否勝利，一切在於你的信念，勇氣，規劃和「放棄」。