Day 01
上午
《TypeScript核心概念解析》:本小节45分钟。TypeScript是微软开发的一门编程语言,它是ES6的超集。从目前的发展来看,市场对它的接受程度正在变得越来越高,各种前端框架都已经提供了TS版本的实现。这里不一一列举TS的语法细节,重点解析TS中的几个核心概念:接口、泛型、装饰器,掌握这些内容可以更好地理解Angular中的各种概念。
《Webpack与@angular/cli》
第1节:webpack核心概念
第2节:webpack的处理流程
第3节:快速上手
第4节:css-loader的用法
第5节:font-loader的用法
第6节:image-loader的用法
第7节:支持TypeScript
第8节:@angular/cli核心功能
第9节:Schematics与代码生成器
每个小节都有自己上手的例子
Day01下午
第1节:搭建开发环境(略过,参考上一节)
第2-1节:组件概述
第2-2节:把CSS预编译器改成SASS
第2-3节:模板
第2-4节:组件间通讯
第2-5节:详解生命周期钩子
第2-6节:动效
第2-7节:动态组件
第2-8节:ShadowDOM
第2-9节:内容投影
第2-10节:@ContentChild@ContentChildren
第2-11节:@ViewChild与@ViewChildren
第2-12节:与Polymer封装组件的方式简单对比
第2-13节:封装并发布你自己的组件库
第3-1节:指令简介
第3-2节:自定义指令
第3-3:直接在组件里面操作DOM
第一章:动手搭建开发环境,angular/cli是一个非常强大的集成开发环境,这是Angular相比于其它框架非常有优势的地方。动手目标是带领大家搭建好开发环境,掌握创建项目、自动创建组件、用VS code直接调试TypeScript代码等日常开发必备的基本操作,熟练使用angular/cli可以帮助大家在开发过程中节省大量的时间。
第二章:每个小节都安排一个动手的任务,这一章的目标是全面细致地掌握Angular组件的各种用法。在动手环节中,会带领大家练习如何引入PrimeNG组件、如何基于PrimeNG组件开发自己的业务界面。
第三章:每个小节一个动手环节,这一章的目标是全面掌握指令的概念和写法。特别解释一下新版本里面“组件”和“指令”这两个概念的区别,这是很多开发者感到比较困惑的地方。指令是一个非常重要的概念,如果以后需要封装自己的组件库,指令是必须熟练掌握的内容。
Day02上午
第4节:模块@NgModule
第5-1节:路由概述与基本用法
第5-2节:路由与异步模块
第5-3节:模块预加载
第5-4节:路由守卫
第5-5节:多重出口
第四章:练习模块基本写法、共享模块用法、动态载入模块、模块与全局单例这4个技术特性。Angular中“模块”的概念和ES6中的“模块”概念完全不同,Angular中的“模块”是一种“业务模块”的概念,而ES6中的“模块”更多是语法层面上的概念,我们通过上手写代码来深入理解这一点。
第五章:目前,无论用什么样的前端框架,路由都是一个不可或缺的模块。Angular的路由模块的功能极其强大,它支持无限嵌套、负责管理组件的生命周期、可以与angular/cli配合自动切分chunck、同时和可以支持前端权限控制等高级特性,我们会通过代码一个一个练习这些特性。
Day02 下午
第6-1节:表单快速上手
第6-2节:双向数据绑定
第6-3节:表单校验
第6-4节:模型驱动型表单
第6-5节:动态表单
第7节:服务
第8-1节:RxJS快速上手
第8-2节:RxJS深度解析
第8-3节:解析双向数据绑定的原理(RxJS与zone.js的协同原理)
第8-4节:详细依赖注入的处理过程
第9节:国际化(i18n)
第10-1节:单元测试
第10-2节:集成测试
第11节:一款基于Ionic的Hybrid应用实例讲解(移动开发)
第12节:用Angular开发PWA应用
第六章:练习表单的3种使用方式。
第七章:练习Service和依赖注入的用法。
第八章:上手练习Observable的各种创建方式、典型的operator的用法。(本章不仅仅讲述RxJS,同时会讲解RxJava 2.0、
spring-reactor、RxAndroid的案例,因为在JS里面没有多线程的概念,而RxJava里面的多线程用法更加精彩。通过各种使用场景方便大家对比参照,更加深入地掌握“反应式编程”范式)。
第九章:练习国际化的写法、同时练习如何在封装组件的时候兼顾到国际化的问题。
第十章:动手搭建自动化测试环境、掌握Jasmine断言式语法以便编写测试用例。
课程收益
1. 掌握Angular框架的核心概念和设计思想;
2. 熟练使用Angular进行业务开发;
3. 基础好的同学可以达到封装UI Library的水平;
培训对象
1. 有AngularJS 1.x使用经验的开发者。
2. 有其它前端框架使用经验的开収者(如jQuery、ExtJS等均可)。
3. 有后端编程经验(如Java、.NET、PHP等均可),希望学习前端技术的开发者。