西安學(xué)習(xí)web前端要多久

對(duì)于脫產(chǎn)學(xué)習(xí)的web前端的同學(xué)，最關(guān)心的話題莫過(guò)于學(xué)習(xí)web前端要多久。這個(gè)根據(jù)每家培訓(xùn)機(jī)構(gòu)的課程設(shè)置不同、課程側(cè)重點(diǎn)不同、授課方式不同會(huì)存在一定的時(shí)間周期差異。今天小編就以千鋒教育的html5培訓(xùn)課程為例，來(lái)向大家說(shuō)明學(xué)習(xí)web前端要多久。

第一階段：前端頁(yè)面重構(gòu)（4周）

1）PC端網(wǎng)站布局項(xiàng)目

1.前端開(kāi)發(fā)環(huán)境介紹（DreamWeaver、 Notepad++、HBuilder)

2.HTML基礎(chǔ)，CSS基礎(chǔ)，CSS核心屬性

3.CSS樣式層疊，繼承，盒模型

4.容器，溢出及元素類型

5.瀏覽器兼容與寬高自適應(yīng)

6.定位，錨點(diǎn)與透明

7.圖片整合

8.表格，CSS屬性與濾鏡

9.CSS優(yōu)化

2）HTML5+CSS3基礎(chǔ)項(xiàng)目

1.HTML5新增的元素與屬性

2.表單域增強(qiáng)元素

3.CSS3選擇器

4.文字字體相關(guān)樣式

5.CSS3位移與變形處理

6.CSS3 2D轉(zhuǎn)換與過(guò)度動(dòng)畫(huà)

7.CSS3 3D轉(zhuǎn)換與關(guān)鍵幀動(dòng)畫(huà)

8.彈性盒模型

9.媒體查詢

10.響應(yīng)式設(shè)計(jì)

3）WebApp頁(yè)面布局項(xiàng)目

1.移動(dòng)端頁(yè)面設(shè)計(jì)規(guī)范

2.移動(dòng)端切圖

3.文字流式/控件彈性/圖片等比例/特殊設(shè)計(jì)的100%布局

4.等比縮放布局

5.viewport/meta

6.rem/vw的使用

7.flexbox詳解

8移動(dòng) web特別樣式處理（reset, 1px border, 高清圖片）

第二階段：Javascript高級(jí)程序設(shè)計(jì)（5周）

1）原生 Javascript交互功能開(kāi)發(fā)

1.基本語(yǔ)法

2.循環(huán)語(yǔ)句

3.函數(shù)與數(shù)組

4.String與 Date

5.BOM與 DOM

6.事件

7.拖拽效果

8.cookie存儲(chǔ)

9.正則表達(dá)式

10.Ajax

11.面向?qū)ο蠡A(chǔ)

12.運(yùn)動(dòng)與游戲開(kāi)發(fā)

2）面向?qū)ο筮M(jìn)階與 ES5/ES6應(yīng)用項(xiàng)目

1.Promise/A+

2.設(shè)計(jì)模式（觀察者模式等）

3.原型鏈

4.構(gòu)造函數(shù)

5.執(zhí)行上下文棧與執(zhí)行上下文

6.變量對(duì)象與活動(dòng)對(duì)象

7.作用域鏈

8.閉包

9.this

10.ES5

11.ES6

3）Javascript工具庫(kù)自主研發(fā)項(xiàng)目

1.DOM庫(kù)

2.事件庫(kù)

3.AJAX庫(kù)

4.原型和繼承庫(kù)

第三階段：PC端全棧項(xiàng)目開(kāi)發(fā)（3周）

1）jQuery經(jīng)典交互特效開(kāi)發(fā)

1.HTTP(s)協(xié)議詳解

2.Ajax進(jìn)階、跨域與 Defered

3.PHP基礎(chǔ)

4.MySQL基礎(chǔ)

5.Apache與 Nginx 環(huán)境搭建與配置

6.接口的定義

7.Mock數(shù)據(jù)

8.Restful

9.前后端聯(lián)調(diào)

10.前端安全(XSS,CSRF,JSON注入)

2）HTTP協(xié)議、Ajax進(jìn)階與PHP/JAVA開(kāi)發(fā)項(xiàng)目

1.Gulp

2.Webpack

3.NPM

4.Git/SVN

5.CommonJS

6.AMD

7.CMD

8.ES6模塊化

3）前端工程化與模塊化應(yīng)用

1.大首頁(yè)、列表頁(yè)與詳情頁(yè)

2.展示與交互特效

3.搜索

4.登錄與注冊(cè)

5.購(gòu)物車

4）PC端網(wǎng)站開(kāi)發(fā)項(xiàng)目

1.基礎(chǔ)知識(shí)（ng-app,Modules,

2.Controller,$apply,$watch）

3.指令(ng-repeat,ng-class,ng-show,ng-hide)

4.過(guò)濾器(date,limitTo,filter)

5.表單(NgModelController，表單驗(yàn)證)

6.服務(wù)（自定義服務(wù)，Angular提供的服務(wù)：$log,$timeout,$q,$http）

7.-（Controller as 語(yǔ)法，安全的依賴注入方法）

8.directive（指令，組件）

9.ng-router

10.標(biāo)準(zhǔn)項(xiàng)目結(jié)構(gòu)設(shè)計(jì)

5）PC端管理信息系統(tǒng)前端開(kāi)發(fā)項(xiàng)目

1.jQueryUI 與 jQuery EasyUI

2.Bootstrap框架(ACE)

3.Highcharts/Echarts

4.ArtTemplate

5.velocity

6.smarty

7.云平臺(tái)系統(tǒng)前端

第四階段：移動(dòng)端項(xiàng)目開(kāi)發(fā)(6周)

1）Touch端項(xiàng)目

1. Canvas 基礎(chǔ)知識(shí)

2. 繪制矩形、圓弧、線段、曲線、漸變與圖像

3. Canvas 圖表繪制案例

4.localStorage、sessionStorage 與離線緩存

5.animate.css

6.Yo/Mui

7.touch.js

8.zepto.js

9.swiper

10.iScroll

2）微信場(chǎng)景項(xiàng)目

1.WeUI

2.Swiper animate 在微信場(chǎng)景項(xiàng)目中的使用

3.常見(jiàn)的頁(yè)面布局

4.常見(jiàn)的交互與動(dòng)畫(huà)

5.實(shí)戰(zhàn)項(xiàng)目

3）應(yīng)用 Angular+Ionic開(kāi)發(fā) WebApp項(xiàng)目

1.Vue.js基礎(chǔ)

2.模塊化

3.單文件組件

4.路由

5.與服務(wù)器通信

6.狀態(tài)管理

7.單元測(cè)試

8.生產(chǎn)發(fā)布

4）應(yīng)用 Vue.js開(kāi)發(fā) WebApp項(xiàng)目

1.css components

2.ionic基于 angularJS擴(kuò)展的交互指令介紹

3.blank模板的安裝

4.頭部與尾部

5.內(nèi)容區(qū)域

6.列表

7.區(qū)域滾動(dòng)

8.下拉刷新與上拉加載

9.頁(yè)簽導(dǎo)航

10.背景層與旋轉(zhuǎn) SVG圖標(biāo)

11.loading 效果

12.actionsheet 效果

13.彈出窗口

14.彈出浮動(dòng)層

15.底部滿屏滑動(dòng)窗口

16.ionic 自帶的 swiper滑動(dòng)

17.基于 swiper組件的 swiper滑動(dòng)

18.頁(yè)面導(dǎo)航切換

19.側(cè)邊欄菜單

5）應(yīng)用 React.js開(kāi)發(fā) WebApp項(xiàng)目

1.ReactJS基礎(chǔ)

2.JSX語(yǔ)法

3.組件

4.flux架構(gòu)

5.配置模塊化開(kāi)發(fā)環(huán)境

6.動(dòng)畫(huà)效果

7.數(shù)據(jù)雙向綁定

第五階段：混合（Hybrid,ReactNative）開(kāi)發(fā)（1周）

1）微信小程序開(kāi)發(fā)

1.微信小程序簡(jiǎn)介及從技術(shù)上和產(chǎn)品上的分析

2.構(gòu)建第一個(gè)應(yīng)用：創(chuàng)建項(xiàng)目、創(chuàng)建小程序?qū)嵗c創(chuàng)建頁(yè)面

3.框架、組件、API及工具詳解

4.微信小程序項(xiàng)目開(kāi)發(fā)

2）React Native

1.React Native介紹

2.BS架構(gòu)程序介紹

3.原生組件

4.異步執(zhí)行與加載

5.觸摸事件處理

6.彈性盒(Flexbox)和樣式

7.兼容通用標(biāo)準(zhǔn)和擴(kuò)展性

8.React Native項(xiàng)目開(kāi)發(fā)

3）各類混合應(yīng)用開(kāi)發(fā)

1.Cordova/Phone gap

2.嵌入客戶端(iOS、Android)

3.微信服務(wù)號(hào)接口(JSSDK)開(kāi)發(fā)

4.HTML5+

第六階段：NodeJS全棧開(kāi)發(fā)（1周）

WebApp后端系統(tǒng)開(kāi)發(fā)

一、NodeJS基礎(chǔ)與NodeJS核心模塊

1.NodeJS介紹

2.NodeJS環(huán)境搭建與入門

3.ES6在 NodeJS中的應(yīng)用

4.CommonJS模塊

5.fs與 path模塊

6.stream

7.socket.io

8.http模塊 API

9.URL模塊

10.數(shù)據(jù)的本地存儲(chǔ)

二、Express

1.express api

2.express 中間件

3.ejs/jade

三、noSQL數(shù)據(jù)庫(kù)

1.mongodb 與 mongoose

2.框架中間件

3.項(xiàng)目實(shí)戰(zhàn)導(dǎo)入

總體來(lái)說(shuō)千鋒教育的html5培訓(xùn)課程主要涵蓋6大學(xué)習(xí)階段，學(xué)習(xí)周期大致為5個(gè)月。

通過(guò)5個(gè)月的學(xué)習(xí)，學(xué)員可將前端頁(yè)面重構(gòu)、Javascript高級(jí)程序設(shè)計(jì)、PC端全棧項(xiàng)目開(kāi)發(fā)、移動(dòng)端項(xiàng)目開(kāi)發(fā)、混合（Hybrid,ReactNative）開(kāi)發(fā)、WebApp后端系統(tǒng)開(kāi)發(fā)等主流前端開(kāi)發(fā)知識(shí)系數(shù)斬獲。

千鋒教育web前端開(kāi)發(fā)培訓(xùn)全力打造覆蓋前端+后臺(tái)+全棧開(kāi)發(fā)的綜合性人才。拒絕培養(yǎng)只會(huì)寫(xiě)簡(jiǎn)單HTML代碼，簡(jiǎn)單制作網(wǎng)頁(yè)的前端程序員。因?yàn)楹细竦?span>Web開(kāi)發(fā)工程師是網(wǎng)頁(yè)用戶體驗(yàn)優(yōu)化師。可以說(shuō)在千鋒教育的學(xué)習(xí)html5課程的5個(gè)月的時(shí)間，學(xué)員獲得的是一生的成長(zhǎng)，收獲的是終生受用的技能，得到的是物超所值的學(xué)習(xí)體驗(yàn)和就業(yè)保障。

千鋒教育：http://www.mobiletrain.org/

千鋒西安校區(qū)：http://xa.mobiletrain.org/?pinzhuan=biaoti

西安校區(qū)地址：西安市雁塔區(qū)高新六路52號(hào)立人科技C座西區(qū)4樓

培訓(xùn)咨詢專線：029-85260160

咨  詢  QQ  : 1660794050

面授課程：全棧HTML5+培訓(xùn)、JavaEE+云數(shù)據(jù)培訓(xùn)、Android課程培訓(xùn)

 

西安學(xué)習(xí)web前端要多久是北京千鋒互聯(lián)科技有限公司大連分公司的主要產(chǎn)品,我們的產(chǎn)品負(fù)責(zé)人是李老師,有需要的朋友請(qǐng)直接撥打我的電話4001869990,我們的地址是北京市海淀區(qū)寶盛北里西區(qū)28號(hào)天豐利商城4層,期待與您的合作!