第1章 課程介紹

通過課程介紹，了解學習課程的必要性，所包含的知識點，課程安排，學習前提，課程收獲，快速全面了解課程。

1-1 課程導學

第2章 移動web硬知識點

本章主要講解移動web開發中必要掌握的基本知識，是進行後續學習的前提。從概述到開發調試方法，以及viewport視窗概念和原理的講解，在到移動web開發關鍵布局技能和適配方案，最後講解移動web中常用的touch事件。

2-1 移動web開發概述

2-2 移動web開發調試

2-3 移動web適配概述

2-4 viewport視窗概念

2-5 css3之flex布局

2-6 響應式布局和MediaQuery

2-7 rem,vw布局與適配

2-8 移動端touch事件詳解

第3章 移動web軟技能

本章主要講解移動web開發實戰中用到的相關知識點。從基本代碼工具的介紹到項目構建的基本概念，同時預先給大家介紹webpack和Sass的基本使用方法，幫助基礎弱的同學以便於進行後續的學習，最後教大家如何使用React組件化思想開發頁面。...

3-1 代碼管理工具&項目構建工具簡介

3-2 webpack工具使用介紹

3-3 Sass預處理工具使用介紹

3-4 React組件化思想

第4章 項目開發構建環境搭建

本章主要講解的內容都是為下章實戰項目做準備工作的開發，包括項目的最終結果演示，同時會講解如何使用webpack來從0搭建配置一個項目的構建環境和基本的Redux使用方法，以便於對Redux不熟悉的同學鞏固一下相關知識。

4-1 項目和技術棧介紹

4-2 項目演示

4-3 構建環境搭建（1）

4-4 構建環境搭建（2）

4-5 構建環境搭建（3）

4-6 構建環境搭建（4）

4-7 redux-react使用介紹（1）

4-8 redux-react使用介紹（2）

第5章 美團APP—首頁開發

開發首頁，講解通過React+Redux實現頁面基本邏輯，使用flex進行頁面布局，引入rem進行頁面適配，實現tab切換，滾動加載邏輯，以及事件綁定邏輯。

5-1 底部tab按鈕開發(webpack-dev-server配置)

5-2 底部tab按鈕開發-UI邏輯編寫（1）

5-3 底部tab按鈕開發-UI邏輯編寫（2）

5-4 底部tab按鈕開發(rem配置)

5-5 底部tab按鈕開發(集成ESlint)

5-6 底部tab按鈕開發(集成HMR)

5-7 首頁頁面開發Header模塊開發

5-8 首頁頁面開發SearchBar模塊開發

5-9 首頁頁面開發-Category模塊開發（1）

5-10 首頁頁面開發-Category模塊開發（2）

5-11 首頁頁面開發(ContentList模塊開發)

5-12 首頁頁面開發-ListItem模塊UI開發

5-13 首頁頁面開發-ListItem模塊樣式開發

5-14 首頁頁面開發-ListItem模塊數據渲染開發（1）

5-15 首頁頁面開發-ListItem模塊數據渲染開發( 2 )

5-16 首頁頁面開發(滾動加載邏輯實現)

5-17 訂單頁面開發(List模塊開發)

5-18 訂單頁面開發(OrderItem模塊開發)（1）

5-19 訂單頁面開發(OrderItem模塊開發)（2）

5-20 訂單頁面開發(公共ScrollView模塊開發)

5-21 我的頁面UI開發

5-22 我的頁面樣式開發

5-23 集成react-router

第6章 美團APP—評價和分類頁開發

開發評價頁和分類頁，講解使用div+overflow實現局部滾動，移動端輸入框相關使用技巧以及css偽類實現星型icon。

6-1 分類頁面開發(頂部NavHeader模塊開發)

6-2 分類頁面開發(頂部Header tab 模塊UI開發)

6-3 分類頁面開發(頂部Header模塊樣式和邏輯開發)

6-4 分類頁面開發(Filter面板模塊“全部分類”數據渲染開發)

6-5 分類頁面開發(Filter面板模塊“排序和篩選”數據渲染實現

6-6 分類頁面開發(Filter面板模塊樣式開發)

6-7 分類頁面開發(Filter面板模塊item邏輯實現)

6-8 分類頁面開發(列表List模塊開發)

6-9 評價頁面開發(UI開發)

6-10 評價頁面開發(樣式開發)

6-11 評價頁面開發(交互邏輯開發)

第7章 美團APP—詳情頁開發

開發詳情頁，講解點菜選擇器相關邏輯，通過React組件化對之前頁面的公共組件進行抽離，通過封裝scrollview實現評價tab的數據加載，以及使用css偽類實現1px邊框。

第8章 美團APP—回顧與性能優化

通過nodejs和express實現後端數據的代理，通過設置cookie來實現對美團外賣真實數據的請求。對首面和詳情頁的tab加載邏輯進行懶加載和對之前的滾動加載邏輯優化，同時通過構建來完善頁面請求資源的優化。打包並發布到騰訊雲。...

第9章 美團APP與hybrid深度結合

本章主要圍繞Hybrid進行講解，使用OC代碼帶領大家開發一個簡單的webview組件，同時講解web和native之間的通信機制，並開發jsbridge接口完善美團外賣項目，讓項目看起來更像是一個真正的APP。

下載地址: 百度網盤

移動Web APP開發之實戰美團外賣 高清無密 百度網盤