這篇文章 w3cschool 小編來(lái)介紹下web前端需要學(xué)什么？附學(xué)習(xí)路線！
第一階段：專業(yè)核心基礎(chǔ)
此階段需要掌握以下內(nèi)容：
1、Web 前端開(kāi)發(fā)環(huán)境的配置，HTML 常用的標(biāo)簽，常用表單元素，Table 布局，CSS 樣式表，DIV+CSS 布局?？梢允炀氝\(yùn)用 HTML 和 CSS 樣式屬性完成頁(yè)面的布局和美化。
2、CSS3 選擇器、偽類、過(guò)渡、變換、動(dòng)畫(huà)、字體圖標(biāo)、彈性盒模型、響應(yīng)式布局、移動(dòng)端。熟練運(yùn)用 CSS3 來(lái)開(kāi)發(fā)網(wǎng)頁(yè)和移動(dòng)端。
3、了解 bootstrap，可以進(jìn)行 bootstrap 源碼分析。
4、使用 HTML、CSS、LESS、SASS 等技術(shù)完成網(wǎng)頁(yè)項(xiàng)目實(shí)戰(zhàn)。通過(guò)項(xiàng)目掌握第一階段 HTML、CSS 等頁(yè)面布局的內(nèi)容、完成 PC 端頁(yè)面設(shè)計(jì)和移動(dòng)端頁(yè)面設(shè)計(jì)。
第二階段：Web后臺(tái)技術(shù)
此階段需要掌握以下內(nèi)容：
1、熟悉軟件開(kāi)發(fā)流程、算法、了解 JavaScript 變量、數(shù)據(jù)類型、函數(shù)、循環(huán)語(yǔ)句、數(shù)組等內(nèi)容?？梢允炀氝\(yùn)用 JavaScript 的知識(shí)完成頁(yè)面交互效果。
2、JavaScript 面向?qū)ο蠡A(chǔ)知識(shí)、異常處理機(jī)制、常見(jiàn)對(duì)象 API，瀏覽器兼容性處理、ES6 新特性。熟練掌握 JavaScript 面向?qū)ο蟮拈_(kāi)發(fā)以及掌握 ES6 中的重要內(nèi)容。
3、熟練操作和使用BOM以及DOM。
4、學(xué)習(xí)HTML5相關(guān)的 API、canvas、ajax 等。
第三階段：數(shù)據(jù)庫(kù)和框架實(shí)戰(zhàn)
此階段需要掌握以下內(nèi)容：
1、數(shù)據(jù)庫(kù)知識(shí)，配置命令，建庫(kù)建表，增刪改查等操作。了解數(shù)據(jù)庫(kù)管理系統(tǒng)及 MySQL 數(shù)據(jù)庫(kù)的使用與管理。
2、模塊系統(tǒng)，函數(shù)，路由，全局對(duì)象，文件系統(tǒng)，請(qǐng)求處理，Web 模塊，MySQL 數(shù)據(jù)庫(kù)處理I，文件上傳下載等。熟練運(yùn)用 Node.js 運(yùn)行環(huán)境和后臺(tái)開(kāi)發(fā)框架完成 Web 系統(tǒng)的后臺(tái)開(kāi)發(fā)。
3、學(xué)習(xí) vue 的組件、生命周期、路由、組件、webpack、elementui 框架。對(duì) Vue.js 框架的使用有清晰的理解，并且能夠運(yùn)用它完成基礎(chǔ)前端開(kāi)發(fā)、熟練運(yùn)用 Vue.js 框架的高級(jí)功能完成 Web 前端開(kāi)發(fā)和組件開(kāi)發(fā)，對(duì) MVVM 模式有深刻理解。
4、需求分析，數(shù)據(jù)庫(kù)設(shè)計(jì)，后臺(tái)開(kāi)發(fā)，使用 vue.js、node.js 完成 PC 端和移動(dòng)端整站開(kāi)發(fā)。
第四階段：移動(dòng)端和微信實(shí)戰(zhàn)
此階段需要掌握以下內(nèi)容：
1、React 面向組件編程、表單數(shù)據(jù)、組件通信、監(jiān)聽(tīng)、聲明周期、路由、Redux 基本概念。熟練使用 react 完成項(xiàng)目開(kāi)發(fā)、掌握 Redux 中的異步解決方案 Saga。
2、react-native、開(kāi)發(fā)工具、視圖與渲染、API 操作、Flutter 環(huán)境搭建、路由、ListView 組件、網(wǎng)絡(luò)請(qǐng)求、打包。熟練掌握 react-native 和 Flutter 框架，并分別使用 react-native 和 Flutter 開(kāi)發(fā)移動(dòng)端項(xiàng)目。
3、微信小程序入門(mén)、開(kāi)發(fā)工具、視圖與渲染、API 操作、支付寶小程序的入門(mén)和 API 學(xué)習(xí)。掌握微信小程序開(kāi)發(fā)以及了解支付寶小程序開(kāi)發(fā)。
4、大型購(gòu)物網(wǎng)站實(shí)戰(zhàn)，將整個(gè)項(xiàng)目前后端分離開(kāi)發(fā)。
總結(jié)
一般來(lái)說(shuō)，以上四個(gè)階段中，學(xué)習(xí)到第三階段就可進(jìn)行進(jìn)行求職。第四階段一般是在工作中學(xué)習(xí)的，難度較大。
以上就是文章“web 前端需要學(xué)什么？附學(xué)習(xí)路線！”的全部?jī)?nèi)容。更多 web 開(kāi)發(fā)的學(xué)習(xí)請(qǐng)關(guān)注 w3cschool 官網(wǎng)。
推薦課程：web 前端入門(mén)掃盲課程、node.js 微課、bootstrap 入門(mén)課程
第一階段：專業(yè)核心基礎(chǔ)
此階段需要掌握以下內(nèi)容：
1、Web 前端開(kāi)發(fā)環(huán)境的配置，HTML 常用的標(biāo)簽，常用表單元素，Table 布局，CSS 樣式表，DIV+CSS 布局?？梢允炀氝\(yùn)用 HTML 和 CSS 樣式屬性完成頁(yè)面的布局和美化。
2、CSS3 選擇器、偽類、過(guò)渡、變換、動(dòng)畫(huà)、字體圖標(biāo)、彈性盒模型、響應(yīng)式布局、移動(dòng)端。熟練運(yùn)用 CSS3 來(lái)開(kāi)發(fā)網(wǎng)頁(yè)和移動(dòng)端。
3、了解 bootstrap，可以進(jìn)行 bootstrap 源碼分析。
4、使用 HTML、CSS、LESS、SASS 等技術(shù)完成網(wǎng)頁(yè)項(xiàng)目實(shí)戰(zhàn)。通過(guò)項(xiàng)目掌握第一階段 HTML、CSS 等頁(yè)面布局的內(nèi)容、完成 PC 端頁(yè)面設(shè)計(jì)和移動(dòng)端頁(yè)面設(shè)計(jì)。
第二階段：Web后臺(tái)技術(shù)
此階段需要掌握以下內(nèi)容：
1、熟悉軟件開(kāi)發(fā)流程、算法、了解 JavaScript 變量、數(shù)據(jù)類型、函數(shù)、循環(huán)語(yǔ)句、數(shù)組等內(nèi)容?？梢允炀氝\(yùn)用 JavaScript 的知識(shí)完成頁(yè)面交互效果。
2、JavaScript 面向?qū)ο蠡A(chǔ)知識(shí)、異常處理機(jī)制、常見(jiàn)對(duì)象 API，瀏覽器兼容性處理、ES6 新特性。熟練掌握 JavaScript 面向?qū)ο蟮拈_(kāi)發(fā)以及掌握 ES6 中的重要內(nèi)容。
3、熟練操作和使用BOM以及DOM。
4、學(xué)習(xí)HTML5相關(guān)的 API、canvas、ajax 等。
第三階段：數(shù)據(jù)庫(kù)和框架實(shí)戰(zhàn)
此階段需要掌握以下內(nèi)容：
1、數(shù)據(jù)庫(kù)知識(shí)，配置命令，建庫(kù)建表，增刪改查等操作。了解數(shù)據(jù)庫(kù)管理系統(tǒng)及 MySQL 數(shù)據(jù)庫(kù)的使用與管理。
2、模塊系統(tǒng)，函數(shù)，路由，全局對(duì)象，文件系統(tǒng)，請(qǐng)求處理，Web 模塊，MySQL 數(shù)據(jù)庫(kù)處理I，文件上傳下載等。熟練運(yùn)用 Node.js 運(yùn)行環(huán)境和后臺(tái)開(kāi)發(fā)框架完成 Web 系統(tǒng)的后臺(tái)開(kāi)發(fā)。
3、學(xué)習(xí) vue 的組件、生命周期、路由、組件、webpack、elementui 框架。對(duì) Vue.js 框架的使用有清晰的理解，并且能夠運(yùn)用它完成基礎(chǔ)前端開(kāi)發(fā)、熟練運(yùn)用 Vue.js 框架的高級(jí)功能完成 Web 前端開(kāi)發(fā)和組件開(kāi)發(fā)，對(duì) MVVM 模式有深刻理解。
4、需求分析，數(shù)據(jù)庫(kù)設(shè)計(jì)，后臺(tái)開(kāi)發(fā)，使用 vue.js、node.js 完成 PC 端和移動(dòng)端整站開(kāi)發(fā)。
第四階段：移動(dòng)端和微信實(shí)戰(zhàn)
此階段需要掌握以下內(nèi)容：
1、React 面向組件編程、表單數(shù)據(jù)、組件通信、監(jiān)聽(tīng)、聲明周期、路由、Redux 基本概念。熟練使用 react 完成項(xiàng)目開(kāi)發(fā)、掌握 Redux 中的異步解決方案 Saga。
2、react-native、開(kāi)發(fā)工具、視圖與渲染、API 操作、Flutter 環(huán)境搭建、路由、ListView 組件、網(wǎng)絡(luò)請(qǐng)求、打包。熟練掌握 react-native 和 Flutter 框架，并分別使用 react-native 和 Flutter 開(kāi)發(fā)移動(dòng)端項(xiàng)目。
3、微信小程序入門(mén)、開(kāi)發(fā)工具、視圖與渲染、API 操作、支付寶小程序的入門(mén)和 API 學(xué)習(xí)。掌握微信小程序開(kāi)發(fā)以及了解支付寶小程序開(kāi)發(fā)。
4、大型購(gòu)物網(wǎng)站實(shí)戰(zhàn)，將整個(gè)項(xiàng)目前后端分離開(kāi)發(fā)。
總結(jié)
一般來(lái)說(shuō)，以上四個(gè)階段中，學(xué)習(xí)到第三階段就可進(jìn)行進(jìn)行求職。第四階段一般是在工作中學(xué)習(xí)的，難度較大。
以上就是文章“web 前端需要學(xué)什么？附學(xué)習(xí)路線！”的全部?jī)?nèi)容。更多 web 開(kāi)發(fā)的學(xué)習(xí)請(qǐng)關(guān)注 w3cschool 官網(wǎng)。
