一、前端開發(fā)簡介
? ? ?前端開發(fā)目前來說是一個(gè)比較火的一個(gè)行業(yè)，而且隨著移動(dòng)互聯(lián)網(wǎng)的發(fā)展，還有各種框架的出現(xiàn)，前端這幾年只會(huì)越來越火，因?yàn)槌藈eb端，我們還可以用來開發(fā)一個(gè)web版的app、微信小程序等，react-native的出現(xiàn)，我們還可以開發(fā)原生app。
? ? ?所以，未來幾年，前端開發(fā)也是一個(gè)非常稀缺的工種。因?yàn)樽罱容^多人問我如何來學(xué)習(xí)前端，以及怎樣比較快的入門前端，所以我整理了一篇文章，希望對大家有所幫助。
? ? ?本文是針對于沒有經(jīng)驗(yàn)的前端小白，如果你有前端開發(fā)的工作經(jīng)驗(yàn)，本文可能不太適合你，而且提前說明，我不是大牛，我也在繼續(xù)提升自己的路上。
二、自我簡介???
? ? 我大學(xué)的專業(yè)是跟化學(xué)相關(guān)的，但是由于一點(diǎn)都不喜歡化學(xué)，所以通過自學(xué)前端轉(zhuǎn)行了。為什么選擇前端呢？因?yàn)槲掖髮W(xué)學(xué)的課程跟計(jì)算機(jī)沒太大關(guān)系，學(xué)習(xí)java或者c++這些語言來說太難了，前端相對來說入門比較容易一些，所以想以此來入門編程，在積累自己深度的同時(shí)，也可以慢慢擴(kuò)展廣度，可以再進(jìn)入后端的一些知識(shí)。
? ? 大四在太平洋網(wǎng)絡(luò)實(shí)習(xí)過，然后在創(chuàng)業(yè)公司呆了一年，在歡聚時(shí)代呆了一年，現(xiàn)在就職于網(wǎng)易，前端水很深，唯有不停學(xué)習(xí)，才能跟上步伐。
三、新人入門前端的前提
? ? ?那么新人如何來入門前端呢？尤其是對于沒有任何計(jì)算機(jī)背景的新人來說。我覺得有三點(diǎn)比較重要：
1. 對編程有興趣
? ? 如果沒有興趣，是很難堅(jiān)持下去的，尤其是只是看重前端的工資的話，即使學(xué)了也會(huì)很痛苦
2. 有較好的自控能力和自學(xué)能力
? ? 拒絕三天打魚，兩天曬網(wǎng)，還有要多思考，不要老是拿來主義
3. 有比較好的課程以及指導(dǎo)，可以少走一些彎路。
? ? 好的課程以及學(xué)習(xí)計(jì)劃可以做到事倍功半，少走一些彎路以及提高自己的學(xué)習(xí)興趣
四、新人入門的學(xué)習(xí)課程
那么新人如何進(jìn)行對應(yīng)的學(xué)習(xí)呢？我覺得可以參考以下的學(xué)習(xí)計(jì)劃。當(dāng)然這個(gè)學(xué)習(xí)計(jì)劃只是參考。（文章最后有整理好的課程鏈接）
1. 學(xué)習(xí)HTML基礎(chǔ)，主要學(xué)習(xí)一些標(biāo)簽以及對應(yīng)的作用
2. 學(xué)習(xí)css基礎(chǔ)，學(xué)習(xí)css的一些語法以及作用
? ? 這個(gè)時(shí)候可以百度一下一些大公司的命名規(guī)范，寫代碼的規(guī)范最好從這個(gè)時(shí)候開始養(yǎng)成。
階段性練習(xí)：
? ? ?你可以寫一些PC端的界面，模仿一些網(wǎng)站來讓自己更熟悉html和css
3. 學(xué)習(xí)原生javascript。
? ? 如果你有足夠多的時(shí)間，比如大二或者大一，可以花多點(diǎn)時(shí)間學(xué)習(xí)這一塊，如果你時(shí)間不多，又想早點(diǎn)入門前端，可以只學(xué)一些簡單的原生js，比如dom操作，js原生動(dòng)畫等，以后再補(bǔ)上。
4. 學(xué)些jquery
? ? jquey來說比原生js要簡單很多，你可以花多點(diǎn)事件學(xué)習(xí)這一塊，因?yàn)楣ぷ髦杏玫囊脖容^多。當(dāng)然，時(shí)間多者還是將主要精力放在原生js上比較好。
階段性練習(xí)：
此時(shí)你可以結(jié)合html和css，寫一些有交互的網(wǎng)站，可以多練習(xí)一下js來操作dom啊，動(dòng)畫啊等等
5. 學(xué)些HTML5和CSS3。
? ?前面的html和css只是基礎(chǔ)的學(xué)習(xí)，此時(shí)你應(yīng)該學(xué)一學(xué)html5 和 css3，來寫一些移動(dòng)端的項(xiàng)目
此外，研究一下移動(dòng)端適配。
階段性練習(xí)： 此時(shí)可以寫一些移動(dòng)端的網(wǎng)站，可以多使用css3和html5的一些新屬性?？梢允褂靡恍﹍ess或者sass這些css預(yù)處理器
6. 學(xué)習(xí)ajax；
? ? ? 經(jīng)過前面的學(xué)習(xí)，你基本掌握了前端開發(fā)的一些基礎(chǔ)知識(shí)，不過你寫出來的東西都是靜態(tài)的，也就是說數(shù)據(jù)都是寫死的。此時(shí)你可以學(xué)習(xí)一下ajax,因?yàn)楣ぷ髦心阈枰ㄟ^它來和后端配合，讓你的數(shù)據(jù)動(dòng)起來。
階段性練習(xí)： 練習(xí)如何通過ajax獲取數(shù)據(jù)，請求數(shù)據(jù)，如何處理數(shù)據(jù)，顯示在頁面上等。
7. 學(xué)點(diǎn)PS切圖
五、進(jìn)階部分
? ? ?經(jīng)過前面階段的學(xué)習(xí)，你應(yīng)該可以處理一些前端工作，也算是入門前端了，應(yīng)該可以找一份跟前端相關(guān)的實(shí)習(xí)或者工作了。
1.你需要開通一個(gè)博客。
? ? 記錄你的學(xué)習(xí)過程，或者做筆記，或者寫自己思考的一些東西，博客對于自己的學(xué)習(xí)是很有用的。
. 2.學(xué)習(xí)javascript
? ? ?這個(gè)階段的學(xué)習(xí)是不一樣的，是javascript的進(jìn)階學(xué)習(xí)，你應(yīng)該買一本《javascript高級程序設(shè)計(jì)第三版》或者《javascript權(quán)威指南第6版》，只買其中一本即可。靜下心來，把這本書從頭到尾讀完，并整理出一些博客。讀一遍是不夠的，以后有時(shí)間再繼續(xù)讀第二遍，第三遍也不為過。
3. 移動(dòng)端應(yīng)該是未來的主要方向，學(xué)習(xí)移動(dòng)端相關(guān)的知識(shí)。
? ? 比如適配，點(diǎn)透，移動(dòng)端優(yōu)化，移動(dòng)兼容性學(xué)習(xí)等等。
4.了解網(wǎng)絡(luò)協(xié)議，http，tcp、ip等等，學(xué)習(xí)一些后端的概念。
5. 學(xué)習(xí)javascript設(shè)計(jì)模式
6. 學(xué)習(xí)一些前端自動(dòng)化的東西，比如gulp，webpack等。
7. 學(xué)習(xí)ES6
8. 對于框架的態(tài)度
? ? ?此時(shí)你應(yīng)該會(huì)聽說前端的一些框架，比如vue,react等。如果你公司有用到一些框架，可以好好的學(xué)學(xué)，如果沒用到，沒關(guān)系，大概了解一下就行。好好專研你的js，提升js能力才是王道，等你js學(xué)好了，學(xué)習(xí)框架是很快的，切忌被前端的太多框架把自己搞迷茫.
9. 學(xué)習(xí)node.js
? ? 此時(shí)你的js已經(jīng)挺不錯(cuò)了，對于后端方面的東西也略有了解，此時(shí)可以學(xué)習(xí)一下node.js，自己寫一個(gè)屬于自己的網(wǎng)站
后記
? ? ?通過前面的學(xué)習(xí)，其實(shí)你已經(jīng)算是一個(gè)中級程序員了，前端開發(fā)是一個(gè)很雜，很多東西要學(xué)的職位，而且一定要持續(xù)的學(xué)習(xí)，不然就很容易跟不上步伐。而且前端不像后端，一個(gè)框架用好幾年，前端是一年出好幾個(gè)框架，對于框架，不盲目學(xué)習(xí)，可多學(xué)習(xí)框架的思想，項(xiàng)目中用到，搞透它，項(xiàng)目中用不到，寫幾個(gè)demo，知道大概是怎么回事就行了。
? ? ?進(jìn)階部分大部分是看書學(xué)習(xí)，入門部分可以多看看視頻或者教程，對于入門部分，我這里整理了一些教程，有需要的可以點(diǎn)進(jìn)來看看。
