前端知识体系
前端三要素
- HTML
- CSS
- JavaScript
- Native原生JS开发
- TypeScript微软的标准
需要编译成JS - JavaScript框架
- jQuery - 频繁的DOM操作，影响前端性能
- Angular - Google、模块化、TypeScript语法
- React - Facebook、虚拟DOM、JSX语言
- Vue - 渐进式JavaScript框架，综合模块化、虚拟DOM，仅视图层的处理
- Axios - 前端通信框架，类jQuery的AJAX通信功能
- UI框架
- Ant-Design： 基于React的UI框架 - 彩蛋？？？
- ElementUI： 基于Vue的UI框架
- iview： 基于Vue
- 飞冰： 基于Vue
- Bootstrap： Twitter推出
- AmazeUI： “妹子UI”
- JavaScript构建工具
- Babel
- WebPack
三端统一
混合开发（Hybrid App）
PC、Android、IOS
Android->.apk IOS->.ipa
- 云打包：HBuild
- 本地打包：Cordova
后端技术
- NodeJS：为了方便前端人员开发后台应用，临时处理
- Koa：主流框架（类似spring）
- NPM：类似Maven
- Yarn： 类似Maven和Gradle的关系，打包效率高
- deno?
前后分离演变
为什么？
- MVC
- 前端开发重度依赖开发环境
- 前后端职责纠缠不清，数据展示不正确，谁的错？
- 前端发挥局限，优化-经常要和后端合作
什么是前后分离
基于AJAX带来的SPA时代
Asynchronous JavaScript And XML，正是提出并开始使用CDN作为静态资源存储
- 谷歌 - Web2.0时代
- 缺点：前后端接口的约定
前端为主的MV*时代
- MVC（同步通信为主）
- MVP（最早：安卓、ios端，一步通信为主）：过度
- MVVM（异步通信为主）：Model、View、ViewModel
- 缺点：全异步，对 SEO 不利。往往还需要服务端做同步渲染的降级方案；URL Design需要后端配合
NodeJS带来的全栈时代
Soc 关注度分离
前端MVVM模式
Model-View-ViewModel
- 核心：
ViewModel- 该层向上与视图层进行双向数据绑定
- 向下与 Model 层通过接口请求进行数据交互
- 为什么要用MVVM
- 低耦合
- 可复用
- 独立开发
- 可测试
学习路线
