南京博睿同创教育

**章：前端开发基础篇(10天)

第二章：移动web开发篇(7天)

第三章：javascript网页编程篇(19天)

1.Javascript基础：JavaScript 介绍，应用，编写，执行console注释变量，变量声明提升，全局变量，常量7 大数据类型Object 三种类型、typeof、数据类型转换运算符流程控制：条件分支，循环，异常处理，break，continue函数：定义，调用，函数表达式，函数递归,arguments函数的作用域闭包 Closures立即执行函数、预定义函数json数据处理常用内置对象：Function, Number, Math, Date, StringArray 数组，数组方法 pop push shift unshift，自定义数组排序，冒泡排序字符串、数组的相关函数大量案例演示，学会使用js编码程序,实现简单业务逻辑；

2.web-API：DOM层级、类型查找DOM节点操作对节点的删除、添加、修改操作节点间的固定定位距离、页面滚动距离、页面滚动事件获取元素宽高及属性获取可视区的大小弹窗及window.location、window.navigator的使用光标事件event对象事件流、事件捕获、事件冒泡、取消事件冒泡事件绑定、取消事件绑定键盘事件默认事件及如何组织默认事件事件委托及事件委托的好处大量案例演示，学会使用js操作DOM节点,实现各种业务逻辑,效果；

3.javascript高级：正则表达式RegExp对JS风格正则涉及到的函数 search、match、replace正则匹配的关键字、[]、排除、转义字符、量词的使用、中文匹配面向对象、OOP特点抽象、封装、继承工厂模式深入介绍闭包构造函数、原型、原型链继承、原型继承、call apply继承es6的解释、es6发布时间es6运行环境let、const解构Destructuring模板字符串函数参数的默认值箭头函数类和类的继承set、mapPromise 承诺编程，使用正则表达式完成字符的校验,可以使用原型创建对象,使用箭头函数等；

4.数据可视化Echarts：大屏幕适配技术解决方案的应用Echarts 各类型数据可视化图表的应用根据需要求创建折线图、K线图、地图等图表，使用Echarts可以创建出企业项目中需要的各种图表；

第四章：前后端交互篇(9天)

第五章 Vue.js篇(24天)

1.Vue基础：Vue 特点Vue 实例插值表达式 {{}}指令: v-bind, v-if, v-for, v-model, v-on使用组件构建应用Vue 实力属性和方法实例生命周期模板语法与绑定过滤器 Filter计算属性 computed方法 methods观察 Watchersv-bind:class, v-bind:style条件渲染：v-if, v-show列表渲染组件和 v-for数组更新检测：变异方法，非变异方法事件处理器$event 特殊变量事件修饰符按键修饰符，内置按键别名，组合按键修饰符表单控件绑定表单绑定修饰符：.lazy, .number, .trim，使用Vue.js可以创建前端程序；

2.Webpack+ES6模块化：WebpackWebpack 安装，打包，脚本配置，运行Source Map 配置使用 webpack 构建本地服务器LoadersBabelBabel pluginsjson loadercss loader & style loaderCSS modules 模块化:globalCSS 预处理器less loadersass loaderpostcss loaderbanner pluginhtml webpack pluginhtml webpack pluginextract-text-webpack-pluginuglifyjs-webpack-pluginCode Splitting – CSSCode Splitting - require.ensure缓存控制babel默认导入/导出按需导入/导出，使用WebPack可以打包我们的前端程序进行上线使用；

3.Vue高级：组件 Component注册全局，局部组件组件命名约定is 属性组件 data 函数父子组件数据传递prop 验证自定义事件：$on, $emit原生事件监听 .native非父子组件通信Slot 分发内容单个 Slot，匿名 Slot，具名 Slot作用域插槽动态组件keep-alive可复用组件子组件索引 $refs异步组件 resolve rejectv-once异步队列更新自定义指令 Directive混合 Mixin，全局混合插件 Plugins，自定义插件单文件组件和项目CSS 抽取路由 RouterVue 单元测试及覆盖率报告生成Vuex，使用Vue高级知识点创建Vue程序；

4.Vuecli3+ElementUI：Layout 布局,Container 布局容器,Color 色彩Typography 字体,Icon 图标Button 按钮,Form,Radio 单选框,Checkbox 多选框Input 输入框,,InputNumber 计数器Select 选择器,Cascader 级联选择器Switch 开关,Slider 滑块TimePicker 时间选择器,DatePicker 日期选择器,DateTimePicker日期时间选择器Upload 上传,Rate 评分,ColorPicker 颜色选择器,Transfer 穿梭框Form表单,Data,Table表格,Tag 标签,Progress 进度条Tree 树形控件,Pagination分页Badge 标记,Notice,Alert 警告Loading 加载,Message 消息提示MessageBox 弹框,Notification 通知Navigation,NavMenu 导航菜单Tabs 标签页,Breadcrumb 面包屑Dropdown 下拉菜单,Steps 步骤条,Dialog 对话框Tooltip 文字提示,Popover 弹出框Card 卡片,Carousel 走马灯,Collapse 折叠面板，使用Element-UI组件库进行项目的开发；

5.Vue项目：使用技术：vue+vue-cli+vuerouter+vuex+localStorage+swiper+axios课程涉及知识点：vue:vue基础、vue组件及组件间传值、vue属性方法指令、vue过滤器、计算属性、列表渲染、修饰符、axios等vuex:统一状态管理 store 、state、actions、mutations、gettersrouter:vue路由的定义、子路由的定义、路由链接的使用、路由传参、路由懒加载、路由守卫本地缓存:localstorage、sessionstorageswiper:轮播插件的引入，轮播的配置Vant，使用Vue.js进行实际项目的开发；

第六章 微信小程序篇(10天)

第七章 react.js篇(12天)

1. react基础：JSX组件系统虚拟 DOM生命周期无状态组件有状态组件refclass组件通信create-react-app路由插值state，掌握React基本语法，能够使用class组件实现常见的业务功能；

2. Hooks：useStateuseEffectuseRefuseContextuseEffect高级用法放大镜案例购物车案例，运用hooks核心知识实现购物车和放大镜经典案例效果。

3. Redux：状态管理流程actiondispatchstorereducerredux-thunk 中间件combineReducersreact-redux开发调试工具点餐案例，结合React技术栈，运用redux实现点餐系统的状态管理 ；

4. React项目：

   1.基于react hooks实现中大型后台管理系统的解决方案

   2.基于ant-design组件库解决方案

   3.基于react-router的前端路由解决方案

   4.基于redux的状态管理解决方案

   5.基于react-quill的富文本编辑器解决方案

   6.基于create-react-app的构建react项目解决方法

   7.基于axios封装请求工具类解决方案

   8.基于token的前端登录解决方案