如何學習web開發
如何學習web開發
Web前端開發工程師是一個很新的職業，在國內乃至國際上真正開始受到重視的時間不超過7年。下面學習啦小編為你整理了學習web開發方法，希望對你有幫助。
學習web開發方法
第一階段——HTML的學習
超文本標記語言(HyperText Mark-up Language 簡稱HTML)是一個網頁的骨架，無論是靜態網頁還是動態網頁，最終返回到瀏覽器端的都是HTML代碼，瀏覽器將HTML代碼解釋渲染后呈現給用戶。因 此，我們必須掌握HTML的基本結構和常用標記及屬性。
第二個階段——CSS的學習
CSS是英文Cascading Style Sheets的縮寫，叫做層疊樣式表，是能夠真正做到網頁表現與內容分離的一種樣式設計語言。相對于傳統HTML的表現而言其樣式是可以復用的，這樣就極大地提高了我們開發的速度，降低了維護的成本。
第三個階段——JavaScript的學習
JavaScript是一種在客戶端廣泛使用的腳步語言，在JavaScript當中為我們提供了一些內置函數、對象和DOM操作，借助這些內容我們可以來實現一些客戶端的特效、驗證、交互等
第四個階段——jQUery的學習
jQuery 是一個免費、開源的輕量級的JavaScript庫，并且兼容各種瀏覽器(jQuery2.0及后續版本放棄了對IE6/7/8瀏覽器的支持)，同時現在有很多基于jQuery的插件可供選擇，這樣在我們實現一些豐富的動態效果時更方便快捷，大大節省了我們開發的時間，提高了開發速度，這也充分體現了其 write less,do more的核心宗旨
Web開發需學習的15個技術
JavaScript
這是唯一一種所有瀏覽器都理解的編程語言，并且它是前端開發的支柱。JavaScript也被稱為ECMAScript，ES 5。在深入其他語言之前好好理解這門編程語言非常重要。
ES6
這是Javascript語言的擴展，而且許多瀏覽器正在實現ES6。好處是哪怕是現在，你也可以開始編寫ES6代碼，因為你可以使用transpiler(轉譯器)如Babel來轉換ES6代碼為ES5代碼。經歷這些并了解新功能是一件好事。不過，沒有不要鉆研得太深因為它們很容易發生變化。
Babel
這是最流行的ES6到ES5轉譯器之一。此外，它還被許多框架，如React所推薦。要想實時地將ES6轉換為ES5代碼，在https://babeljs.io/repl/有一個可用的REPL。
需要注意的是Babel不僅僅是ES6到ES5的轉譯器。它也是JSX到JavaScript的轉譯器。不知道什么是JSX?那么請看下面。
NodeJS
NodeJS是一個服務器端平臺，它允許你用JavaScript語言構建后端。為什么我要提NodeJS呢?這是因為，即使你對后端開發不感興趣，但是許多前端工具依賴于NodeJS。至少要熟悉node和它的命令行工具。
NPM
NPM是node的軟件包管理器。就像pip之于Python，ruby gems之于Ruby，以及Maven之于Java。了解如何安裝/刪除/升級軟件包，尤其是package.json文件結構。
Grunt或Gulp
這兩個是運行在Node平臺上最為流行的任務運行器。從技術上講，它們是針對npm的軟件包。它們允許你自動化許多前端任務，如Lint源文件，串聯，縮減，部署以及更多。
Bower
這是用于前端庫本身的一個軟件包管理工具。想添加Jquery到你的應用程序?和使用bower install jquery一樣容易。
上述工具用于基本的前端開發已經足夠。不過下面我還要說一說兩個最流行的框架，即React和Angular。
ReactJs
ReactJs是構建視圖最流行的前端庫。請注意，它不僅僅是MVC中的V，因此和框架如Angular沒有比較性。ReactJs是用ES6寫的，并且可以用Babel轉譯為ES5。它還使用也可以用Babel轉譯為JavaScript的JSX。
WebPack或Browserify
這兩個都是最流行的模塊打包機。它們可以獲取js源代碼，找出正確的依賴關系，并發出可以驅動整個應用程序的JavaScript文件。我更喜歡WebPack。點此查看關于WebPack。
Flux或Redux
React組件被布置在一個層次結構中。大部分時間，數據模型遵循層次結構。在這種情況下，Flux并不怎么有用。然而，有時候你的數據模型是不分層的。當你的React組件開始接收外部道具，或你有少量的組件開始變得非常復雜的時候，那么你可能會想要試試Flux。
Immutable.js
Immutable.js提供了一套數據結構，可以幫助解決在構建React app時的某些性能問題。這是一個偉大的庫，你可能會在你的app中大量使用它，但是當你關注于性能影響時，它就完全沒用了。
Angular 2
Angular 2是JavaScript中最流行的MVC框架之一的下一個版本。它被完全重新設計過了，并且有一條陡峭的學習曲線。全面支持雙向數據綁定。在選擇Angular 2開發時要小心評估。
TypeScript
Angular 2推薦TypeScript作為編程語言的首選。我不是很熟悉TypeScript，但我認為它增加了靜態類型到Javascript的動態特性中。最后，我相信它只是一個轉譯器。
Service workers
實驗性的API。它就像是在瀏覽器用于做各種工作的一個后臺線程。我想它也增加對離線瀏覽的支持。
Fetch API和Push API
請自行閱讀鏈接。因為到目前為止我自己對此也是知之甚少。
新手學習web前端開發注意事項
1.勇于表現自己
不是說要像銷售物品一樣夸自己，王婆賣瓜自賣自夸，而是要勇于推薦自己做的東西給別人看，讓別人給你提建議，吸收別人的技巧和方法，不斷的完善自己。
2.HTML規范
1.運用軟Tab(2個空格)進行縮進
2.嵌套元素有必要縮進一次
3.特色的值運用雙引號(而不是單引號)
4.在空元素中不用運用反斜杠
5.運用HTML5文檔聲明
3.css規范
2.在組選擇符中，每個選擇符占有單獨一行
3.在選擇符和大括號之間留出一個空格
4.選擇符大括號的完畢括號在單獨一行
4.做好自己的筆記
要做好自己的筆記，做筆記有很多方法，寫博客就挺好的，做筆記是為了非常好回想和了解自己學習到的東西。由于開發或學習進程中會遇到很多的疑問，有些是當時不了解或者是找不出原因的，有些是很容易被忽視的，那么你記載下來，等到你下次遇到一樣或或類似的，那么你可以迅速得處理或者是搞懂一些以前不完全了解的知識。
猜你感興趣：
1.什么是web開發