大前端
升级Vue3.0正式版,高级前端工程师成长路径,带你告别迷茫
一套真正的思维+技术能力提升课程
不做技术的简单堆砌,7个月实现能力跨越式进阶
录播+直播+社群+问答等慕课网精心设计8种方式,全方位助力学习
不限期 视频有效期
28 课程内容
14 个月 教学服务期限
115 小时 视频时长
1520 学习人数
100% 好评度

优惠价 ¥2790.00

支持花呗 7天可退款 ¥3290

立即购买

作为一名前端工程师,你是否也正经历着这些困境

遭遇技术瓶颈

长期重复工作,没机会接触新技术、大
型项目,视野狭窄,技术水平停滞不前

学习提升困难

前端技术更新频繁,越学越迷茫
没有自己的知识体系

缺乏大牛指点

公司没有规范团队、没有长期业务
线,自己单打独斗缺乏大牛指点

前景不明朗

入职N年,纠结是转行、深挖还是管理
更宽更远的职场路径到底如何规划?

以上这些问题,让你晋升困难,面试不自信,涨薪没盼头?

你需要掌握一套高阶能力,来为自己的职场加分

大厂高级工程师们的这些共同特质,是非常值得学习的能力进阶方向

大视野

拥有全局思维,能够将业务与技术高度结合,统筹梳理项目全生命周期

硬技能

精通多端+全栈开发技能,快速应用新技术,将技术高效综合应用

通能力

落地实现方案 / 沟通协调 / 项目管理 / 工程提效/团队协同…

慕课精品成长课,培养更高思维+技术能力的综合性高端前端人才

对标阿里P6+,做老板信任、团队依赖、伙伴放心的项目骨干

思维与技术能力并重

“大前端思维”统领课程
不做简单的技术堆砌

01

知识体系完善,技术前沿

主流、前沿的知识和技能内容
体系化夯实技术实力

02

复杂多端全栈项目

遵循大厂标准,同一业务场景,PC
管理后台、WebApp、小程序和接口
平台 “一体化”

03

多重学习保障

录播+直播+社群+问答,学习无忧;
习题+作业+资源+大牛指点,高效掌握

04

全局思维能力

拥有项目全局把控能力,掌握规划-
编码-构建-测试-发布-部署-运维-
监控 DevOps全流程

01

多端+全栈开发能力

具备前端架构思维,打通多端+
前后端全栈综合开发能力

02

工程化实战能力

项目开发规范化、模块化、组件化、
容器化;上线部署自动化

03

团队管理提效能力

15 + 种效率工具应用&平台自建,
拥有企业级可落地的团队协同方案

04

能力提升看得见,每一步提升都来自扎实的实战

全局思维能力
多端开发能力
全栈能力
团队协同能力
 项目需求分析
项目质量管理
项目进度管理
运维与扩展
PC前端
WebApp
小程序
管理后台
原型设计
数据库接口设计
技术栈选型
前后端开发
版本管理/缺陷控制
(ESLint、禅道)
Git Flow
文档管理
(接口、需求)
项目统筹能力
工程化能力
测试能力
监控运维能力
重构能力
 业务拆解
核心技术应用
项目可持续发展
团队协调
webpack/Gulp
脚手架工具应用
自动化部署(CI/CD)
Docker容器化技术
接口测试
业务功能测试
错误统一处理
单元测试
数据可视化
项目Linux部署
运行日志及监控
开发环境搭建
新旧过渡分析
新技术如何取舍
旧平台升级
新技术落地应用

遵循大厂项目标准,1 套业务系统,打通多端应用场景

具备规范化+模块化+组件化+自动化的多端全栈项目,覆盖需求-设计-开发-测试-维护全流程

社区PC前端—全流程Vue.js高级进阶全栈项目

项目简介

完整的通用社区业务闭环,实践企业级开发流程(需求-设计-开发-部署-自
动化),渐进式学习前端Vue高级知识全栈开发。

项目亮点

前端工程化落地实践
容器化、组件化、自动化全能进阶
前端必备效率工具链&环境使用
鉴权设计与权限管理解决方案

项目核心功能模块

登录机制设计/JWT鉴权/HTTPS
VeeValidate&Vuelidate数据验证
密码安全/bcrypt加密解密
图片验证码及Redis缓存
接口设计/Mock流程/接口开发
效率开发环境/Prettier/ESLint
多屏响应式布局
全流程从需求、接口到开发
缺陷控制和版本管理
长列表筛选/排序/异步加载
Vue进阶自定义filter/directives
Axios封装/拦截器
前端依赖升级方案
积分/签到系统设计
多级路由/路由监听/路由守卫
头像图片上传/静态资源
邮件功能node-mailer集成
栅格系统/Sass预编译进阶
自定义IconFont图标库
组件化进阶富文本编辑器
动态路由/路由权限控制
文章管理/预览功能
评论/收藏/点赞功能
Websocket实时&历史消息
Nuxt.js服务端渲染
点击链接预览PC项目
http://front.dev.toimc.com:22500/

内容管理后台—多端统一的角色权限&内容管理平台

项目简介

使用流行iView UI框架,进行通用中后台界面设计。开发统一的CMS管理
后台,管理小程序、PC端、WebApp多端内容数据,抽离统计数据通过
Echarts进行首页数据可视化,开发多角色/多级菜单的管理系统。

项目亮点

基于多角色的前端权限方案
首页数据可视化实践
复杂CMS系统数据库设计
跨组件多级联动交互

项目核心功能模块

表单数据校验
缓存&存储方案js-cookie
用户管理/权限分配功能
通用业务组件封装方案
多级内容分类CMS系统设计
角色管理/接口管理/菜单管理
内容管理/评论管理/标签管理
访问日志功能
多模块状态管理
首页可视化统计功能
菜单权限/角色权限/接口权限
自定义多级菜单树型控件
嵌套数据/递归查询
Vue动态菜单方案
iView-admin路由权限
多种错误日志收集方案
错误日志管理多重异步筛选
koa中间件统一报错处理
Log4j/koa-logger文件日志方案
多语言l18n

接口数据后端—告别Node.js“玩具”时代,多端统一API接口框架

项目简介

Nodejs通用应用级API开发,采用前后端分离的开发模式,多级菜单权限、
基于角色的权限设计(RABC),深入学习ES6高级语法,基于webpack多
开发环境的接口数据后台。

项目亮点

多端通用高性能Nodejs接口框架
分级日志收集,系统接口监控
NoSQL 数据库进阶
全方位(数据+接口)权限解决方案

项目核心功能模块

Webpack多环境打包/开发配置
Babel配置详解/ES6开发环境
ESLint自动修复/代码格式化
多级容器化构建打包及部署
IDE开发常用插件
CORS跨域访问控制
接口安全helmet集成
koa-static静态资源访问
统一日志收集&监控
接口访问管理
Redis与图片验证码
JWT签名、Token校验机制
Nodemailer邮件功能集成
WebSocket服务端
WebSocket鉴权设计
配置信息加密方案&dotEnv
NoSQL数据库设计
复杂的搜索逻辑处理
常见CURD操作
填充Populate和聚合Aggregate
联动搜索条件

社区移动端WebApp—采用组件化结构+多端适配方案

项目简介

无缝对接社区管理后台API,学习移动端布局、适配、性能优化等,进阶移动
端调试技巧,开发移动端WebApp。

项目亮点

多端适配解决方案
企业移动端开发规范
主流UI框架集成
从0到1丰富的自定义组件

项目核心功能模块

MintUI介绍及模块化方案
移动框Flex布局及栅栏设计
常见移动端交互设计
Vue路由切换过渡动画设计
多端数据展示与设计要点
容器化/自动化构建
移动端底部适配
HTML移动端Meta解析
postcss移动端适配方案
Sass进阶Mixin适配方案
封装上下拉LoadMore基础组件
添加表情滚动动画
首页多分类筛选
评论回复功能开发
自定义表情组件
登录/签到/个人中心
热门统计功能开发
对接CMS前后端联调
组件状态分层&动态Modules加载
自定义SVG图标组件
Normalize和Reset
全局样式方案Sass-loader
transition过渡动效进阶
扫码体验WebApp

社区小程序—快应用框架MVVM架构开发社区小程序

项目简介

一套完整的社区业务的多端体现,涵盖小程序开发使用场景,打通大型项
目的设计与多端思考能力,从开发到发布全流程GET。

项目亮点

前端MVVM架构
极致交互设计与性能优化
UI组件库vant-weapp集成
主流开发模式全流程实战

项目核心功能模块

mpvue/Wepy/taro/uniapp对比
自定义组件进阶
微信小程序开放接口
小程序扩展能力&云开发介绍
原生能力与组件化开发
开发/部署/上线技巧
微信登录功能
小程序适配方案px2rpx
第三方npm库集成
图片上传/预览组件
分类数据筛选
UGC内容安全
文章列表/详情/长列表加载
评论点赞/回复
小程序内容安全
签到功能
多周期统计/聚合查询进阶
多组件状态管理
签到功能/积分模块设计
自定义小程序基础组件
微信用户基础信息对接
小程序订阅消息&主动推送
扫码体验WebApp

6大阶段构建大前端图谱,从全局到细节,从思维到落地

课程设计高屋建瓴,技术版本及时更新,实现仅手写代码就50000+行的项目经验累积

带着大前端的全局思维,开始从项目需求分析到搭建环境;

学习前端框架分类及选型和前端工程化。

重点学习DevOps全流程,配合文档管理、版本管理;
项目进度质量管理、自动化以及效率工具,领略开发之美,效率之道。

社区全栈项目(PC端),重点掌握接口和数据库设计能力;

综合中间件、数据库、服务器渲染知识,融合文档管理、版本控制
铺开前端全栈之路。

前后端分离架构开发后台管理系统开发,提高整体开发效率;

打通社区全栈与后台管理系统, 完成从前端到大前端思维的演变。

将项目平移到WebApp和小程序,掌握一套业务系统,多应用场景的解决方案;

从项目发布到维护迭代,打通开发全流程。真正进入大前端领域。

高级前端工程师必备技能,TypeScript提高代码质量

结合Vue3新的特性——组合式API,实战前端项目的重构,融合新技术与业务。

市面鲜有!内容完备的知识点详解

28周系统化课程,120+必备知识点,15种效率工具

课程大纲及学习周期安排 (详细版)

为保证课程内容紧跟市场变化,课程章节将逐步开放,直至课程完结

阶段一: 开启大前端的大门
  • 第1周
  • 第1周+
  • 第2周
  • 第3周
  • 第4周
  • 第5周
  • 选修周
认识大前端,开启无限可能

万丈高楼平地起。开课第一周,我们将从实际工作中的开发痛点出发,以项目全生命周期为主线,对全栈有全局的认识,培养您的项目架构思维。介绍UI和JS框架对比与选型,Node进阶、RESTful接口等。

课程安排:
  1. 1、了解大前端知识体系,让您有全局的认知
  2. 2、理解大前端的定义,让您不再迷茫
  3. 3、项目规划及DevOps流程
  4. 4、分析实际工作中遇到的痛点以及解决办法
  5. 5、掌握需求分析的要点及工具(墨刀/Axure)
  6. 6、从原型设计、接口设计到技术栈的宏观项目架构思维 
前端框架分类及选型

是否还在为选择使用什么框架而苦恼?是否还在为学习哪个前端框架而纠结?本周将给您满意的答案,有UI和JS框架对比与选型,有Node.js进阶使用、Web框架如何开发RESTful接口等。

课程安排:
  1. 1、常见MVVM与UI框架对比与选型
  2. 2、Koa框架后台项目的配置及ES6语法支持
  3. 3、Koa工作原理及常见Koa中间件使用
  4. 4、登录模块的需求分析及流程设计
  5. 5、登录模块的开发,LayUI框架集成
  6. 6、邮件服务和图片验证码服务的开发
  7. 7、表单验证Vuelidate/VeeValidate
  8. 8、配置邮件服务NodeMailer
  9. 9、邮件服务接口与找回密码对接
  10. 10、如何调试Node应用及webpack配置
企业标准的开发环境搭建

工欲善其事,必先利其器。学习最火的Docker容器技术,快速搭建测试环境。深入讲解前端必会的Mock接口与工具,并专门设计了调试技巧&真机调试讲解,与实际工作开发完美契合。

课程安排:
  1. 1、虚拟机搭建与使用
  2. 2、Linux开发环境及常见命令使用
  3. 3、容器技术Docker以及安装及使用
  4. 4、Node及npm命令的使用
  5. 5、搭建DOClever接口测试平台
  6. 6、前后端分离开发--RESTful接口及Mock数据
  7. 7、常见IDE使用及VSCode的调试配置及默认设置
  8. 8、三类真机调试技巧 
必会的前端工程化工具

效率是检验工程师的重要指标之一,如何提高开发效率,从前端工程化工具着手。本周学习实际工作中两大利器Webpack与Gulp,并使用Yeoman搭建自己的脚手架工具,让自己和团队的开发效率翻倍。

课程安排:
  1. 1、了解工程化工具的使用场景及具体应用
  2. 2、理解Webpack的核心概念,配置Webpack
  3. 3、掌握Webpack中的Plugin及Loader的使用
  4. 4、了解Gulp的核心概念,学习配置Gulp基础任务
  5. 5、配置Yeoman脚手架工程项目
  6. 6、创建自己的脚手架工具
NoSQL数据库的设计与集成

本周带您解开数据之谜,学习NoSQL数据库与数据库设计原则,让您带着设计思维去设计项目数据库。掌握Redis安装、常用CLI命令,搞定Redis服务搭建与Nodejs集成

课程安排:
  1. 1、了解NoSQL数据库分类及选型
  2. 2、掌握数据库设计原则
  3. 3、掌握从功能到数据库的基本设计
  4. 4、常见MongoDB及Redis与nodejs集成
  5. 5、使用Docker快速搭建MongoDB及Redis开发测试环境
JWT登录鉴权—通用登录模块后端开发

本周解读鉴权、加密/算法、HTTPS等核心概念,实践JWT方式进行登录鉴权接口设计。从前到后,涵盖输入校验、Axios请求封装、统一错误处理、jwt功能集成及数据安全性策略的分析等知识。

课程安排:
  1. 1、前端常见鉴权方式及优缺点
  2. 2、算法/加密、HTTPS等概念大解密
  3. 3、JWT工作原理及Koa-jwt功能集成
  4. 4、前端接口Axios封装
  5. 5、前端统一错误处理、后端统一错误响应
  6. 6、后端接口响应,数据校验
  7. 7、自定义vue组件,优化前端登录注册交互
  8. 8、输入校验、远程校验结合提升用户体检
  9. 9、登录注册Mock数据,vscode调试进阶
深入理解Vue2框架知识(选修)

跟上企业需求的步伐,本周从MVVM框架基础讲起,让您拥有组件化思想,掌握目前流行的Vue框架进阶应用。重点不仅在于应用,也在于原理,做到知其然,知其所以然。

课程安排:
  1. 1、了解MVVM框架理念
  2. 2、理解组件化思想
  3. 3、Vue基础、路由及状态管理
  4. 4、Vue cli工具的使用,创建工程化项目
  5. 5、Vue CLI命令vue create及项目配置
  6. 6、Vue CLI命令扩展使用vue ui
  7. 7、Vue、Vue-router、Vuex综合应用
阶段二: 抓住团队协作的密码
  • 第6周
  • 第7周
  • 第8周
团队协作-文档管理与缺陷控制

项目开发过程中,少不了团队协作,哪些可以提升效率?文档管理:介绍工作中必知必会的(项目+需求+接口)文档的管理办法,搭建团队的文档管理工具;介绍缺陷控制流程与工具的应用,ESLint配置深入讲解。

课程安排:
  1. 1、Markdown语法及进阶图表使用
  2. 2、ShowDoc进行云笔记及文档管理
  3. 3、搭建自己团队的接口管理平台
  4. 4、学会使用hexo+github搭建自己的博客
  5. 5、掌握容器技术Docker进阶使用
  6. 6、掌握缺陷控制工具及使用
  7. 7、了解质量管理工作流
团队协作-版本管理

本周介绍版本控制工具,比较SVG与git的优缺点,深入Git的应用场景,结合场景学习Git命令,同时了解Git flow和devOps流程,协助同学们在自己的团队中部署Git平台,提升工作效率。

课程安排:
  1. 1、SVN VS Git
  2. 2、掌握Git基础命令
  3. 3、Git进阶命令:rebase,reset,stash
  4. 4、从零配置github到SSH秘钥克隆仓库
  5. 5、Git Flow及管理版本控制
  6. 6、使用Docker快速搭建gitlab平台
  7. 7、gitlab平台与gitea平台比较
  8. 8、gitlab平台管理,用户权限控制
团队协作-自动化流程

本周学习团队协作最重要的部分:前端自动化流程,使用容器技术配置自动化/持续集成环境,部署Jenkins平台,结合gitlab完成完整的CI/CD落地实践,让开发者能更专注于业务,进一步提升团队效率。

课程安排:
  1. 1、了解CI/CD平台CircleCI,TravisCI和Jenkins
  2. 2、理解自动化/持续集成流程,升华DevOps理解
  3. 3、快速搭建、配置Jenkins服务
  4. 4、掌握Jenkins中的权限控制,并与gitlab进行集成
  5. 5、学习Jenkins的权限控制与插件管理系统
  6. 6、配合Jenkins效率构建,完成发布、构建等工作
  7. 7、实战前端项目自动化部署
  8. 8、了解Linux运维相关的命令与知识
  9. 9、了解私有化容器平台搭建及使用
阶段三: 打通全栈开发技能
  • 第9周
  • 第10周
  • 第11周
  • 第12周
  • 第13周
全栈开发—首页模块

从数据库、接口设计到组件拆分,再到首页核心功能实现,提高对前置流程理解与工具使用的熟练度。本周通过原型图到实现首页交互(复杂筛选)及接口,综合运用前置知识,学习项目开发的实战内容。

课程安排:
  1. 1、Npm依赖升级方案,@vue/cli升级V4版本
  2. 2、PC端项目全局需求分析、原型设计、项目重难点介绍
  3. 3、掌握首页、发帖、用户中心数据库设计、接口设计、文档更新
  4. 4、首页多级列表、筛选、排序功能开发
  5. 5、路由监听/路由守卫/子路由ActiveClass灵活应用开发交互效果
  6. 6、Axios请求封装/拦截器/取消用户重复请求
  7. 7、侧栏:统计、签到、周热议 功能开发
  8. 8、首页Mock数据调试长列表加载、接口开发、前后端接口联调
  9. 9、版本控制建立Git仓库,熟悉Git相关操作
  10. 10、缺陷控制实战:代码Prettier格式化、ESLint自动修复实践、配置Standart规则
全栈开发—用户中心

开发个人中心核心业务,丰富的Vue-router、Vuex进阶应用和自定义组件,完成周榜、签到榜、热评榜的功能,实现签到积分系统,完善个人中心设置。

课程安排:
  1. 1、优化登录路由,本地缓存登录状态(介绍localStorage&SessionStorage区别)
  2. 2、自制Iconfont图标库
  3. 3、实战核心依赖升级,升级LayUI基础库版本
  4. 4、Sass进阶学习@for/@Mixin/@Map的用法
  5. 5、帖子详情、采纳、点赞功能开发
  6. 6、个人中心收藏列表、发贴列表功能开发
  7. 7、签到系统,积分体系的设计
全栈开发—发贴/回帖模块

继续开发发帖/回帖核心业务之后,形成PC端社区业务闭环,配置自动化流程,完成PC端项目自动化部署。进一步巩固前置技能,综合应用效率平台与工具,完成开发与测试,培养技术栈综合应用能力。

课程安排:
  1. 1、优化登录路由,本地缓存登录状态(介绍localStorage&SessionStorage区别)
  2. 2、自定义富文本编辑器开发(插入链接|图片、引用|代码样式、预览)
  3. 3、帖子详情、采纳、点赞功能开发
  4. 4、个人中心收藏列表、发贴列表功能开发
  5. 5、签到系统,积分体系的设计
  6. 6、发贴权限效验
  7. 7、Vue自定义directive/filters妙用
  8. 8、改造入口文件routes,后端路由按模块动态引入
  9. 9、调试账号修改邮件通知功能
  10. 10、Nodejs静态资源处理、文件上传后台、路径相关进阶操作
  11. 11、自制Iconfont图标库
  12. 12、Sass进阶学习@for/@Mixin/@Map的用法
消息中间件开发(WebSocket通信)

websocket是长连接的最优解决方案,升级全解析:ws分组消息、断线重连、心跳检测、离线消息缓存、历史消息,开发通用消息中间件。

课程安排:
  1. 1、WebSocket基础,WebSocket与Socket.io进行对比
  2. 2、Socket.io开发简单的消息应用
  3. 3、进阶认识WebSocket事件、属性
  4. 4、使用ws开发多人聊天 室应用(统计在线人数、加入&离开广播通知)
  5. 5、WebSocket消息应用进阶(鉴权、心跳检测、断线重连)
  6. 6、离线消息缓存之Redis缓存解决方案(多房间、多用户、多条信息缓存)
  7. 7、封装WebSocket客户端、服务端通用模块
  8. 8、PC端项目个人中心我的消息功能开发(实时、历史消息)
性能优化--服务端渲染

性能是评判项目好坏标准之一,本周带着大家进入性能优化环节,学习配置服务器端渲染思想及Nuxt.js使用,并对前面项目进行改造,让项目的性能更优。

课程安排:
  1. 1、了解SEO优化方法
  2. 2、前端性能优化思想
  3. 3、前端性能优化之服务端渲染(SSR)
  4. 4、SSR基础及工作原理
  5. 5、配置SSR及Webpack进阶:服务端渲染开发热重载
  6. 6、SSR中的路由与代码分割方案
  7. 7、Nuxt.js框架介绍(工程目录、Universal Mode、自动生成路由)
  8. 8、Nuxt.js Auth登录鉴权模块介绍与对接
  9. 9、Nuxt.js集成:改造前端项目首页功能模块
阶段四: 前后端分离的后台管理系统
  • 第14周
  • 第15周
  • 第16周
  • 第17周
组件化思想进阶:iview上手文章管理

本周进入到后台管理系统开发,从项目整体架构去考虑中后台应用的开发路径。学习iview-admin 框架工作原理,自定义表格组件,完成文章管理开发。

课程安排:
  1. 1、技术框架选型及UI框架选型
  2. 2、后端需求分析,接口设计,数据库设计
  3. 3、 iView-admin框架集成
  4. 4、解析项目架构,添加路由和菜单
  5. 5、定制开发登录入口,加入JWT鉴权机制
  6. 6、Cookie及Session的使用方式
  7. 7、实战多语言场景:英文&简体中文
中后台权限系统:前端权限设计方案

进入中后台系统开发中最重要环节:权限系统。介绍前端中(组件级、按钮级、路由级)三种权限控制解决方案,开发用户管理页面,定制动态搜索组件,深入学习iview基础组件:Table、Form、Modal等。

课程安排:
  1. 1、了解权限设计基础(权限构成)
  2. 2、学习什么是菜单权限、数据权限?
  3. 3、学习前台权限控制的三种场景应用
  4. 4、自定义指令 hasRole实现前端组件级、按钮组权限控制
  5. 5、实战前端基于角色的权限控制方案,了解动态路由添加方法和权限控制方案
  6. 6、实战用户管理页面开发,自定义动态选项的搜索组件
  7. 7、深入学习iview基础组件(Table,Model),加强对ui框架的了解。
  8. 8、添加用户模态框,批量设置用户、批量删除用户功能开发
中后台权限系统:基于角色&菜单权限设计

本周将继续深入权限系统,开发包括菜单管理、角色管理以及后台权限管理API,开发nodejs中间件,实现基于角色的接口资源访问控制系统。加深前置知识的综合应用,从前到后,打通权限设计的全方位思维。

课程安排:
  1. 1、菜单权限设计思路:关系型数据库、非关系型数据库中的不同点
  2. 2、从0到1,设计菜单基础信息页面、角色权限页面原型&布局
  3. 3、实战角色管理、菜单管理、权限分配界面页面样式开发(综合应用iview基础组件)
  4. 4、Nodejs后台基于角色的菜单权限 + 数据接口权限的完整解决方案(RBAC方案)
  5. 5、koa鉴权中间件开发,对资源权限进行访问控制 
首页可视化图表与日志服务

本周将完成后端管理平台的首页管理,对首页统计功能进行定制开发,并增加日志服务,对后台接口的调用增加日志管理,系统功能完善与监管。以及前后端联调及细节优化,定制Jenkins任务及配置前后端自动化任务。

课程安排:
  1. 1、Echarts基础&地图类型图表两种解决方案
  2. 2、首页统计:周数据统计、新增用户统计、发帖、进日统计
  3. 3、监控日志两种方法:调试日志koa-logger和文件日志koa-log4j
  4. 4、掌握前后端联调技能
  5. 5、自动化流程回顾+Jenkins节点管理
  6. 6、接口项目配置自动化任务(敏感信息、微信通知)
  7. 7、自动化部署前后台项目
  8. 8、配置前后端项目的自动化
阶段五: 流行的WebApp与小程序开发
  • 第18周
  • 第19周
  • 第20周
  • 第21周
  • 第22周
  • 第23周
  • 第24周
WebApp页面设计与开发

随着终端设备的发展,在移动端浏览Web已成主流。本周进入WebApp项目开发,学习PC项目和WebAPP的差异,如何平移到移动端,从页面设计到登录、首页及个人中心开发。您也可以搞定移动项目开发。

课程安排:
  1. 1、WebApp原型设计及工具使用、WebApp开发的常见问题
  2. 2、移动端框架概览及Mint-UI介绍 & 自定义主题
  3. 3、自定义SVG图标组件(巧用svg-sprite-loader)
  4. 4、Vuex状态管理state分层及Modules进阶应用
  5. 5、全局样式方案Normalize与Reset
  6. 6、开发登录、注册、密码找回页面
  7. 7、首页列表及筛选、个人中心开发
  8. 8、评论列表无限加载模块
  9. 9、上拉加载、下拉刷新的开发技巧
  10. 10、自定义Header组件
WebApp前后端联调

WebApp页面开发只是第一步,如何和后端对接,掌握从后台管理到前端展现的整体解决方案,提升技能和解决实际问题的能力。

课程安排:
  1. 1、详情页面交互设计、表情出层(transition动画进阶)
  2. 2、滚动穿透解决方案(iscroll & better-scroll介绍)
  3. 3、移动端适配解决方案(px-to-viewport & px-to-rem)
  4. 4、WebApp项目容器化实战,配置Dockerfile及打包镜像
  5. 5、Jenkins自动发布配置,多节点配置及管理
  6. 6、消息页面、消息、个人中心、热门功能开发
  7. 7、热门功能开发:多条件统计列表开发,前后端数据对接
小程序基础与进阶

便捷的快应用时代已到,本周介绍小程序的开发适用场景,实操小程序的注册流程,掌握开发中的注意事项。学习小程序原生框架基本用法,及快应用开发框架的使用,并且能独立调试开发小程序。

课程安排:
  1. 1、了解小程序注册流程
  2. 2、了解小程序注册方式及注册主体
  3. 3、了解跨端框架适用场景及开发工作流
  4. 4、掌握小程序本地开发环境配置
  5. 5、掌握小程序本地化调试办法
  6. 6、小程序第三方npmjs库集成
  7. 7、掌握快应用场景:mpvue/wepy/uni-app基础
小程序首页/菜单定制/登录开发

小程序开发实战第一部分,学习首页的列表开发,菜单定制的开发,微信接口及数据库的设计。

课程安排:
  1. 1、熟悉微信小程序开发文档,获取用户登录状态,开发API微信配置接口
  2. 2、如何集成小程序第三方UI组件库:vant-weapp
  3. 3、掌握小程序开发者工具配置,如何配置app
  4. 4、框架原理,熟悉了解小程序的生命周期
  5. 5、学习mpvue基础的语法 & 不支持的Vue语法/函数特性
  6. 6、多页面下的开发工作流及目录结构
  7. 7、封装通用libs库(HTTP请求、缓存)
  8. 8、mpvue长列表优化方案,精简data数据
  9. 9、上拉加载、下拉刷新如何使用及使用场景
小程序详情面/个人中心开发

小程序开发实战第二部分,学习个人中心模块、详情页面、编辑发贴功能开发,与后台接口进行对接,完成页面的功能调试。

课程安排:
  1. 1、小程序页面设计思想
  2. 2、了解小程序工程化项目
  3. 3、了解小程序的生命周期 & mpvue页面生命周期
  4. 4、小程序自定义组件(原生组件与mpvue集成)
  5. 5、熟悉小程序开发配置,学习配置微信安全域名、开发者
  6. 6、业务功能模块:完成详情页面、个人中心功能开发
  7. 7、掌握小程序常用组件,开发富文本内容
小程序编辑与发贴开发

小程序开发实战第三部分,学习编辑发贴功能开发,与后台接口进行对接,完成页面的整体功能调试。

课程安排:
  1. 1、掌握小程序订阅消息机制 & 消息配置 & 消息发送
  2. 2、订阅消息功能的接口设计与开发
  3. 3、编辑与发帖模块开发
  4. 4、掌握小程序发布流程及版本管理
  5. 5、小程序上线准备及HTTPS证书申请方案
  6. 6、前后端接口对接及后台项目Nginx配置 HTTPS
  7. 7、快应用框架需要注意的开发坑点 & 升级指南
项目部署、运维与展望

介绍云服务器、域名及HTTPS服务,项目运维及Linux相关自启脚本介绍。项目更新及日志处理,如何发送报警通知及应急策略的制定。混合与跨端应用框架;桌面应用Electron等,做好未来发展指引 。

课程安排:
  1. 1、如何进行服务器监控、服务器日志及报警
  2. 2、Jenkins配置IM通知(钉钉构建通知、企业微信通知、邮件通知)
  3. 3、理解域名服务及配置Nginx & HTTPS(通过Acme申请SSL证书)
  4. 4、了解购买云服务器及熟悉面板管理
  5. 5、能编写基本的运维脚本
  6. 6、项目运行维护/更新终止/资源回收
  7. 7、了解项目总结及如何进行项目重构
  8. 8、Vue3.x相关知识介绍
阶段六: Vue3.0(正式版)+TypeScript重构项目
  • 第25周
  • 第26周
  • 第27周
  • 第28周
Vue3带来的新特性

本周重点介绍Vue3新的Composition API及生命周期的变化, Compiler的原理。从0到1改写常见的逻辑代码块,实现模块化功能代码,让同类型的逻辑进行复用,让代码的质量与可读性提升。

课程安排:
  1. 1、新增组件属性setup及其用法
  2. 2、Vue3 Compiler原理(Proxy原理)
  3. 3、Vue3计算属性及相关API
  4. 4、进阶响应式开发,模块化代码
  5. 5、Vue3生命周期变化
  6. 6、Suspense介绍
  7. 7、Teleport介绍
  8. 8、常见案例Vue3改写
  9. 9、TypeScript简介及开发环境搭建
Vue3全家桶+Vite开发工具

Vue框架生态也伴随新版本到来了,有哪些变化?让我们实战ToDoList经典项目。Vite作为Vue3的快速开发工具,结合更友好的Tree-Shaking 支持,给Vue项目开发带来了质的飞跃。

课程安排:
  1. 1、Vue3生态之Vue-Router用法简介与实战
  2. 2、Vue3生态之Vuex用法简介与实战
  3. 3、TodoList需求分析
  4. 4、TodoList待办清单列表
  5. 5、TodoList添加功能开发
  6. 6、TodoList编辑列表与删除
  7. 7、Vite常见配置
  8. 8、Rollup自动化工具进阶
PC端项目Vue3首页重构

本周开始进行项目实战,改造原PC端项目中不再推荐的mixin、filter等用法,并通过重构前端项目的首页内容,让大家真正上手Vue3,平滑的从vue2进行切换。

课程安排:
  1. 1、如何全盘思考Vue3项目重构?
  2. 2、Vue2工程项目升级Vue3
  3. 3、mixin&filter部分代码重构
  4. 4、首页列表逻辑代码改造
  5. 5、PC端项目路由Vue-Router代码重构
  6. 6、PC端项目Vuex状态管理代码重构
管理后台&WebApp代码重构

本周从基于iview-admin开发的管理后台项目出发,带领大家一起重构第三方UI框架开发的项目,了解这类项目如何与Vue3进行集成,进阶Composition API的使用。

课程安排:
  1. 1、Vue2工程项目升级Vue3
  2. 2、mixin&filter部分代码重构
  3. 3、首页列表逻辑代码改造
  4. 4、PC端项目路由Vue-Router代码重构
  5. 5、PC端项目Vuex状态管理代码重构
  6. 6、课程总结
课程按周开放更新,学习有节奏

资深大牛授课,上千学员真实好评

Brian
全栈大牛,创业者
国内一线互联网公司从业经历,超过10年的前后端开发经验。负责过多个
领域的全栈项目开发,纵跨直播平台、新媒体管理系统等多个行业领域,
对于微服务框架、服务治理等技术颇有研究,自创多种优化流程。Vue3.0
发布后第一时间更新本课程内容,不断为同学们创造更好的学习体验。

慕课成熟的课程服务体系,让学习效果更有保障

1600万真实用户的共同选择,已被验证有效的科学学习方式

  • 直播互动

    品质直播话题,与讲师面对面实时互
    动,开拓视野

  • 社群讨论

    和大牛、同行共处同一社群,切磋
    与碰撞,成长更迅速

  • 随堂练习

    基础知识随堂练习,即学即测,充分
    掌握巩固,效果立现

  • 提升作业

    知识点融会贯通综合应用,技能掌握
    举一反三更牢靠

  • 有问必答

    提供课程相关疑问提问入口
    详细答疑,扫清学习障碍

  • 源码开放

    全套上线标准的项目代码免费赠送
    并且长期迭代维护

  • 独家资料

    超实用的思维导图,文档资料覆盖核
    心知识、关键技能,方便回溯与拓展

  • 实用教材

    高保真项目原型图免费赠送,方便随
    课实操练手

  • 此外,你还可以享有面试指导福利

    老师将与学员直播互动,
    直击面试难点、痛点、盲点,详解求职技巧
    每一分努力,都能收获理想的回报

  • 课程适合人群

    有扎实的JavaScript(ES6)/HTML/CSS前端功底
    有Node.js、Vue基础,并开发过Demo项目
    有自学能力、懂得运用互联网工具解决开发问题
    不少于1年的web前端开发经验

常见问题
为什么学
课程收获
项目开发
学习步骤
讲师背景
特色服务
返回顶部

学习咨询

选课、学习遇到问题?
扫码添加指导老师 1V1 帮助你!

添加后老师会第一时间解决你的问题

意见反馈 帮助中心 APP下载
官方微信