百度网盘链接:https://pan.baidu.com/s/1xshLRO3ru0LAsQQ0pE67Qg 提取码:bh9f
 
阶段一:课程设计及前端创建脚手架开发
第1周   需求分析和架构设计:做什么,如何做?
开工之前,先来看看我们到底要做一个什么项目,有哪些功能。然后站在上帝视角,从整体的架构层面,该如何设计该项目。
 
课程安排:
1、需求分析,到底要做一个什么产品
2、项目设计,多个项目之间的关系
3、数据模型设计,各项目之间的数据流转过程
4、后台管理需求,管理员要管控什么内容
5、统计需求,知道被访问了多少次
第2周   脚手架架构设计和框架搭建
万丈高楼平地起,讲解大厂级别的脚手架是如何设计的,从头开始绘制架构设计图,并完成脚手架的框架搭建。
 
课程安排:
1、掌握脚手架的实现原理
2、掌握脚手架管理工具Lerna和常用操作
3、基于Lerna构建脚手架项目
4、图解脚手架架构设计
5、脚手架工程体系设计
6、深入阅读Lerna源码,剖析require.resolve原理
第3周   脚手架核心流程开发
本周将完成脚手架内核@imooc-cli/core子项目设计,并开发脚手架的执行准备阶段和命令注册阶段。
 
课程安排:
1、脚手架核心子项目core包架构设计
2、掌握脚手架node运行版本限制
3、掌握脚手架root自动降级
4、掌握npmlog实现自定义脚手架日志
5、掌握脚手架用户主目录检查
6、掌握脚手架入参解析和环境变量配置
7、运用npm API实现脚手架自动更新
8、掌握脚手架命令注册原理
9、运用commander简化脚手架命令注册
10、node支持ES模块化标准的两种方法
第4周   脚手架命令注册和执行过程开发
本周将完成脚手架内核@imooc-cli/core子项目的执行命令阶段,我们将采用分离式架构设计、缓存结构设计大幅提升脚手架的下载速度和执行性能。
 
课程安排:
1、掌握脚手架执行命令原理
2、掌握高性能脚手架架构思路和具体方法
3、封装通用的npm包管理类Package
4、掌握API方式完成npm包下载和自动更新
5、掌握脚手架缓存结构设计
6、掌握Node多进程的四种实现方案
7、深度解析Node多进程child_process库源码
第5周   脚手架创建项目流程设计和开发
本周将开发脚手架创建项目的@imooc-cli/init子项目,完成init包的准备阶段和下载模板阶段开发。
 
课程安排:
1、脚手架项目创建能力架构设计
2、深入理解命令行交互原理和inquirer的应用
3、掌握服务端框架egg.js的开发方法
4、掌握云mongodb和egg接入mongodb方法
5、运用egg.js+mongodb构建项目模板API
6、掌握正则表达式并完成项目名称自动格式化
7、掌握spinner实现命令行loading效果
8、完成标准项目模板开发
9、完成项目模板的缓存和下载功能
第6周   脚手架项目和组件初始化开发
init包将完成项目和组件的初始化过程,本周将完成init包的安装模板阶段。
 
课程安排:
1、掌握脚手架标准安装模式和自定义安装模式实现原理
2、掌握ejs模板的实现原理和开发方法
3、基于ejs模板完成项目模板动态化
4、完成标准组件模板开发
5、完成项目或组件项目标准安装流程开发
6、完成自定义项目模板初始化流程开发
7、ejs源码解析——彻底搞懂ejs模板编译和渲染原理
8、require源码解析——彻底搞懂Node.js模块加载原理
阶段二:B端项目分析和设计,编辑器初步编码,业务组件库的搭建
第7周   B端项目需求分析 和 架构设计
对于一个复杂前端项目,在编码之前,分析过程可谓是“磨刀不误砍柴工”,本周我们来给大家讲解怎样一步步抽丝剥茧,从需求到难点,再到系统整体设计。
 
课程安排:
1、整体需求分析初步 和 细化:编辑器需求分析
2、编辑器开发的难点分析 和 难点可能使用解决方案
3、整体架构设计
第8周   前端基础技术回顾和巡礼
在课程正式开始之前,扎实的基础知识是本课程的必备条件。这一周,让我们一起来温习 - typescript,vue3,ant-desing-vue 以及 webpack 和 rollup 的基础知识。
 
课程安排:
1、Typescript - 进入类型的世界
2、vue3 以及 新版全家桶 vuex,vue-router
3、ant-design-vue - 完美支持 vue3 的组件库
4、webpack 和 rollup - 现代打包工具双雄
第9周   项目整体搭建
万事开头难,本周我们使用技术储备中简介的知识,来搭建项目的大体结构和框架,包括 项目创建,代码结构,基础路由,基本布局和 基本的全局数据结构。
 
课程安排:
1、使用 imooc-cli 创建项目
2、规定代码规范和项目结构 ,安装编辑器辅助插件
3、使用 vue-router 添加基础路由结构
4、使用 ant-design-vue 搭建基础布局
5、使用 vuex 创建项目的基本数据结构
第10周   编辑器基本布局,及业务组件库初步开发
本周从编辑器开始开发,完成编辑器的基本布局,并且分析组件属性和修改组件属性的对应关系,创建业务组件库的第一个组件,并且完成最简单的编辑器交互,最后提出了业务组件实时实现编辑更新的解决方案。
 
课程安排:
1、创建编辑器的基本布局
2、分析画布组成元素的组件属性
3、创建第一个组件 LText
4、属性和编辑组件的实现方案
第11周   掌握测试基本工具,给组件库添加单元测试
本周从什么是测试入手,简介了测试的基本概念,介绍通用测试工具 Jest 和 Vue 测试框架 vue-test-utils,然后使用这两种工具完成LText组件的单元测试。
 
课程安排:
1、Jest 简介和基本用法
2、vue-test-utils 的基本用法
3、为 Ltext 添加测试用例
第12周   编辑器组件属性编辑面板功能开发
本周主要针对不同属性来完成对应编辑组件的开发,由易到难的开发了 IconSwitch,ColorPicker 和 通用上传组件,中间还穿插了 TDD 的开发方式。
 
课程安排:
1、开发 IconSwitch 组件 并且 撰写测试
2、TDD 开发方式开发 ColorPicker 组件
3、二次开发通用上传组件 并且 撰写测试
4、作业:写一个 BackgroundProcess 组件
第13周   业务组件库打包、发布,添加 CI/CD
本周继续丰富业务组件库的功能,将组件库剥离成单独的代码库,使用 rollup 打包成多种 JS 模块形式,发布到 NPM,最后还使用 travis 完成了 CI/CD 流程。
 
课程安排:
1、创建单独的组件库代码库
2、添加剩余的业务组件
3、使用 rollup 打包生成多种 JS 模块
4、发布至 npm 和 使用 husky 完成发布前测试
5、使用 travis 完成组件库 CI/CD 功能
阶段三:从 0 搭建编辑器服务端
第14周   服务端技术选型:磨刀不误砍柴工
本周介绍做服务端必备的技能、框架、工具和服务,以及为何选择他们。 这些都是做服务端开发的基础知识,必须全部掌握,否则接下来开发会遇到很大障碍。
 
课程安排:
1、为何选择 koa2 框架,而不是 express egg nest.js
2、三大常用数据库 Mysql Mongodb Redis
3、使用 JWT 做登录验证,放弃 Session
4、用 jest 做单元测试和接口测试
5、pm2 和 nginx 能保证服务端高效稳定运行
第15周   服务端 CI/CD :github自动化
CI/CD 是软件开发的必备流程,它可以实现自动发布到测试机,自动部署测试环境。本周我们使用 github actions 和 docker 这两大利器,从 0 实现 CI/CD 流程。
 
课程安排:
1、github actions 一颗的 CI/CD 新星
2、docker 让你一键拥有各种软件环境,如 Mysql
3、docker-compose 快速搭建测试环境
4、提交代码,自动发布到测试机
5、提交代码,自动触发单元测试
第16周   编辑器服务端基础 API 开发
本周正式开发业务开发。开发之前要做技术方案设计(接口设计,数据库设计),初始化项目环境和 CI/CD 流程。然后完成所有业务功能开发,同时进行单元测试和接口测试。
 
课程安排:
1、接口设计,捋一捋需要提供哪些 API
2、数据库设计,如何存储更加合理
3、初始化项目环境,连接数据库,跑通 CI/CD 流程
4、各个模块的代码介绍,不会一行一行带着写代码的
5、单元测试和接口测试,边开发边测试,才能保证稳定性
第17周   编辑器服务端调用第三方服务
真正线上项目才需要这些功能,还要花钱购买第三方服务,一般课程不常见到。这些功能很实用,很大众,学完即可照搬到实际项目中。
 
课程安排:
1、用短信验证码实现登录
2、内容安全检查,屏蔽所有黄色、血腥、政治敏感内容
3、上传图片到阿里云 OSS
阶段四:完善B端所有功能,前后端结合和性能优化
第18周   编辑器组件图层面板功能开发
本周继续进行属性编辑面板的功能,完成属性的分组功能,完成图层面板的显示 隐藏 锁定 排序等功能。最后完成背景设置面板的功能,在这个过程中,学习一系列第三方库的使用。
 
课程安排:
1、使用 cropper.js 开发 image processer 组件
2、同属性分组并且开发 EditGroup 组件
3、开发图层面板 并且 使用 vue-draggable-next 完成排序功能
4、背景设置面板开发
第19周   让元素动起来 - 编辑器画布交互功能开发
本周是集中火力在编辑器交互功能上,完成元素的拖动定位,拖动改变大小,快捷键支持,重做,回滚,右键菜单等一系列功能的开发。
 
课程安排:
1、拖动定位功能开发
2、拖动改变大小功能开发
3、使用 hotkeys js 开发快捷键功能
4、实现 Undo Redo 功能
5、添加右键菜单功能
第20周   前后端结合 - 编辑器整合后端接口
本周开始接入后端开发,实现作品的预览,保存,自动保存,发布和渠道编辑等一系列功能。
 
课程安排:
1、预览功能开发
2、保存和自动保存功能
3、使用 html2canvas 生成截图并发布作品
4、使用 qrcodejs2 生成二维码并实现渠道编辑功能
第21周   整合开发B端其他页面的各种功能
完成了重头戏编辑器,这周来完成其他页面的分析和编码工作,从分析后端接口开始,完成一系列 Vue 应用的通用难点,包括鉴权,全局状态,业务开发 和 使用 Echarts 生成统计图表。
 
课程安排:
1、各页面功能分析
2、使用 Postman 分析 Restful 接口
3、登录页面和单页面应用鉴权的通用处理
4、全局状态(异步Loading,成功,失败)的通用处理
5、首页和我的作品页面开发
6、使用 echarts 生成统计图表
第22周   优化大型项目的各项性能问题
本周来到了大型项目必不可少的环节 - 性能优化。包括 vue 性能的常见优化方案,数据结构的优化以及 webpack 打包分析和优化实施方案的整个过程。
 
课程安排:
1、vue 应用性能优化的常见方案
2、全局状态数据结构的优化
3、webpack 打包分析和优化
阶段五:完善服务端,发布上线
第23周   基于Vue3 SSR渲染作品H5页。
编辑器可以创建、保存和发布作品,但发布后的作品如何查看?本周就来搞定。我们不仅要把 H5 页渲染出来,考虑 H5 前端的各项工作,还要打包、发布静态文件到 OSS 。
 
课程安排:
1、技术方案设计,如何才能渲染出页面
2、初始化项目,跑通 CI/CD 流程
3、Vue3 SSR 渲染页面,基于 lego-components 组件库
4、webpack 打包文件,发布到 OSS
5、h5 前端功能,如事件跳转、url 参数处理
6、h5 响应式,让页面适配所有手机屏幕
7、微信分享,前后端配合使用微信 jssdk
第24周   自研统计服务,使作品能实现分渠道统计
自定义事件统计,是一个线上产品必备的统计功能。目前市面上没有合适的第三方服务,干脆我们就自研一个。包括收集日志、分析日志、Open API 功能。
 
课程安排:
1、技术方案设计,看如何实现一个统计服务
2、nginx 服务收集统计日志
3、定时拆分日志文件,按天拆分
4、定时分析日志,离线计算统计结果,存入数据库
5、提供 Open API ,获取统计结果
6、定时清理过期日志文件,让硬盘无压力
第25周   后台管理:让所有数据都在我们的掌控之中
一个完善的线上产品,后台管理是必备的模块。我们可以查看网站内容数据,管理用户、作品和模板,推荐优质内容,屏蔽垃圾数据。
 
课程安排:
1、需求分析,到底需要查看和管理哪些数据?
2、技术方案设计,如何实现这些功能
3、umijs 脚手架,创建 React 前端项目,跑通 CI/CD
4、使用 React Hooks 开发前端页面
5、开发服务端接口,跑通 CI/CD
6、作业:写各个系统的单元测试和接口测试
第26周   发布到阿里云服务器,支持快速回滚
既然是真实的线上产品,就需要购买各种云服务,配置服务器和数据库,然后正式发布到线上环境,一旦遇到问题还要能快速回滚。
 
课程安排:
1、配置云服务器,安装必备软件
2、配置云数据库,创建账户,开通 IP 白名单
3、流程设计,基于 git tag 和 github actions 实现发布和回滚
4、nginx 配置和二级域名转发
5、线上日志拆分,nginx 日志和 pm2 日志
第27周   运维监控和报警
一个完善的线上产品,必须有完善的运维体系,才能保证稳定运行。包括服务器监控,报警,以及网络安全预防。
 
课程安排:
1、服务器监控,实时检测 CPU 内存 硬盘的健康状况
2、心跳检测,对接口自动定时“体检”
3、统一异常处理,出问题 catch 住,不崩溃
4、报警,有问题第一时间发送邮件和短信
5、万一出问题或内存泄露,自动重启服务
6、安全预防,防刷、防爬、防网络攻击
阶段六:前端发布脚手架开发
第28周   脚手架发布模块架构设计和核心流程开发
完成项目开发后,需要进行前端发布,脚手架的@imooc-cli/publish子项目将完成项目和组件的标准发布流程,本周将完成publish包的架构设计和核心流程开发
 
课程安排:
1、掌握项目/组件标准发布流程架构设计和流程图绘制
2、掌握自动化git流程架构设计和实现细节
3、掌握云构建实现原理和实现细节
4、掌握项目/组件发布原理和实现细节
5、完成public子项目创建和主流程开发
第29周   脚手架发布模块git自动化流程开发
本周将完成项目发布过程中的git flow流程开发,遵循标准的git flow流程,学会可快速改造和优化日常开发中的git处理流程,巩固git的各种使用技巧和方法。
 
课程安排:
1、掌握git操作方法和git flow流程
2、封装通用的git处理类Git
3、掌握git处理过程中的缓存结构设计
4、掌握git处理过程中的各种异常流程
5、完成Github & Gitee Open API接入
6、Git类准备阶段开发,完成各种git配置初始化
7、Git类初始化阶段开发,完成git仓库初始化、remote自动关联、强制合8、并远程代码等功能
9、Git类分支自动比对功能开发,完成代码冲突检查、stash区自动检查、10、自动同步master分支等功能
11、完成Git类代码自动提交功能开发
第30周   脚手架发布模块云构建系统开发
git flow流程完成后,我们将进入脚手架中最重要也是难度最高的一个环节,即云构建系统开发,本周我们通过egg.js+WebSocket+Redis最终实现完成云构建模块开发。
 
课程安排:
1、封装通用的云构建类CloudBuild
2、掌握WebSocket通信协议和开发方法
3、应用egg-socket.io插件快速接入WebSocket服务
4、掌握Redis缓存数据库的应用
5、应用egg-redis插件快速接入Redis服务
6、完成CloudBuild准备和预发布阶段开发,完成发布前配置和各类检查
7、掌握服务端CloudBuild处理流程和实现逻辑
8、服务端CloudBuildTask类封装,完成预处理、源码下载、云构建等流程开发
9、大作业:CloudBuild构建和依赖安装指令动态化功能设计和实现
第31周   脚手架发布模块云发布功能开发
脚手架云构建模块开发完成后,本周将继续完成项目的云发布流程开发。
 
课程安排:
1、掌握前端云发布逻辑实现
2、掌握oss入门使用方法
3、完成服务端oss API接入
4、掌握oss域名绑定+cdn接入
5、掌握项目预发布和正式发布流程
6、掌握项目回滚等异常流程处理
7、完成发布后自动打tag和开发分支删除功能
8、完成发布流程整体开发和联调
9、大作业:项目回滚+多版本发布功能架构设计和具体实现
第32周   脚手架组件发布功能开发
项目发布流程已经调通,本周将完成组件发布流程开发,组件发布流程和项目不同,主要差异在于:组件需要发布到npm和组件信息需要落库,所以需要不同的处理方式。
 
课程安排:
1、完成组件git flow流程开发
2、掌握组件构建和发布流程设计
3、掌握组件预览功能设计
4、完成组件构建和发布流程开发
5、完成组件预览功能开发
6、掌握RDS开通和使用方法
7、掌握egg.js+mysql的开发方法
8、完成组件相关API的开发方法
9、完成组件发布全流程联调
10、完成脚手架整体发布和上线
第33周   组件平台开发
本周将基于umi完成组件库前端部分创建,同时结合react hook开发组件库的前端页面,并将组件库发布上线。
 
课程安排:
1、掌握umi项目的开发方法
2、掌握react hook的开发方法
3、完成antd组件库集成
4、完成组件列表页开发
5、完成组件详情页开发
6、完成组件平台上线
第34周   项目单元测试用例设计和开发
讲解如何开发单元测试用例,并开发测试代码。
 
课程安排:
1、掌握脚手架单元测试库mocha
2、掌握测试用例设计技巧
3、完成脚手架单元测试用例设计
4、完成init库测试用例开发和调试
5、完成publish库测试用例开发和调试
阶段七:架构师领导力培养
第35周   大厂如何管理多人协作的研发项目
本周带领大家进入大厂文化 ,了解大厂如何做项目管理,多人协作的管理,以及团队人员的管理,课程内容复盘,未来技术的发展分析。
 
课程安排:
1、软件研发流程概述,先有一个整体的认识
2、敏感项目研发流程,以及常用工具
3、制定项目计划,包括范围 WBS,时间,质量,风险,沟通
4、计划监控,保证计划顺利执行
5、项目功能迭代和 bug 修复
6、多人协作、工作分配和跟踪
7、大厂绩效考核标准
8、大厂人员面试标准
9、大厂数值汇报方法和技巧
10、大厂标准的工作交流方式
11、整个课程内容复盘
12、未来的技术展望

6到8个月如何达到三年加得前端经验,对标P7,“慕课网 Java工程师2020”的更多相关文章

  1. 裸辞两个月,海投一个月,从Android转战Web前端的求职之路

    前言 看到这个标题的童鞋,可能会产生两种想法: 想法一:这篇文章是标题党 想法二:Android开发越来越不景气了吗?前端越来越火了吗? 我一向不喜欢标题党,标题中的内容是我的亲身经历.我是2016年 ...

  2. 转载:收费版APP三年总结(个人经验+数据图分享)

    各位朋友好,apop感觉这里的朋友有许多是以广告收入为主,所以apop来分享另外一块(收费版APP)的个人三年来的总结分享,希望对各位有帮助.首 先,其实在AppStore(或GooglePlay)上 ...

  3. java工程师之旅-一个月工作心得

    不知不觉,在工作中已经度过一个月,距离上次写文章已经好几个月了,正好还有二十分钟下班,抽点时间来写一下博文,写一下心得. 首先说一下,在我工作之前,做了一个项目,和一个外校大四的学生做一个毕业设计,一 ...

  4. 1月中旬值得一读的10本技术新书(机器学习、Java、大数据等)!

    1月中旬,阿里云云栖社区 联合 博文视点 为大家带来十本技术书籍(机器学习.Java.大数据等).以下为书籍详情,文末还有福利哦! 书籍名称:Oracle数据库问题解决方案和故障排除手册 内容简介 & ...

  5. 10月27日PHP加载类、设计模式(单例模式和工厂模式)、面向对象的六大原则

    加载类可以使用include.require.require_once三种中的任意一种,每个关键字都有两种方法,但是这种方法的缺点是需要加载多少个php文件,就要写多少个加载类的方法.一般也就需要加载 ...

  6. Java工程师:四个月小白变大咖,你能做到吗?

    你眼中的Java工程师是什么样子? 技术大牛?闷骚男?IT民工?没有女朋友?全是汉子?很邋遢?贼眉鼠眼? 今天,中软国际卓越工程师,Java精英班正式开课啦.你想看看他们都是一群怎样的人吗? 今天的武 ...

  7. 2017年11月23日**科技面试java工程师面试总结

    从整个面试看了,表现并不理想,有很多不足. 1.关于手机页面闪现问题的处理.从原理上观察,页面闪现是因为异步请求导致的.在进入页面中首先会加载默认的东西,此时也会访问数据库端,会用ajax判断是否满足 ...

  8. Java学习第一天

    Java学习第一天 对于网络管理员或者黑客必须知道的八个cmd命令 详情请参考:http://www.2cto.com/os/201608/533964.html          nbtstat  ...

  9. 搞JAVA在北京月薪15K的朋友来到厦门却很难找到工作

    朋友是搞JAVA开发的,从北京来.来前朋友们都感觉他在厦门应该很快就能找到工作,因为厦门的IT人员很缺. 没想到来厦门大概半个多月了,到现在都还没着落.面试单位每周基本只有两家,而且面试的感觉都说不错 ...

随机推荐

  1. Access denied for user ''@'localhost' to database 'mysql'问题

    Access denied for user ''@'localhost' to database 'mysql'问题 MySQL : Access denied for user ''@'local ...

  2. msf ms17-010利用笔记

    nmap -sV -Pn xxxxx  扫描端口and系统信息 use auxiliary/scanner/smb/smb_ms17_010   扫描模块 set Rhosts 扫描目标 use ex ...

  3. canvas--总结二

    canvas图形绘制 矩形绘制 rect(x,y,w,h)  没有独立路径 strokeRect(x,y,w,h) 有独立路径,不影响别的绘制 fillRect(x,y,w,h) 有独立路径,不影响别 ...

  4. 园子的品牌专区上新:NoSQL 数据库佼佼者 Aerospike

    品牌专区是园子去年推出的新楼盘,为优秀的科技企业在园子里提供一个地方,展示自己的品牌,分享自己的技术内容. 最近我们和国外领先的 NoSQL 数据库厂商 Aerospike 达成了合作,入驻了园子的品 ...

  5. 风炫安全web安全学习第三十六节课-15种上传漏洞讲解(一)

    风炫安全web安全学习第三十六节课 15种上传漏洞讲解(一) 文件上传漏洞 0x01 漏洞描述和原理 文件上传漏洞可以说是日常渗透测试用得最多的一个漏洞,因为用它获得服务器权限最快最直接.但是想真正把 ...

  6. 浅谈JVM垃圾回收

    JVM内存区域 要想搞懂啊垃圾回收机制,首先就要知道垃圾回收主要回收的是哪些数据,这些数据主要在哪一块区域. Java8和Java8之前的相同点有很多. 都有虚拟机栈,本地方法栈,程序计数器,这三个是 ...

  7. logback为不同的包或类指定输出日志文件

    对日志分割的常见需求是,需要按不同的等级进行输出,这个的配置方式类似如下,在appender节点内添加内容 <appender name="FILE-INFO" class= ...

  8. Windows同一软件不同窗口如何快速切换

    windows快速切换应用的快捷键是Alt + Tab 这个快捷键可以在多个应用之间快速切换,但是软件多开时,而此时我只想在同一软件内的多个窗口切换,一切换好多个窗口扑面而来,我还要去用找并用鼠标点击 ...

  9. 【Linux】在docker上部署grafana+zabbix监控实录

    -------------------------------------------------------------------------------------------------   ...

  10. 【Oracle】userenv()函数介绍分析

    说到这个userenv()使用起来还是很有用的 参数   功能 CLINET_INFO                                      返回最高可达64个字节存储的用户会话信 ...