移动WebAPP开发之实战美团外卖视频教程

itf

本课程率领大师一步步开辟及连系Hybrid将美团外卖实战项目打形成完整的移动Web APP，了解并把握移动Web开辟的根基技术，开辟进程中也会讲授到移动web的技能和碰到题目时处理方式和针对分歧场景技术的选型。从而提升对移动端适配以及React 百口桶和组件化开辟实战技术，本课程还覆盖了工作中常见移动Web开辟题目，而且可以经过课程进修找到对应的技术处理计划。
第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边框。
7-1 详情页顶部tab开辟(UI开辟)
7-2 详情页顶部tab开辟(款式交互逻辑开辟)
7-3 详情页点菜页面开辟(LeftBarUI开辟)
7-4 详情页点菜页面开辟(LeftBar 款式和逻辑开辟)
7-5 详情页点菜页面开辟(RightContent UI和款式开辟)
7-6 详情页点菜页面开辟(RightContent逻辑开辟)
7-7 详情页点菜页面开辟(ShopBar UI和款式开辟)
7-8 详情页点菜页面开辟(ShopBar 逻辑开辟)
7-9 详情页点菜页面开辟(ShopBar-chooseList 交互开辟)（1）
7-10 详情页点菜页面开辟(ShopBar-chooseList 交互开辟)（2）
7-11 详情页批评页面开辟(顶部Header开辟)
7-12 详情页批评页面开辟(列表List 数据绑定)
7-13 详情页批评页面开辟(列表List UI开辟)
7-14 详情页批评页面开辟(列表List款式逻辑开辟)
7-15 详情页商家页面开辟(UI开辟)
7-16 详情页商家页面开辟(款式开辟)
第8章 美团APP—回首与性能优化
经过nodejs和express实现后端数据的代{过}{滤}理，经过设备cookie来实现对美团外卖实在数据的请求。对首面和详情页的tab加载逻辑停止懒加载和对之前的转动加载逻辑优化，同时经过构建来完善页面请求资本的优化。打包并公布到腾讯云。...
8-1 懒加载性能优化
8-2 JS和CSS公共文件抽离优化
8-3 编写背景server读取实在数据
8-4 多Tab 页切换与转动数据加载优化
8-5 项目打包
8-6 项目公布
第9章 美团APP与hybrid深度连系
本章首要围绕Hybrid停止讲授，利用OC代码率领大师开辟一个简单的webview组件，同时讲授web和native之间的通讯机制，并开辟jsbridge接口完善美团外卖项目，让项目看起来更像是一个实在的APP。
9-1 JS bridge 道理
9-2 iOS webview + JS API接口+iOS APP集成
第10章 课程总结
回首和总结课程讲授内容，能更好的回归和归纳。
10-1 课程总结
[color=]下载地址
：

游客，如果您要查看本帖隐藏内容请回复

    免责声明
   
              本站所有资源均是网上搜集或网友上传提供，本站内容仅供观摩学习交流之用，将不对任何资源负法律责任。如有侵犯您的版权，请及时发邮件联系我们（2290962488@qq.com），我们将尽快处理！