WEB前端開發初學者必看的學習路線(附思維導圖)


很多同學想學習WEB前端開發,雖然互聯網有很多的教程、網站、書籍,可是卻又不知從何開始如何選取。看完網友高等游民白烏鴉無私分享的原標題為《寫給同事的前端學習路線》這篇文章,相信你會有所收獲。


 

前端開發入門學習有:HTML、CSS、JavaScript(簡稱JS)這三個部分。所以在學習之前我們需要先明確三個概念:

  1. HTML——內容層,它的作用是表示一個HTML標簽在頁面里是個什么角色。
  2. CSS——樣式層,它的作用是表示一塊內容以什么樣的樣式(字體、大小、顏色、寬高等)顯示。
  3. JS——行為層,它的作用是當用戶觸發某些行為時,會給內容和樣式帶來什么樣的改變。

 

 

一、HTML,CSS部分


HTML/CSS初學,就照着http://www.w3cschool.cn/的實驗做,把http://www.w3cschool.cn/index-6.htmlhttp://www.w3cschool.cn/index-7.html兩套做完了就入門了,

入門之后,學習CSS的精華,即布局,推薦李炎恢的教學視頻,布局這一章:http://edu.51cto.com/lesson/id-14895.html第27章,如果覺得不夠,需要實戰,則再學習接下來的28,29章。注意,這時候一定要老師講一塊代碼,自己就要照着實現一次,切勿只看不做。

CSS還有一個精華部分就是命名規范,找幾個著名網站(比如豆瓣、網易新聞)這類,研究它們的命名規范,我這里,有一個現成的命名規范可供學習(需要登錄evernote查看):https://www.evernote.com/shard/s168/sh/7f89cc57-cab2-4712-b61b-9fde25e3ef51/d01c8e34ef05373ec06c3b2f7cfaba82/res/e0b9963b-ba7a-441a-8462-8f87c48e4cda.jpg?resizeSmall&width=832

學習完成后就是一個較為熟練的HTML/CSS使用者了.這時候如果想繼續深入學習相關類庫和框架,推薦Sass和Compass,推薦兩篇阮一峰的博客:http://www.ruanyifeng.com/blog/2012/06/sass.htmlhttp://www.ruanyifeng.com/blog/2012/11/compass.html


 

和這本書:《Sass and Compass in Action》http://book.douban.com/subject/6732187/

 

二、JavaScript部分


初學者推薦看視頻:http://edu.51cto.com/course/course_id-166-page-1.html,特別注意JavaScript的OOP寫法(重點,可多看幾遍),以及閉包、原型鏈,異步編程部分(次重點),前者寫項目都在用,后者涉及JS這個語言本質特點。

然后需要學習JS和HTML/CSS在瀏覽器下的調試方法,推薦用Google Chrome下的chrome developer tools調試,可以看這個視頻學習:http://happycasts.net/episodes/40


 

 

看完視頻並經過實踐后,可以看《Javascript good parts》(http://book.douban.com/subject/2994925/)這本書,不必細看,看它的思想即可。用於鞏固,提升JS方面的編程思想。

 

三、web前端學習路線思維導圖



web前端學習路線思維導圖

圖太大不好展示,看不清楚可以進入以下鏈接查看——web前端學習路線思維導圖在線版https://www.processon.com/view/link/57d28d0ee4b0942d7a89c9dd


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM