Web前端框架选型与应用

Web前端框架选型与应用
    马上咨询


    张老师  曾负责滴滴出行公共前端团队

    • 带领团队完成了国内第一本Vue.js的书籍《Vue.js权威指南》并受到 Vue.js作者的亲自审核和写序。
    • 2004年接触到Vue.js,国内最早一批应用Vue.js 从1.*到2.*到公司大型前端负责项目中,组织编写过Vue.js的公司级组件库以及构建等解决方案。
    • 同时也是应用了多个类似的MV*框架:从很早的backbone,再到13年开始接触的React和AngularJS,到后来的Polymer,在项目实战中踩过了各种坑,组织参与了一些公司级的组件库开发和复杂业务模块的设计,也在与之配套的工程化闭环里做了很多解决方案。


    培训目标   

    Web前端框架概览

    Web前端框架实现原理

    JavaScript框架设计模式

    典型JS框架解析与应用

        Angular JS观念与架构

        Angular JS基础开发入门

        Angular JS与Restful API整合

        React Native比起标准Web开发或原生开发能带来的三大好处

        React JS框架原理与应用

        Node JS框架原理与应用

    JavaScript高效开发

         JavaScript高性能开发

          JS下的测试与构建

    前端应用发展趋势和框架选择方法

    学员基础

    具有Html、Css、JS开发经验

    课程大纲

    Web前端框架概览   
    Web前端技术架构:
    • 展示层:html,css
    • 控制层:JavaScript
    • 后端服务接口:ajax,restful,node.js
    Web前端运行原理解析
    Web前端当前开发趋势
    典型的web前端开发框架:
    • jQuery、
    • AngularJS
    • ReactJS
    • Node.JS
    • Prototype、
    • Dojo
    • YUI
    • ZK、
    Web前端框架实现原理
    主流JS框架实现剖析:jQuery、AngularJS,ReactJS,Node.JS
    浏览器工作原理
    • Html加载
    • Css渲染
    • Js 处理
    • 事件与响应的过程模型
    • JavaScript对象生命周期管理
    • JavaScript对象关系绑定:继承、多态
    JS框架实现原理剖析
    • 类库的组织
    • JS事件响应模型
    • Html对象注入方式
    • 应用JS的绑定与注入
    JavaScript 框架设计模式
    JavaScript 与面向对象
    • 使用function在ECMAScript 5规范下模拟类和继承
    • ECMAScript 6严格语法模式中接口的定义与实现
    AMD异步模块定义的使用
    MVC模型框架与实现
    MVP模型框架与实现
    JavaScript的模块化 与动态装载管理
    jQuery框架原理与应用
    JQuery结构解析
    JQuery资源目录
    JQuery编程接口
    jQuery事件模型
    JQuery中的样式定制
    JQuery实用工具函数
    在JQuery中使用插件
    AngularJS 观念与架构
    认识AngularJS 核心观念
    了解 jQuery 与 AngularJS 的差异
    体验以对象模型为基础的网页操作模式
    认识 MVC 架构 ( Models, Views,Controllers )
    认识 DI 设计模式 (DependencyInjection) 
    AngularJS 基础开发入门
    执行AngularJS 的多种方式
    认识 Angular 表达式 (AngularExpression)
    认识 Angular 过滤器 (Filters)
    认识 Angular 控制器 (Controllers)
    认识双向资料系结 (Two-way data binding)
    认识内建的 Directives ( HTML 指令 )
    如何加载额外的 Angular 模块
    了解 Angular 执行生命周期
    AngularJS 与 RESTful API 整合
    呼叫后端API 的开发技巧 (使用 $http 服务)
    呼叫后端 API 的开发技巧 (使用 $resource 服务 )
    ReactJS框架原理与应用
    ES6 React
    虚拟DOM(virtualDOM)
    组件驱动开发(component-driven development)
    不变性(immutability)
    自上而下的渲染(top-down rendering)
    渲染路径和优化
    打包工具, ES6, 构建请求, debugging, 路由等
    同构React(isomorphic React)
    NodeJS框架原理与应用
    NodeJS背景介绍
    NodeJS安装与模块化
    NodeJS与NPM管理
    NodeJS文件操作
    NodeJS中的网络访问
    NodeJS的进程管理
    NodeJS中的异步编程
    JavaScript 高性能开发
    加载与执行:JavaScript 脚本的加载和执行是阻塞模式,为了提高性能应该调节加载位置和顺序。
    数据访问:JavaScript 中使用不同的数据类型来存储数据,会有完全不同的执行性能,这里专注介绍该使用何种方式进行数据存储以提高性能
    DOM 元素的遍历 :专门介绍针对不同浏览器该使用何种方式来遍历页面元素以提高性能
    流程控制优化 :算数表达式和流程控制部分介绍通过优化循环和比较流程优化程序性能
    响应模式优化 :开发体验中最糟糕的莫过于点击页面无响应,此内容介绍如何提UI 响应性能机制
    JS下的测试与构建
    JS的自动化构建与测试流程
    JS下的调试工具
    JS下的单元测试工具:Jasmine/ Mocha
    JS下的代码检查工具:JSHint/ JSLintMate
    JS下的自动化测试工具:Selenium
    基于Grunt的js构建与自动化测试
    前端应用发展趋势和框架选择方法
    前端应用发展的多平台化:PC、移动终端、HTML5
    浏览器相关技术规范的发展趋势:
    • 支持HTML5
    • 静态转动态
    • 支持更多媒体格式与操作
    • 离线存储
    • 后台服务
    前端框架选择建议
    如何根据自己的应用需要组合框架,
    大型web应用:前端框架组合范例参考