青島前端工程師web前端培訓(xùn)

苐一階段：PC端

Photoshop

photoshop切圖基礎(chǔ)

HTML/css

1.**ml基本標(biāo)簽/塊級元素vs內(nèi)聯(lián)元素

2.*SS基礎(chǔ)語法/選擇器/基礎(chǔ)屬性/有效寬度/浮動

3.盒模型/文字/背景/列表/

4.定位/顯示/偽類

5.優(yōu)先級/頁面布局規(guī)范流程/分組繼承層疊/雪碧圖/表單樣式

JavaScript

1.基礎(chǔ)語法（變量/數(shù)據(jù)類型/運算符/typepf/類型轉(zhuǎn)換 )

2.對象/數(shù)組/函數(shù)/閉包/

3.條件語句/循環(huán)語句/

4.對象操作方法

5.*OM操作、綁定/移除事件

6.*OM、定時器

jQuery

1.****ry引用/基礎(chǔ)語法/選擇器/事件/事件委托

2.屬性樣式/DOM樹遍歷/DOM操作

3.****ry動畫原理/內(nèi)置動畫/自定義動畫

4.表單操作/數(shù)據(jù)提交/表單驗證

5.常用插件layer/swiper等常用插件

CSS3

1.**S3支持/文字/字體圖標(biāo)/盒模型/背景/邊框/圓角

2.2***************過渡效果

項目實戰(zhàn)

PC大型商城項目

第二階段：移動端web開發(fā)

flex彈性布局

1.傳統(tǒng)布局的局限性、Flex布局優(yōu)勢、父級容器常見屬性設(shè)置

2.子級項目常見屬性設(shè)置

移動端布局

1.移動端屏幕介紹、移動端介紹、移動端操作系統(tǒng)介紹、真機調(diào)試

2.******rt 視口、rem/vw/vh單位的使用、媒體查詢

3.響應(yīng)式適配解決方案、常見移動端樣式兼容方案

bootstrap

1.基礎(chǔ)使用、柵格系統(tǒng)、CSS基礎(chǔ)樣式、插件系統(tǒng)

小項目

1.基于媒體查詢的uemo響應(yīng)式網(wǎng)站

HTML5 API

1.***l5支持/新元素/新屬性/拖拽事件/自定義標(biāo)簽

2.****as 基礎(chǔ)繪制語法/canvas動畫

3.***L5多媒體相關(guān)（Video/Audio）

4.本地存儲/離線應(yīng)用程序

5.f*****ader對象/獲取地理位置坐標(biāo)/百度地圖API

6.觸摸事件/hammer.js觸摸插件

項目實戰(zhàn)

1.移動端微商城/web APP

第三階段：Nodejs與AJAX

后端API開發(fā)

1.*****js 一天快速入門（安裝/common規(guī)范/npm常用指令）

2.*****ss開發(fā)框架--安裝與初始化、靜態(tài)資源處理

3.路由系統(tǒng)、調(diào)試 Express 應(yīng)用、常用 API

4.前后端分離架構(gòu)模式、API接口設(shè)計、接口測試工具

5.***QL數(shù)據(jù)庫環(huán)境搭建、Navicate MySQL界面化工具

6.常用SQL語句、CRUD、關(guān)聯(lián)表查詢

7.***QL包安裝以及使用

AJAX

1.**AX原理分析、同步與異步、GET/POST

2.**ON數(shù)據(jù)/AJAX操作/拓展的XMLHttpRequest API方法

3.****ry 的 AJAX 相關(guān) API 使用

4.前端模板引擎artTemplate

5.跨域請求及解決方案

小項目

基于jQuery+bootstrap的員工、客戶管理系統(tǒng)

第四階段：MVVM框架

ECMAScript新語法

1.E*****ript標(biāo)準(zhǔn)、let/const、解構(gòu)賦值

2.字符串、對象、函數(shù)、數(shù)組的擴展語法

3.面向?qū)ο笏枷搿⒐S模式、構(gòu)造函數(shù)、原型以及原型鏈、原型繼承

4.***ss類、Module模塊

5.回調(diào)函數(shù)、Promise 對象、Async 函數(shù)

Vue

1.*ue 實例、Vu**.0新特性、文本與屬性綁定、Class 與 Style 綁定、條件渲染、列表渲染

2.事件處理、表單輸入綁定、計算屬性 computed

3.*ue 實例生命周期、Vue 過渡和動畫

4.模塊化開發(fā)、Vue組件系統(tǒng)

5.*****LI安裝、創(chuàng)建項目、目錄解析、配置項

6.*SS預(yù)處理器SASS

7.V*****uter基礎(chǔ)路由、路由傳參、嵌套路由

8.編程式導(dǎo)航、路由組件傳參、導(dǎo)航守衛(wèi)、路由元數(shù)據(jù)

9.**AX通信Vue-axios/Vue生命周期/路由跳轉(zhuǎn)獲取數(shù)據(jù)

10******nt UI框架構(gòu)建商品管理后臺

11***eX倉庫管理，權(quán)限管理

12***eX倉庫管理，權(quán)限管理

項目實戰(zhàn)

1.基于vue+axios+vue-router+Element UI的商品后臺管理系統(tǒng)

React

1.***ct 框架介紹、安裝與初始化、create-react-app 腳手架工具

2.***ct 組件系統(tǒng)、JSX 語法、事件處理

3.條件渲染、列表渲染和 key、表單處理

4.***ct Router 路由系統(tǒng)

5.***ux 狀態(tài)管理架構(gòu)

6.***os 請求庫、生命周期

7.*SS Modules

8.***ct Hooks

項目實戰(zhàn)

基于react框架的移動端商城系統(tǒng)

第五階段：Hybrid APP 開發(fā)

微信小程序

1.微信4種平臺區(qū)別、注冊流程

2.創(chuàng)建基礎(chǔ)項目、目錄解析、配置文件

3.視圖層-頁面樣式布局、WXSS

4.邏輯層--數(shù)據(jù)渲染、綁定事件、事件傳參、獲取/修改data

5.調(diào)試面板，調(diào)試

6.網(wǎng)絡(luò)通信配置、封裝AJAX方法、數(shù)據(jù)交互

7.路由組件、路由傳參、編程式導(dǎo)航

8.小程序登錄流程、授權(quán)、獲取用戶信息

9.微信支付流程/打包、發(fā)布版本

項目實戰(zhàn)

1.基于小程序的購物商城