學習前端開發，一段心路歷程，這個世界根本沒有速成的方法
我是一個做web端開發十年的老師，主要是做在線教育的，這個是我的前端新手學習群606加721加798，有全套的免費的學習資料，晚上也有365天講的前端公開課，想學習前端的朋友可以加群，可以說我就是一個做廣告的老師，但同時也是想幫助每一個想學習的人學到真實的東西，毫無忌諱，心安理得。
希望收藏了我寫的文章的你同時可以關註一下，因為這些文章都是連載的，並且是經過我系統的歸納過的。
由於篇幅問題，本篇文章先為大家闡述前五條，下一篇文章會為大家分享後五條。
第一條：學好基礎知識，做一個有紮實基本功的開發者。
前端開發的相關技術和知識非常多，每年還會有許多新的技術誕生並得到廣泛的推廣。IT行業本身就是一個技術更新非常快的行業。不過每門技術都有它最基本的知識內容和基礎體系。無論學到多深的程度，紮實的基本功是必不可少的。
初入職場，如果能夠得到老板或技術總監一句“你的基礎知識真紮實”的賞識，對於新入行的你一定是信心滿滿，也讓領導對你有一個新層次的認識。
我將前端開發的基礎知識總結為以下幾點，對於初學者來說，一定要認真學習這部分內容：
1、HTML超文本標記性語言：盡量掌握盡可能多的標記或標記對。
(1)必須掌握的標記或標記對包括：<html>、<head>、<title>、<body>、<h1>、<p>、<a>、<img>、<table>、<tr>、<td>、<th>、<form>、<input>、<select>、<option>、<textarea>、<div>、<span>、<script>、<link>、<meta>、<style>、<hr>等。
(2)同時，還有許多較為生僻的標記，大家看一看，你認識下列標記對嗎？
<label></label>：用於表單中盛放表單元素的文本提示，被稱為“標簽”標記對。
<pre></pre>：預格式化文本，在該標記對內部文本中的空格和換行都會在頁面中起作用。
<address></address>：用於表示地址的語義標簽。
<var></var>：用於表示變量的語義標簽。
當然還有許多較為生僻的標簽，這些標簽在日常的HTML開發中基本上已經不再使用了。但是當你學到Bootstrap框架的時候，你會發現，Bootstrap框架啟用了這些標簽，並為這些標簽賦予了特定的功能和外觀。
(3)除此之外，HTML5技術也為HTML註入了新的活力，許多新標簽和新屬性加入其中，使得HTML語言更加豐富與強大。
<button>標記對：HTML5新加的具有數據提交功能的按鈕。
<canvas></canvas>：HTML5的畫布技術，該標記對結合腳本語言對應一套完整的API，可以實現頁面矢量圖的繪制。
<audio></audio>：HTML5的音頻技術，該標記對結合腳本語言對應一套完整的API，可以開發有關音頻的項目。
當然還有許多HTML5新加的內容，需要廣大初學者更多地接觸並掌握。
2、CSS層疊樣式表：對於CSS的各個屬性以及一些屬性之間結合使用的技巧應該多鉆研。
CSS技術作為對HTML標記對外觀的擴展，在前端開發中體現出了強大的生命力。再結合CSS3技術，又擴展了大量的屬性，使得CSS的功能更為全面，實現方法更為簡潔。學好CSS，同時也是為頁面布局打下堅實的基礎。
你會用CSS技術的使用技巧解決下列問題嗎？
如何去掉容器中圖片下方自動產生的距離。
當容器中具有浮動元素時，如何為容器設置邊框或背景顏色？
怎樣讓塊級元素在容器中水平居中？
當多個連續塊級元素的浮動布局影響了原本不想浮動的對象時該如何處理？
容器內部的對象如何實現相對於容器的自由定位？
看來，CSS的屬性及其取值只是CSS技術的第一層面，更多的使用技巧等待大家去挖掘。
3、CSS+div布局模式：這是許多布局模式的基礎，也是大部分前端開發人員接觸到的第一種布局方式。
這種布局模式對於PC端頁面的設計是非常有幫助的，同時對於後面將會遇到的“聖杯布局”、“雙飛翼布局”、“移動端布局”、“響應式布局”等，這種布局方式都具有一定的指導意義。
上述就是我認為的一定要非常紮實的掌握的前端開發的基礎知識。基礎知識是高階知識的起步平臺，沒有基礎知識，更深層次的內容是無法真正理解的。
第二條：重視腳本學習，將JavaScript作為前端學習的重點。
JavaScript已經發展成為了Web開發的唯一的腳本語言。它從早期的基於對象的語言變為了面向對象的語言，現代JavaScript為前端開發帶來了不可替代的技術革新。
JavaScript可以輕松的實現HTML和CSS無法實現的流程控制。
結合DOM技術，JavaScript可以訪問HTML元素並操作它們。
HTML5中的許多API都是基於JavaScript進行開發和設計的。
強大的jQuery庫、jQuery UI、jQuery Mobile等都是在JavaScript的基礎上開發出來的。
全棧式開發所使用的node.js、AngularJS等第三方框架，也都是在JavaScript的基礎上編寫的。
這門神一般的語言，我個人認為是務必要認真學習的，不僅要學習JavaScript的語法知識，還要學習利用它實現DOM元素的使用，學會面向對象的編程思想。甚至還要掌握該門語言的細節特點。
系統學習過JavaScript的同學們，你看看下列問題你能準確的找到答案嗎？
通過表達式來系統闡述“==”和“===”這兩個運算符的區別。
通過哪個函數可以判斷從文本框中獲取的內容是不是數字？
會使用這兩個屬性嗎：contentEditable、isContentEditable。
知道window對象的兩個方法：setTimeout()、setInterval()在計時器方面的使用區別嗎？
delete運算符都能刪除哪些內容？
在腳本中，this有幾種使用情況呢？
JavaScript語言雖然很重要，許多公司都需要從業人員掌握原生態的JavaScript代碼。但是這門語言由於發展過程中的種種原因，存在許多繁冗且不好的代碼模式。例如原型鏈、閉包、對象與類等概念，都給這門語言戴上了“難學”的帽子。同時，這些知識有時候也正是JavaScript放光彩的一面，所以對於這門腳本語言掌握不精的學習者來說，告訴大家，一定要把這門語言搞懂，達到精通的程度，對於後續的全棧式開發絕對有非常好的作用。
第三條：多練習多操作，實踐是檢驗真理的唯一標準。
前端開發本身就是需要實戰經驗非常強的一門學科。學習和工作過程中，不斷地、反復地、大量地嘗試和上機操作，是學好前端開發唯一不變的方法。
這裏拿Bootstrap框架為例，互聯網上大部分教程和許多前端教師都提倡讓學生從Bootstrap官網上復制粘貼代碼，以更加快速的完成頁面的搭建。
尤為反對這種方式，特別是對於還處在學習階段的同學們和初次使用Bootstrap框架的從業者。首先不可否認，Bootstrap為前端開發人員帶來了大量的類名和屬性之間的搭配關系，每一個組件和插件的使用都用腦子記下來，確實有很大的困難。但是在學習階段，我非常提倡對官網的示例代碼進行鉆研和分析，閱讀bootstrap.css文件和bootstrap.js文件，從原理上理解這個框架是如何利用簡單的類名和屬性名來實現復雜的腳本功能的。我在日常的教學過程中也是這麽帶領學生一起學習的。
正所謂“知其然，還要知其所以然”，了解了內部的原理，一方面自己更加容易去記憶這些大量的名稱，另一方面，對於樣式類框架的開發，也會有一定的了解。時間久了，自己也能寫出符合自身特點的小框架，使得知識達到循序漸進、熟能生巧的程度。
第四條：閱讀前端書籍，多看有關前端開發的經典著作。
“讀書”永遠是掌握技術的一種有效方法，無論什麽技術。讀書的過程不僅能夠讓我們了解作者的意圖，更能訓練我們的閱讀速度，提高自身的自學能力。這正是一個合格的前端開發工程師應該具備的業務素質。
這裏，為大家推薦幾本前端開發領域的經典著作，真的希望你也能拿起教材，從第一頁讀到最後一頁，你一定會受益匪淺。
Bootstrap開發的經典教材
學習JavaScript腳本語言必不可少的好書
jQuery提高的優質教材
非常適合初學Node.js的學生閱讀的書
一本講述SVG實踐的教材
第五條：利用網絡資源，多學習前輩好的實現方法。
如今互聯網滲入到了我們學習和工作的方方面面，與其天天拿著手機刷微博、聊微信，何不拿起互聯網這個工具，多多學習一些有關前端開發的知識，積累一些前人總結出來的經驗，豐富自己的羽翼。
這裏，為大家推薦幾個學習前端開發的網站，希望大家可以多多瀏覽，利用好互聯網資源。
慕課網。其中匯集了大量一線教師的教學經驗，全部是以視頻的形式呈現的。
W3CSchool。這裏列舉了多門前端技術和後臺技術的基礎知識。內容較為基礎，卻是初學者好的幫手。
菜鳥教程。一個類似於W3CSchool的基礎知識學習網站。
jQuery API中文文檔（http://jquery.cuishifeng.cn/）。這裏匯集了jQuery各個版本的API內容。
Bootstrap中文網。這裏涵蓋了Bootstrap框架全部的組件和插件。
如果大家也有好的學習網站，希望也推薦給我哦。
由於篇幅問題，後面還有五條心得，我會在下一篇文章中，為大家展開闡述。如果你有什麽學習前端開發的好方法和自己的感悟，也可以在下面留言。真心的希望能夠與你得到更深入的交流！
（未完待續）
下一篇文章中，繼續跟廣大前端開發的愛好者談一談學習前端開發的心得。
在後續的文章中，將為大家講解浮動屬性。浮動屬性是流式定位的重要屬性，承擔了大部分傳統布局的功能。希望廣大前端學習者千萬不要錯過！
如果大家希望得到更加全面的關於HTML和CSS技術講解的內容，可以私信我，我會免費將自己編寫的HTML和CSS的PDF教材發給你，幫助你在前端開發的道路上闊步前行。
聲明
發表的這些文章都是從前端開發的基礎開始一步一步講起的。我非常希望能有更多的前端開發初學者通過我寫的文章，逐步學到一定的知識，甚至慢慢有了入門的感覺。這些文章都是我這幾年教學過程中的經驗，每寫一篇時我都盡量把握好措辭，用簡單易懂的語言描述，同時精心設計版面，讓版面更加豐富，激發閱讀興趣。所以，每一篇文章可能篇幅不長，但是都要耗費很久的時間。
希望收藏了我寫的文章的你同時可以關註一下，因為這些文章都是連載的，並且是經過我系統的歸納過的。
關註前端”，我會繼續為大家奉上更加深入的前端開發文章，也希望更多的初學者跟著學下去，我們共同將前端開發的路努力堅持的走下去。
學習前端開發，一段心路歷程，這個世界根本沒有速成的方法