小菜鳥--前端開發經驗總結

如下純屬我的體驗與意見，不喜勿噴！！

若是你打算進入這個IT行業，想作前端開發，你要作好的準備，由於要學的要懂得的實在很多。我一直主張興趣是學習最好的老師，若是沒有興趣可言，這條路我相信不會走太遠。固然有些人可能如今還很迷茫，不知道本身興趣在哪，不知道本身真正喜歡作什麼，就像如今我身邊有不少同窗，即將畢業，可依然不知道本身想要作什麼工做，不知道本身適合作什麼工做，若是你已經出現這種現象了，請你好好靜下來，學着瞭解一下本身，好多人迷茫是由於歷來都不瞭解本身，不瞭解本身適合作什麼，我以爲了解本身最好的方式是在行動中、在作事中瞭解本身，因此在大學裏，不少事情想作的必定要多嘗試去作，在作事中你就會漸漸發現本身的優缺點，慢慢發現什麼樣的工做適合本身。 

我記得我一開始並非走前端路線的，我一開始是本身自學java的，原本想一直從事java方面的工做，後來作了幾個月，發現本身並不適合，後臺語言邏輯性比較強，而個人邏輯性向來不是很好。由於堅持了大半年，發現確實不適合本身，才轉向邏輯性相對弱點的前端。不少事就是應該多去嘗試，嘗試多了纔會發現本身適合什麼。前端入門主要包括html,css,javascript，html是結構，css是表現，javascript是行爲。由於以前學java，有看過韓順平老師的java視頻，在裏面就接觸了一些前端方面的基礎知識。

前端入門很快，基本本身自學一下就能夠本身寫出一個靜態頁面。前端具體要學什麼，我是一直主張先學個基礎，而後在作項目中慢慢領悟成長，不少東西你如今學得， 不用的話，過不了多久就忘了，並且我總感受有些東西只用在項目中才會體會到它的真正用處，因此多找老師、多爭取機會作點項目，只有項目的實踐和開發纔會讓你真正瞭解整個流程和技術是怎樣的，如今我就詳細說一下前端入門要學的一些東西：

1，Html+css能夠直接看w3school(http://www.w3school.com.cn/)上的教程，邊學邊練，每章後還有小測試。以後能夠模仿一些網站作些頁面（這個很重要，多模仿一下比較複雜的網頁，其實在不少公司就是這樣，設計師把圖給你，你要把圖用代碼寫出來了，實現它的兼容性和交互效果，這裏還涉及到一個「切圖」的技術，能夠了解一下怎麼把一張圖切好，用代碼將它實現），真正在實踐中作到學以至用，若是想看書的，能夠看一下《 Head First HTML與CSS、XHTML(中文版) 》，這本書對於html+Css入門比較容易點。

2，如今html和css都已經升級到了html5，css3,因此僅僅學html+css是不夠的，如今外面的公司基本都用html5和css3，這兩個的入門我以前也是直接看w3c文檔。Html5和css3移動的會用得更多，在pc上ie瀏覽器不少版本都不支持。

3，JavaScript：不是全部的網頁都必須有js，可是要想實現一些超酷的功能和界面的時候，就須要涉及到js。關於javascript的學習，我推薦如下幾本好書（這幾本也是我以前在學習的時候，一位資深前端介紹的）：

（1）：《JavaScript DOM編程藝術》

　　看這本書以前，請先確認一下本身對Javascript是否有個基本的瞭解，應該知道if else之類的語法，若是不懂，先去看看我第（2）推薦的《Javascript高級程序設計》的前三章，記住看三章就別往下看了，回到《JavaScript DOM編程藝術》這本書上來。

　　學習Javascript用《JavaScript DOM編程藝術》來入門最好不過了，老老實實看兩遍，看完了你就會對JS有一個大概的瞭解，整本書都圍繞着一個網頁效果例子展開，你跟着老老實實敲一篇，敲完以後，你會發現這個效果不是常在網頁中看到麼，發現本身也能作出來網上的效果了，嘿嘿，小有成就感吧。

　（2）：《JavaScript高級程序設計》

　　有的書是用來成爲經典的，好比犀牛書；還有些書是用來超越經典的，顯然這本書就是這種。書中章章經典，由淺入深，其中第6章，關於JS面向對象的解說，沒有教程出其右。

若是有一場滿分100分的JS考試，看了《JavaScript DOM編程藝術》能讓你拿到20分，那麼看完這本書，你就能拿到60分以上了。學完後，你會成就感倍增的，相信我（至少看兩遍，推薦三篇，跟着書上的代碼一行行的敲）。

學了以上這兩本，你js基本能夠實現你所想要的功能了，如今招原生js的程序員也不少，精通js,已經能夠找到一份很好的工做了。

（3）《javascript權威指南》這本書能夠當平時沒事能夠翻翻，這本書比磚頭還厚，能夠到網上下載電子檔的，這本書寫得很基礎，有空能夠看看的，我本身有買一本，把它當工具書。

下面這些書要當你有必定js的功底再看：

  （4）《JavaScript語言精粹》和《高性能JavaScript》

　　《JavaScript語言精粹》和《高性能JavaScript》算是JS高級教程的補充，裏面有一些內容和JS高級教程重複了，兩本書能夠同時看，都不厚，能夠對前面所學的有一個很好的增強和鞏固。

　　（5）《JavaScript DOM高級程序設計》和《JavaScript設計模式》

在吃透了前面所說的書以後，接下來兩本書的順序已經可有可無了，《JavaScript DOM高級程序設計》（注意和《JavaScript 高級程序設計》相區別）和《JavaScript設計模式》，這兩本都是重量級的書，能讓你的JS技術上一個新的臺階；這兩本書前者主修煉外功，後者主修煉內功，有點想乾坤大挪移和九陽神功的關係。

4，jquery，bootstrap和AngularJS:這3個是前端我經常使用的框架，前端的框架實在太多了，良莠不齊，每一個公司用的框架都不同，不過這3個框架是不少公司用的，jquery是javascript封裝好的一個框架，用jquery實現網頁的動畫效果，能減小原生js的編寫，代碼量也會減小不少。Jquery能夠看《鋒利的jquery》,這本書講得很基礎，也能夠看一下w3c文檔關於jquery的介紹來入門。

bootstrap是Twitter推出的一個用於前端開發的開源工具包,它比較好的是響應式作得很不錯，並且引入它的.css和.js文件，就能夠直接調用它的class，不用寫太多樣式，減小本身css的編寫，並且網頁的不少特效能夠直接套用它的模塊，實現的效果也很酷炫。Bootstrap能夠從它的中文網上學：http://www.bootcss.com/  它如今已經升級到bootstrap3.0的，它更針對的是移動端響應式的，如今移動端這麼火，它也是被不少公司所用，因此建議必定要去這個框架，不過它的一個很不足的是不兼容ie8如下。

AngularJS這個框架很牛逼，這個框架建議等你有必定基礎再學，至少有作過幾個完整項目再學，你纔會體會到他的強大，AngularJS能夠去慕課網（http://www.imooc.com/course/list?c=fe）學，看「大漠窮秋」的視頻。

5，Ajax:ajax是學前端不可少的技術，我以前是看了我同窗發給個人幾集視頻，很適合入門，若是想要的話，請聯繫我。也能夠看w3c文檔關於ajax的東西，我我的以爲w3c文檔不少都很適合入門。書的話能夠看一下《Head Frist Ajax（中文版） 》

6，設計類：有些公司前端和設計分的很清楚，有些相對比較小的公司前端和設計都要咱們本身作，因此有空看一些設計配色類的書，《配色設計原理》這本書講得不錯，《深刻淺出Web設計(Head First Web設計)》這本書有空也能夠多看看。Ps就算學不到很精通，至少基本的網頁圖片處理也要會一些。Flash如今有些公司不怎麼用，遊戲公司會用得比較多，普通的項目一些動畫基本用代碼實現，不多用flash。

7，用戶交互體驗：這個真的要等你有必定工做經驗再來了解，前端這個職位原本就是位於後臺與用戶交互體驗之間，因此既要學好前端的知識，也要了解一點後臺的知識，還要了解用戶交互體驗，要跟這二者溝通合做好。

總之一句話，之前前端開發只是作一些很簡單的特效什麼的，但伴着 ajax 的興起，隨着 HTML5 以及瀏覽器的性能愈來愈高，前端的開發愈來愈複雜，之前在後端的事情如今會放到前端來，以便給用戶更好的體驗。

可是前端開發比起後臺，要處理的邏輯代碼要少得多，大部分邏輯都比較簡單，比較難搞的是瀏覽器兼容，以及考慮瀏覽器解析執行的性能問題。可是並非說前端的開發很容易，其實不少時候是，一件事情用前端開發有 N 種方法，要找到最好的方法是須要有良好的架構設計的。前端技術更新的速度比後臺技術要快不少，不少前端框架更新得太快，並且也特別特別多，因此想從事這一行的也要作好準備，要不斷學習學習再學習。。。

不過也不要怕，一開始最重要的是把html+css+JS學好，先把一個框架和樣式搭好，再來實現它的 特效。原生的js若是以爲比較難的話，能夠先了解一下基礎，先學JQuery,再慢慢學原生js.

以上更多的技術是關於PC的，如今移動端的很火，有空能夠多瞭解一下這方面的技術，bootstrap，jquerymoblie，phonegap，我的以爲jquerymobile各個方面都不如bootstrap.有空能夠多學booststrap

別問我前端有沒有前途，不少人在問這個問題，我不知道，我只知道若是你喜歡前端，那麼我相信無論怎樣都不會混得有多差。

別問我前端的工做好很差找，無論哪一職位，工做好很差找都是看你的水平。

別問我前端累不累，這世界就沒有不累的活，但你感興趣了，樂在其中，天然也不會感到累了。

別問我怎麼才能快速學好前端，我只能告訴你：多看多練多動腦！

苦逼碼農，且碼且珍惜。。。

福利：

1，以上我所推薦的書均可以在這個網址上找到：

http://www.w3cfuns.com/forum.php?mod=forumdisplay&fid=139&filter=typeid&typeid=183

這個網站上前端方面的書基本都有，有電子檔能夠下載，有空能夠看看。

2，最近慕課網（http://www.imooc.com/course/list?c=fe）很火，前端的一些東西也能夠在裏面看看，不過它裏面的東西你最好有點基礎再看

3，http://www.imooc.com/course/list?c=fe   這個網址裏面有前端開發的知識結構，該學什麼須要什麼均可以在裏面瞭解

4，多看一些招聘信息，看一些公司招人的要求，看他們的需求，知道公司想招什麼人，須要什麼技術，就能夠多花點心思鑽研一下某個方面的技術，這個能夠幫助你有更好的方向和目標。

下面是我剛開始出去實習時，以前寫的一些的工做感觸和體會：

我是大三暑假就開始出來作前端工做，記得剛來公司時，是先熟悉項目產品，通常其餘公司都是這樣，新人剛來一個星期都是先熟悉一下公司的東西，本身一開始有點接受不了的是，項目經理跟我講述公司產品運行環境和各類軟件時，全都是用英文說的，全部的專業名詞他們都是用英文說，當時很不習慣，還經常慢半拍，停了好久才知道他說什麼。因此仍是想跟大家說，多學點英語吧，多練練口語吧，多學點專業英語吧，不是說過了四六級，拿了四六級的證後就把英語丟掉，作咱們這一行你會發現，其實不少技術書都是英文，能夠在項目裏出現某個bug，在百度常常搜不到，若是你英文還能夠的話，用英文關鍵詞在google裏搜索，不少問題會獲得解決，總之，多學點英語，對你絕對有益無害。

還沒出來工做以前，在學校就一直很想能快點出來工做，總覺得工做能多學到不少在學校裏學不到的東西。也確實如此，工做是能夠學到不少，但我仍是很想跟那些要從事IT的大家說，還沒工做以前仍是多學點東西，把基礎打好。不要總想着出來工做後再學，到時大家會發現其實真的很吃力，壓力會很大，公司是作事的地方，它天天都有你要完成的任務，天天有必定的工做量，也不要總想着工做中有人會一步步教你怎麼作，上司可能只會跟你說一下大概的思路，他想你作成的效果，其餘的你本身琢磨，本身鑽研，固然若是你作不出來，這個時候，你也必定要厚着臉皮去向同事或你的項目負責人請教，千萬不要一直在那裏死摳，由於怕到最後仍是弄不出來，卻由於你而拖了你們的整體進度。

我主要是負責前端的，因此若是想從事前端的人員，必定要把jquery，js學好，我記得剛工做裏，個人工做任務都是跟jquery有關的，天天都要解決不少由於jquery引發的問題，須要寫不少jquery代碼，那時才真正理解了、明白了jquery的內涵。都知道jquery是javascript的一個優秀框架，因此網頁裏不少功能均可以用jquery來實現。因此一開始出來作前端實習的人，html+css+js這三樣是你的基本功，也是你開始工做必定要用到。這三樣裏，html+css是最簡單但同時也是最重要的，由於咱們知道html控制結構，你搭建的網頁結構好很差，可維護性好很差，直接取決你html是否寫得好，寫得巧，而css是網頁的一個點綴，網頁美不美觀，用戶體驗是否舒服，取決你如何設置你的網頁樣式。而javascript，原生態的javascript比較難寫，而jquery卻很好的實現了咱們網頁須要的大部分功能，因此能不能寫好jquery也直接影響了咱們網頁的可維護性，和用戶體驗效果。html表明告終構，css表明了樣式,而js構成了行爲，行爲能夠控制你的結構和樣式，一個網頁其實大部分都要用到js，因此必定必定要學好。

html+css+js都說是基本功，作前端固然不只須要好這三樣，還有不少要學習，前端位於「用戶體驗」與「後臺」之間，因此作前端的朋友，不只要學好前端的東西，如：設計美工，網頁切片等等，還要了解用戶對產品的體驗，瞭解用戶的心理，還要學一些後臺的知識，如：jsp，asp.net，php等。建議多看看一些招聘信息，看看公司具體的一些技術要求。固然不少東西仍是要慢慢積累，慢慢理解吸取成爲咱們本身的東西。

想作前端的朋友，對瀏覽器的兼容性也要多瞭解，若是有機會的話必定多實踐一下。瀏覽器兼容性一直是作前端人員以爲頭痛的事，我本身也深有體會。不過我也總結了一些經驗。建議你們去學一下bootstrap,用它來寫樣式，不只簡單，它的兼容性真心以爲棒！只須要加幾個js，就能夠兼容基本瀏覽器，真的很不錯！！

想作前端的朋友，還要學會巧用瀏覽器的console,若是你有用過它來調度過代碼，我敢確定你必定會愛上它。我之前是用Google瀏覽器和FireFox，如今發現ie11更好用，它的控制檯裏能夠查看ie11如下的界面的兼容問題，還能夠進行調試，有了這個就不用ietaste來測ie不一樣版本的兼容問題，能夠真心以爲ie11的console很好用。不少代碼你能夠先在console裏先試一下效果，結果是你想要的再在本身的代碼裏寫。這是個不錯的工具。其實每一個作前端的人本身應該都有收藏一些用得很習慣、以爲不錯的工具。。。