前端与移动开发基础班课程大纲 |
|||
所处阶段 |
主讲内容 |
技术要点 |
学习目标 |
第一阶段: |
HTML5 |
1、 浏览器与浏览器内核2、语法及使用、3、 常用标签4. 语义化5、 表单元素6、 HTML 、7 新增标签 |
可掌握的核心能力: |
CSS3基础 |
1、CSS基本语法规范2、 常用的选择器用法与技巧 3、复合选择器使用4、 数值与单位5、文字文本样式 6、 CSS3新增选择器 |
||
CSS3进阶 |
1、 CSS盒子模型 2、 CSS背景技巧 3、 圆角/阴影/过渡 4、 定位和浮动 5、 伪类和伪元素 6、chrome调试工具 7、CSS高级技巧(精灵图、CSS三角、图标字体等)8、. CSS常见布局技巧大全 9、 网页开发规范以及流程 10、CSS企业级网页开发 11、网页开发常见问题以及解决方案 12、 CSS常见兼容性问题以及解决方案 13、CSS3新增属性 14、 Photoshop切图 15、cutterman插件一键切图 |
||
电商项目 |
1、代码组织原则 2、项目开发实战流程 3、 电商类复杂页面布局规范 4、CSS初始化技术选择(Normalize.css使用)5、 CSS字体图标使用 6、CSS 属性书写顺序规范7、完整的多页面开发 8、 网页语义化设计 9、 CSS页面模块化开发 10、favicon图标制作 11、复杂网页结构排版技巧 12、 常见动画过渡特效 13、电商类常见布局问题解决方案 14. 将电商项目部署到web服务器 |
前端与移动开发就业班课程大纲 |
|||
所处阶段 |
主讲内容 |
技术要点 |
学习目标 |
第二阶段: 网页开发 |
CSS3动画 |
1、CSS3的2D和3D变换2、animation动画3、炫酷页面开发(地图大数据热点图、大风车、旋转木马轮播图等) |
学员能力体现: |
移动端页 面开发 |
1、传统布局的局限性2、移动端屏幕介绍3、移动端浏览器介绍4、物理像素&物理像素比5、真机调试、6、viewport视口、7、移动端技术选型、8、移动端主流适配解决方案、9、移动端特殊样式、10、百分比布局&流失布局、11、Flex布局优势、12、盒子父级常见属性设置、13、盒子子级常见属性设置、14、携程网Flex移动端页面开发、15、rem单位使用、16、rem适配、17、预处理器less、18、media媒体查询、19、淘宝flexible.js移动端适配、20、cssrem插件使用、21、cutterman二倍图三倍图切图、22、移动端页面开发流程与规范、23、京东移动端首页开发 |
||
Bootstrap |
1、传统布局的局限性2、移动端屏幕介绍3、移动端浏览器介绍4、物理像素&物理像素比5、真机调试6、viewport视口7、移动端技术选型8、移动端主流适配解决方案9、移动端特殊样式10、百分比布局&流失布局11、Flex布局优势12、盒子父级常见属性设置13、盒子子级常见属性设置14、携程网Flex移动端页面开发15、rem单位使用16、rem适配17、预处理器less18、media媒体查询19、淘宝flexible.js移动端适配20、cssrem插件使用21、cutterman二倍图三倍图切图22、移动端页面开发流程与规范23、京东移动端首页开发 |
||
第三阶段: |
JavaScript 基础 |
1、基本输入输出方法2、变量3、数据类型4、类型转换5、运算符6、流程控制语句7、数组8、函数9、自定义对象10、内置对象和常用方法11、网页版小娜小项目 |
学员能力体现: |
WebAPIs编程 |
1、获取页面元素的常用方法2、页面中的事件和事件机制3、操作元素的样式和属性4、新增元素和移除元素5、BOM操作大全 |
||
网页应用/网页特效 |
1、轮播图2、页面放大镜3、待办事项列表4、购物车5、tabs6、JSON7、其它常用网页特效 |
||
jQuery快 速开发 |
1、jQuery的优势2、jQuery选择器3、jQuery中的动画4、jQuery中的DOM操作5、链式编程和隐式迭代6、插件使用和制作7、常见网页特效制作大全 |
||
面向对 象编程 |
1、面向对象思想、2、创建对象、3、JavaScript中的对象深入理解、4、闭包原理以及使用场景、5、原型以及原型链深入剖析、6、作用域链深入分析、7、函数的调用方式及this指向总结、8、Class类、constructor、super |
||
第四阶段: 与AJAX |
AJAX编程 |
1、AJAX的作用2、原生AJAX3、同步与异步4、http协议5、AJAX的封装6、jQuery的AJAX7、缓存问题及解决方案8、跨域请求及解决方案9、前端模板引擎 |
学员能力体现: |
git |
1、git历史2、git与svn3、git基本使用4、git分支5、git远程仓库6、git冲突及解决方案 |
||
综合项目: |
1、项目初始化2、前后端分离开发3、Postman工具使用4、用户注册/登录/退出5、文章管理模块6、评论管理模块7、用户中心模块8、项目部署与发布 |
||
ES6 |
1、es6简介2、新增语法3、内置对象扩展4、Promise5、Async函数6、解构7.展开运算 |
||
Node.js基础 |
1、node.js环境安装2、如何用node.js运行代码3、Commonjs4、模块化5、模块与包6、NPM7、CNPM和Yarn8、核心模块使用9、第三方模块使用10、RESTFulAPI |
||
服务端开发(Node.js) |
1、静态和动态网站2、http模块使用3、请求响应原理4、HTTP协议5、处理页面请求6、处理表单7、会话技术(Cookie、Session) |
||
MySQL |
1、MySQL的概念2、MySQL安装3、建库和建表4、增删改查语句5、Node.js操纵MySQL |
||
Express |
1、express的概念2、express的安装3、后端路由4、静态资源托管5、中间件的原理6、常用中间件7、模板引擎8、异常处理9、Express常用API10、RESTFulAPI |
||
第五阶段: 项目实战 |
Vue.js 基础 |
1、Vue实例2、文本与属性绑定3、计算属性computed4、侦听器watch5、Class与Style绑定6、条件渲染7、列表渲染8、事件处理9、表单输入绑定10、Vue实例生命周期11、开发Vue插件和模板过滤器12、自定义指令13、Vue组件系统14、Vue过渡和动画15、VueRouter路由系统16、组件通信17、axios请求库18、VueCLI脚手架工具19、VueDevTools调试工具20、在Vue中操作DOM |
可掌握的核心能力: |
社交媒体- 自媒体管 理系统 |
1、使用VueCLI初始化项目2、使用Git+Github管理项目源代码3、使用echarts开发数据可视化4、使用axios与服务端交互5、使用VueRouter管理项目中的路由6、使用ElementUI框架7、使用Sass预处理器8、基于JWT的前后端token鉴权9、富文本编辑器解决方案10、项目打包发布上线 |
||
webpack |
1、安装与基本配置2、打包JavaScript模块3、打包CSS模块4、打包图片和字体文件模块5、打包less/sass资源模块6、ES6转ES57、打包.vue资源模块8、配置ESLint代码校验工具9、使用clean-webpack-plugin插件清除打包结果目录10、使用HtmlWebpackPlugin打包HTML资源11、处理打包结果的Sourcemaps12、监视打包模式13、使用webpack-dev-server14、模块打包热更新15、treeshaking打包优化16、生产环境和开发环境分离打包17、打包优化之CodeSplitting代码分割18、打包优化之模块懒加载19、打包优化之缓存 |
||
社交媒体- |
1、使用VueCLI初始化项目2、使用Git+Github管理项目源代码3、使用axios与服务端交互4、使用VueRouter管理项目中的路由5、使用VantUI框架6、使用Vuex管理组件状态7、使用Sass预处理器8、基于JWT的前后端token鉴权9、使用Socket.io进行实时通信10、移动端富文本编辑器解决方案11、使用Cordova打包移动App12、项目打包发布上线 |
||
Vue进阶 |
1、组件封装进阶2、MVVM数据绑定原理3、Render方法原理4、$nextTick方法的使用5、发布订阅模式 |
||
服务端渲染 |
1、SSR核心概念2、SSR基本用法3、编写通用代码4、路由和代码分割5、构建配置6、Nuxt.js |
||
大数据 可视化 |
1、数据库可视化基础2、echarts/d3.js入门3、其它可视化库4、大数据可视化实战项目:组件开发 |
||
第六阶段: 小程序 |
小程序 基础 |
1、小程序注册2、小程序开发者工具使用教程3、小程序配置文件4、小程序常用组件5、小程序的模板语法6、小程序中的样式编写7、小程序中的JavaScript8、小程序应用及页的生命周期9、小程序常用API10、小程序中的自定组件11、小程序插件开发12、小程序分包加载13、小程序基础库版及兼容处理14、小程序运行机制15、小程序性能分析及优化16、小程序云开发、云函数、云数据库17、小程序上线和发布 |
可掌握的核心能力: |
小程序项 目:黑马 优购商城 |
1、原生框架的搭建2、商品首页模块3、分类商品模块4、商品列表模块5、商品详情模块6、支付和登录模块7、收藏模块8、购物车模块9、订单模块10、搜索页面模块11、个人中心模块12、意见反馈模块13、项目的优化和发布上线 |
||
第七阶段: 项目实战 |
React.js 基础 |
1、create-react-app脚手架工具2、JSX语法3、条件渲染4、列表渲染和key5、React组件系统6、PureComponent7、setState()8、事件处理9、表单处理10、组件通讯11、render-props12、高阶组件13、虚拟DOM和Diff算法14、ReactRouter路由系统15、Redux状态管理架构16、axios请求库17、AntDesign组件框架、18、CSSModules |
可掌握的核心能力: |
好客租房 |
1、项目初始化2、管理员登录退出3、用户管理4、用户已发布房源查看5、房源列表6、房源列表检索等功能7、使用redux进行状态管理 |
||
好客租 房移动 Web项目 |
1、项目初始化2、首页搭建3、地理定位4、城市选择5、地图找房6、房源搜索7、关键词搜索8、房源详情9、个人中心10、用户登录/注册/退出11、房源收藏12、查看用户收藏房源列表13、房源发布14、已发布房源列表查看15、权限路由组件封装16、移动端长列表性能优化17、React复杂表单处理18、React动画等常见解决方案 |