        大前端全棧課程培訓(xùn)

課程總體概述

1. Uni-app是什么，為什么要用uni-app

2. App多端發(fā)布效果展示

3. 安裝環(huán)境HbuilderX等

4. 項(xiàng)目介紹

框架基礎(chǔ)

1、 簡(jiǎn)述MVC模式

2、 MVVM模式介紹

3、 MVVM與雙向綁定

4、 JSON對(duì)象和數(shù)組的渲染

5、 頁面路由以及配置文件講解

6、 前端框架應(yīng)用的生命周期

Vue基礎(chǔ)語法

1、 v-bind指令對(duì)屬性的數(shù)據(jù)綁定

2、 基礎(chǔ)事件講解

3、 條件渲染 v-if與v-show

4、 條件渲染 三元運(yùn)算

5、 列表渲染v-for的使用

6、 指令key實(shí)現(xiàn)for循環(huán)的組件唯一性

7、 嵌套循環(huán)的下標(biāo)定義

8、 條件編譯

樣式與布局1

1、 布局介紹與模型

2、 布局選型以及flex布局介紹

3、 flex-direction 元素的排列4種方向

4、 外部css樣式導(dǎo)入方式

5、 flex-wrap 元素的換行

6、 justify-content 元素在主軸的對(duì)齊方式

7、 align-items 元素在交叉軸的對(duì)齊方式

樣式與布局2

1. align-content 多軸線的對(duì)齊方式

2. flex成員項(xiàng)的屬性 – order

3. flex成員項(xiàng)的屬性 - flex-grow

4. flex成員項(xiàng)的屬性 - flex-shrink

5. flex成員項(xiàng)的屬性 - flex-basis

6. flex成員項(xiàng)的屬性 - align-self

項(xiàng)目開發(fā)-首頁1

1. 創(chuàng)建項(xiàng)目，構(gòu)建基礎(chǔ)頁面更改

2. 構(gòu)建tabbar設(shè)置全局page，簡(jiǎn)述view組件

3. 使用輪播圖組件

4. 禁用原生導(dǎo)航欄達(dá)到頁面全屏化

5. uni.request動(dòng)態(tài)獲得輪播圖數(shù)據(jù)

6. 渲染并且展示輪播圖

7. 引入組件實(shí)現(xiàn)全局變量

8. 使用掛載實(shí)現(xiàn)全局變量

項(xiàng)目開發(fā)-首頁2

1. 微信小程序https使用事項(xiàng)

2. 簡(jiǎn)述scroll-view使用scroll-view實(shí)現(xiàn)橫向滾動(dòng)

3. 海報(bào)與標(biāo)題以及評(píng)分制作

4. 動(dòng)態(tài)渲染數(shù)據(jù)

5. 開發(fā)自定義組件

6. 父組件向自定義組件傳入值

7. 動(dòng)態(tài)渲染預(yù)告片

8. flex布局嵌套編寫

9. 點(diǎn)贊css編寫實(shí)現(xiàn)點(diǎn)贊動(dòng)畫效果

10. 動(dòng)態(tài)渲染列表實(shí)現(xiàn)動(dòng)畫數(shù)組

11. 開啟下拉刷新loading交互api

項(xiàng)目開發(fā)-搜索及詳情頁

1. 編寫搜索欄編寫預(yù)告片列表、搜索欄置頂

2. 動(dòng)態(tài)獲取新預(yù)告并且渲染

3. 分頁接口api講解

4. 搜索前置準(zhǔn)備執(zhí)行搜索動(dòng)態(tài)渲染

5. 監(jiān)聽下拉實(shí)現(xiàn)分頁功能

6. 頁面路由api與傳參頁面跳轉(zhuǎn)組件的使用

7. 構(gòu)建評(píng)分快與陰影效果

8. 解決錯(cuò)誤數(shù)據(jù)綁定undefined

9. 通過預(yù)覽api實(shí)現(xiàn)劇照預(yù)覽

10. 電影詳情頁構(gòu)建下載以及保存圖片分享到朋友圈微信開放平臺(tái)簡(jiǎn)單介紹

項(xiàng)目開發(fā)-我的頁面開發(fā)

1. 用戶退出登錄

2. 第三方登錄講解與頁面構(gòu)建

3. 第三方登錄-小程序端實(shí)現(xiàn)微信登錄

4. 第三方登錄-后端登錄業(yè)務(wù)梳理

5. 第三方登錄-app端授權(quán)登錄

6. 第三方登錄-app端獲取用戶唯一id及信息

7. 第三方登錄-app端執(zhí)行一鍵注冊(cè)登錄

8. 文件上傳api與后端接口講解

9. token令牌講解、實(shí)現(xiàn)頭像上傳

10. 引入圖片剪裁實(shí)現(xiàn)頭像上傳

項(xiàng)目發(fā)布與上線

1、 打包H5 web應(yīng)用

2、 云服務(wù)選型以及使用

3、 配置安全組，重置密碼，上傳nginx，配置SSH

4、 安裝nginx

5、 成功發(fā)布H5端web應(yīng)用

6、 微信小程序上傳審核流程講解

7、 打包安卓apk簡(jiǎn)述ios打包