完美契合企業(yè)需求 嚴(yán)謹(jǐn)定制科學(xué)課程
階段(4周)
前端頁(yè)面重構(gòu)
PC端網(wǎng)站布局
課程內(nèi)容:
◆ HTML基礎(chǔ),CSS基礎(chǔ),CSS核心屬性 ◆ CSS樣式層疊,繼承,盒模型 ◆ 容器,溢出及元素類型 ◆ 瀏覽器兼容與寬高自適應(yīng) ◆ 定位,錨點(diǎn)與透明 ◆ 圖片整合 ◆ 表格,CSS屬性與濾鏡"
課程項(xiàng)目:
◆《世紀(jì)佳緣用戶注冊(cè)頁(yè)布局》 ◆《臥龍控股網(wǎng)站項(xiàng)目布局》 ◆《華帥燈飾網(wǎng)站項(xiàng)目布局》 ◆《千鋒互聯(lián)網(wǎng)站項(xiàng)目布局》 ◆《京東首頁(yè)布局》 ◆《騰訊游戲首頁(yè)布局》 ◆《BOSS直聘布局》 ◆《麥田國(guó)際項(xiàng)目布局》
第二階段(8周)
JavaScript高級(jí)程序設(shè)計(jì)
原生JavaScript交互功能開(kāi)發(fā)
課程內(nèi)容:
◆ 基本語(yǔ)法 ◆ 循環(huán)語(yǔ)句 ◆ 函數(shù)與數(shù)組 ◆ String與Date ◆ BOM與DOM ◆ 事件 ◆ 拖拽效果 ◆ cookie存儲(chǔ) ◆ 正則表達(dá)式 ◆ Ajax ◆ 面向?qū)ο蠡A(chǔ) ◆ 運(yùn)動(dòng)與游戲開(kāi)發(fā)
課程項(xiàng)目:
◆ 蘑菇街瀑布流 ◆ 打磚塊游戲開(kāi)發(fā) ◆ 淘寶商品查詢 ◆ 飛機(jī)大戰(zhàn)游戲開(kāi)發(fā) ◆ 智能問(wèn)答機(jī)器人
PC端全棧開(kāi)發(fā)
jQuery經(jīng)典交互特效開(kāi)發(fā)
課程內(nèi)容:
◆ 時(shí)間軸特效 ◆ tab頁(yè)面切換效果 ◆ 網(wǎng)頁(yè)定位導(dǎo)航特效 ◆ 滑動(dòng)門(mén)特效 ◆ 焦點(diǎn)圖輪播特效 ◆ 導(dǎo)航條菜單效果 ◆ 瀑布流特效 ◆ 彈出層效果 ◆ 倒計(jì)時(shí)效果 ◆ 抽獎(jiǎng)效果
課程項(xiàng)目:
◆ 《天貓首頁(yè)交互開(kāi)發(fā)》
第三階段(8周)
Node.js基礎(chǔ)
課程內(nèi)容:
一、Node.js介紹
◆ 開(kāi)發(fā)環(huán)境搭建M ◆ 模塊與包管理工具M(jìn) ◆ CommonJS模塊M ◆ URL解析M ◆ QueryString參數(shù)處理M ◆ HTTP模塊M ◆ HTTP小爬蟲(chóng)M ◆ request方法M ◆ 事件 events模塊M ◆ 文件 fs模塊M ◆ Stream 流模塊M ◆ 原生路由與參數(shù)接收M ◆ 讀取圖片文件M ◆ npm scriptsM ◆ Yarn 與 PM2M
二、MongoDB
◆ MongoDB介紹與環(huán)境搭建 ◆ 數(shù)據(jù)庫(kù)常用命令 ◆ Collection聚集集合 ◆ document文檔操作 ◆ 聚集集合查詢 ◆ NodeJS連接MongoDB
三、GraphGL
◆ GraphQL初探:從REST到GraphQL ◆ GraphGL安裝 ◆ 準(zhǔn)備數(shù)據(jù)源 ◆ 搭建GraphQL服務(wù)器 ◆ 數(shù)據(jù)查詢
四、Express
◆ express 介紹 ◆ 安裝和創(chuàng)建基于Express的項(xiàng)目 ◆ Express 4.1x 初始化項(xiàng)目詳解 ◆ 路由簡(jiǎn)介 ◆ 模板引擎EJS ◆ 模板引擎Pug(Jade)
五、Koa2
◆ Koa2開(kāi)始 ◆ 路由 ◆ 請(qǐng)求數(shù)據(jù)獲取 ◆ 靜態(tài)資源加載 ◆ cookie/session ◆ 模板引擎 ◆ 文件上傳 ◆ 數(shù)據(jù)庫(kù)MySQL ◆ JSONP實(shí)現(xiàn) ◆ 測(cè)試與debug
六、測(cè)試框架mocha
◆ 搭建框架 ◆ 斷言assert ◆ 項(xiàng)目測(cè)試 ◆ 運(yùn)行多個(gè)測(cè)試
七、socket 即時(shí)通信項(xiàng)目
◆ Socket簡(jiǎn)介和通訊流程 ◆ 基于net模塊實(shí)現(xiàn)socket ◆ WebSocket ◆ Socket.io
課程項(xiàng)目:
◆ 《Node.js基礎(chǔ)案例.》
Node.js高級(jí)全棧項(xiàng)目
課程內(nèi)容:
◆ 基于M站+Node.js+MongoDB高級(jí)全棧項(xiàng)目開(kāi)發(fā)
課程項(xiàng)目:
◆《打造仿拉勾網(wǎng)M站》 ◆《打造拉勾網(wǎng)后臺(tái)管理系統(tǒng)》
Vue.js前端框架
Vue.js開(kāi)發(fā)基礎(chǔ)
課程內(nèi)容:
◆ WebApp開(kāi)發(fā)基礎(chǔ)(Webstorage,移動(dòng)端事件,UI組件, Zepto, IScroll, Swiper) ◆ MVVM模式 ◆ 前端組件化 ◆ 單文件組件 ◆ 組件間傳值 ◆ Vue實(shí)例 ◆ E19Vue實(shí)例生命周期 ◆ Vue的模版語(yǔ)法 ◆ 計(jì)算屬性,方法與偵聽(tīng)器 ◆ 計(jì)算屬性的 getter 和 setter ◆ Vue中的樣式綁定 ◆ Vue中的條件渲染 ◆ Vue中的列表渲染 ◆ Vue中的set方法 ◆ 父子組件間的數(shù)據(jù)傳遞 ◆ 組件參數(shù)校驗(yàn)與非 props 特性 ◆ 給組件綁定原生事件 ◆ 非父子組件間的傳值 ◆ 在Vue中使用插槽 ◆ 作用域插槽 ◆ 動(dòng)態(tài)組件與 v-once 指令 ◆ Vue動(dòng)畫(huà)
課程項(xiàng)目:
◆ 《Vue.js基礎(chǔ)案例.》
應(yīng)用Vue.js開(kāi)發(fā)WebApp項(xiàng)目
課程內(nèi)容:
◆ 環(huán)境配置 ◆ 項(xiàng)目代碼介紹 ◆ 單文件組件與Vue中的路由 ◆ 單頁(yè)應(yīng)用VS多頁(yè)應(yīng)用 ◆ Mint UI ◆ Element UI ◆ 項(xiàng)目的聯(lián)調(diào),測(cè)試與發(fā)布上線
課程項(xiàng)目:
◆《打造仿賣座網(wǎng)移動(dòng)端網(wǎng)站》
React前端框架
React 開(kāi)發(fā)基礎(chǔ)
課程內(nèi)容:
◆ React簡(jiǎn)介 ◆ React開(kāi)發(fā)環(huán)境準(zhǔn)備 ◆ React中的組件 ◆ JSX語(yǔ)法 ◆ 拆分組件與組件之間的傳值 ◆ React developer tools 安裝及使用 ◆ PropTypes 與 DefaultProps 的應(yīng)用 ◆ props,state 與 render 函數(shù)的關(guān)系 ◆ 深入了解React虛擬DOM ◆ 虛擬 DOM 中的 Diff 算法 ◆ React 中 ref 的使用 ◆ React的生命周期函數(shù)及使用場(chǎng)景 ◆ 使用Charles實(shí)現(xiàn)本地?cái)?shù)據(jù)mock ◆ React 中實(shí)現(xiàn) CSS 動(dòng)畫(huà)效果 ◆ react-transition-group 實(shí)現(xiàn)動(dòng)畫(huà) ◆ Redux 概念簡(jiǎn)述和工作流程 ◆ Action 和 Reducer 的編寫(xiě) ◆ ActionTypes 的拆分 ◆ 使用 actionCreator 統(tǒng)一創(chuàng)建 action ◆ UI組件和、容器組件及無(wú)狀態(tài)組件 ◆ 使用Redux-thunk 中間件實(shí)現(xiàn)ajax數(shù)據(jù)請(qǐng)求 ◆ Redux-saga 中間件使用 ◆ React-redux 中間件使用
課程項(xiàng)目:
◆ 《React基礎(chǔ)案例》
React Native
課程內(nèi)容:
◆ React Native初探 ◆ React Native 項(xiàng)目導(dǎo)航 ◆ React Native 項(xiàng)目文本框 ◆ React Native 項(xiàng)目滾動(dòng)分頁(yè) ◆ React Native 其他組件
課程項(xiàng)目:
◆《React Native豆瓣電影APP》
應(yīng)用React開(kāi)發(fā)WebApp項(xiàng)目
課程內(nèi)容:
◆ Ant Design組件庫(kù) ◆ React Router 4 路由 ◆ 項(xiàng)目組件編寫(xiě) ◆ 使用 Immutable.js 來(lái)管理store中的數(shù)據(jù) ◆ 項(xiàng)目的聯(lián)調(diào)、測(cè)試與發(fā)布上線
課程項(xiàng)目:
◆《打造在線英文教育網(wǎng)》
混合開(kāi)發(fā)(Hybrid,RN)
公眾號(hào)開(kāi)發(fā)
課程內(nèi)容:
◆ 初識(shí)公眾號(hào) ◆ 訂閱號(hào)的基本功能 ◆ 使用百度BAE實(shí)現(xiàn)代碼的快速上線 ◆ 使用Git完成線上代碼部署 ◆ 公眾號(hào)開(kāi)發(fā)權(quán)限及功能接入 ◆ JSSDK接口API ◆ 場(chǎng)景項(xiàng)目開(kāi)發(fā)與接入
課程項(xiàng)目:
◆ 《賣座電影項(xiàng)目接入》
小程序開(kāi)發(fā)
課程內(nèi)容:
◆ 小程序初探 ◆ 小程序入門(mén)必學(xué) ◆ 小程序組件體驗(yàn) ◆ 小程序大功能 ◆ 項(xiàng)目實(shí)戰(zhàn)帶你征服小程序
課程項(xiàng)目:
◆《造萌寵交易平臺(tái)》
Angular6基礎(chǔ)
課程內(nèi)容:
◆ TypeScript 基礎(chǔ)與進(jìn)階 ◆ 開(kāi)發(fā)環(huán)境配置 ◆ Hello World ◆ 架構(gòu)、模塊與組件 ◆ 模板 ◆ 元數(shù)據(jù)、數(shù)據(jù)綁定與數(shù)據(jù)顯示 ◆ 表單 ◆ 服務(wù)與指令 ◆ 依賴注入 ◆ 路由 ◆ Ionic 3 框架
課程項(xiàng)目:
◆ 《直播課管理系統(tǒng)》 ◆ 《跨平臺(tái)手機(jī)APP》
大數(shù)據(jù)可視化基礎(chǔ)與實(shí)戰(zhàn)
課程內(nèi)容:
◆ 數(shù)據(jù)可視化基礎(chǔ) ◆ Echars、Hignchars ◆ D3.js 入門(mén) ◆ D3.js 進(jìn)階 ◆ D3.js 選擇集與數(shù)據(jù) ◆ D3.js 高級(jí)應(yīng)用 ◆ D3.js 應(yīng)用工具:NVD3、n3-charts
課程項(xiàng)目:
◆ 《公安警情可視化系統(tǒng)》