北京Web前端培訓(xùn)課程

【課程內(nèi)容】

階段前端頁面重構(gòu)

一、PC端網(wǎng)站布局

前端開發(fā)環(huán)境介紹（DreamWeaver、Sublime)

HTML基礎(chǔ)，CSS基礎(chǔ)

CSS盒模型,選擇器，繼承

切圖工具（PS、FW）

溢出即元素類型，浮動

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

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

圖片整合，雪碧圖處理，CSSHack

表格，表單

整站規(guī)劃，CSS優(yōu)化，F(xiàn)lash動畫

二、HTML5+CSS3基礎(chǔ)

HTML5新增的元素與屬性

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

CSS3選擇器

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

CSS3位移與變形處理

CSS3動畫，過度動畫，關(guān)鍵幀動畫

彈性盒模型

媒體查詢

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

三、WebAPP頁面布局

移動端頁面設(shè)計(jì)規(guī)范

移動端切圖

響應(yīng)式布局，彈性盒子模型

等比縮放布局

viewport/meta

rem的使用，字體選擇

flexbox詳解

移動web特別樣式處理

第二階段JS程序設(shè)計(jì)

一、原生JavaScript交互效果開發(fā)

基本語法

判斷語句，循環(huán)語句

函數(shù)，函數(shù)傳參，函數(shù)封裝

String，Array，Date

BOM與DOM

事件

拖拽效果

cookie存儲

正則表達(dá)式

JSON和JSON解析

Ajax

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

運(yùn)動與游戲開發(fā)

二、面向?qū)ο筮M(jìn)階

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

原型鏈

作用域鏈

繼承

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

變量對象與活動對象

作用域鏈

閉包

this

三、JQuery經(jīng)典交互效果開發(fā)

jQuery框架介紹

tab切換效果

美化多選框和單選按鈕

滑動門

焦點(diǎn)圖輪播

下拉菜單及導(dǎo)航條效果

瀑布流

彈出層效果

倒計(jì)時效果

自定義滾動條

第三階段PC端全棧項(xiàng)目開發(fā)

一、HTTP協(xié)議、Ajax進(jìn)階與后端

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

Ajax進(jìn)階及動態(tài)調(diào)取數(shù)據(jù)

PHP基礎(chǔ)語法、PHP表單、PHP文件操作

MySQL基礎(chǔ)及增刪改查

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

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

Git/SVN

二、PC端網(wǎng)站開發(fā)

首頁、列表頁與詳情頁

搜索

登錄與注冊

三、AngularJS

Angular的解析過程分析

基礎(chǔ)指令，表達(dá)式，模型

控制器，過濾器

雙向綁定

安全的依賴注入方法

服務(wù)和自定義服務(wù)

表單驗(yàn)證

路由Router配置

事件處理器

四、PC端管理信息系統(tǒng)前端開發(fā)

jQueryUI與jQueryEasyUI

Bootstrap框架

Charts/Echarts

第四階段移動端項(xiàng)目開發(fā)

一、Touch端

Canvas基礎(chǔ)知識

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

Canvas圖表繪制案例

localStorage、sessionStorage與離線緩存

animate.css

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

touch.js

zepto.js

swiper

iScroll

二、微信場景

WeUI

Swiperanimate在微信場景項(xiàng)目中的使用

常見的頁面布局

常見的交互與動畫

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

三、應(yīng)用Vue.js開發(fā)WebApp

Vue.js基礎(chǔ)

模塊化

單文件組件

路由

與服務(wù)器通信

狀態(tài)管理

單元測試

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

四、應(yīng)用Ionic開發(fā)WebApp

csscomponents

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

頭部與尾部、內(nèi)容區(qū)域、列表、區(qū)域滾動

下拉刷新與上拉加載、頁簽導(dǎo)航

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

loading效果、actionsheet效果

彈出窗口、彈出浮動層

底部滿屏滑動窗口

ionic自帶的swiper滑動

基于swiper組件的swiper滑動

五、應(yīng)用React.js開發(fā)WebApp

ReactJS基礎(chǔ)

JSX語法

組件

flux架構(gòu)

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

動畫效果

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

六、微信小程序開發(fā)

csscomponents

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

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

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

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

第五階段WebApp后端系統(tǒng)開發(fā)

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

NodeJS介紹

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

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

CommonJS模塊

fs與path模塊

stream

socket.io

http模塊API

URL模塊

數(shù)據(jù)的本地存儲

二、Express

expressapi

express中間件

ejs/jade

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

mongodb與mongoose

框架中間件

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

第六階段就業(yè)指導(dǎo)

一、面試指導(dǎo)

簡歷制作

面試禮儀

模擬面試

二、專業(yè)指導(dǎo)

項(xiàng)目作品整理

職業(yè)規(guī)劃

面試常見問題

【行業(yè)前景】

互聯(lián)網(wǎng)行業(yè)風(fēng)起云涌，IT工程師如果僅憑傳統(tǒng)開發(fā)思維，無法突破固有知識體系，終將會被社會所淘汰。會跨平臺手機(jī)應(yīng)用開發(fā)、微信小程序、網(wǎng)絡(luò)應(yīng)用、pc以及手機(jī)炫酷網(wǎng)頁的全棧設(shè)計(jì)師應(yīng)運(yùn)而生…目前Web前端全棧開發(fā)工程師緊俏，企業(yè)高薪求才，薪資一漲再漲！

【教學(xué)環(huán)境】

【學(xué)校簡介】

優(yōu)就業(yè)貼合學(xué)生的親身利益需求，以理念的不斷升級為導(dǎo)向，為學(xué)員提供優(yōu)質(zhì)的學(xué)習(xí)環(huán)境。同時優(yōu)就業(yè)在全國各分校均設(shè)置了學(xué)習(xí)體驗(yàn)中心，并且擁有自己的培訓(xùn)教學(xué)基地。多媒體教學(xué)設(shè)施先進(jìn)完備，有著優(yōu)質(zhì)的硬件資源。每一位老師、每一位員工都始終堅(jiān)持企業(yè)的核心教學(xué)理念，在各個崗位上為每一個學(xué)員提供優(yōu)質(zhì)的服務(wù)。