点击此处返回《鸿蒙开发学习路线图》汇总
开发热身总共有5步，以下是步骤详解：
第1步：Web 页面布局
HTML：HTML元素和属性;HTML表单和图形处理;HTML媒体和最佳实践
CSS：CSS基本语法与选择器;CSS背景、文本、边框、轮廓与颜色;CSS列表、表单与表格样式;CSS样式层叠与继承;CSS盒模型、定位、浮动和显示属性;CSS渐变、阴影与滤镜;CSS变换、过渡与动画; Web字体与多列布局
页面制作工具：VSCode及插件;PhotoShop的使用和图片整合;markman、pxcook工具使用;蓝湖、sketch与axure工具使用
布局技术：BFC、IFC、GFC、FFC等概念;Flex弹性布局;网格布局;媒体查询;viewport、rem、vw、dpr与ppi
布局规范与方案：PC端网站布局规范;PC端管理系统布局规范;流式布局(100%布局);等比缩放布局(rem布局);响应式布局;移动端reset, 1px border, 高清图片;移动端设备适配最佳实践
第2步：JavaScript 语言
原生JavaScript交互功能开发：基本语法;流程控制语句;函数与数组;String与Date;BOM与DOM;拖拽效果;客户端存储(cookie存储、WebStorage);正则表达式;Ajax;面向对象基础;运动与游戏开发;数据结构与算法。
面向对象进阶与ES应用：Promise;async/await语法;try/catch语法;原型链;构造函数;执行上下文栈与执行上下文;作用域链;闭包;this;ES5-ES12;设计模式。
JSON 数据交换格式：JSON 语法规则;JSON5 的使用
第 3 步：TypeScript 语言
基础入门：TypeScript 介绍;TypeScript 入门;常用类型;类型缩小;函数;对象类型;类型操纵类;模块。
高级进阶：变量声明;类型推断;枚举;公共类型;Symbols;类型兼容性;迭代器和生成器;装饰器;JSX;混入;三斜线指令;模块;模块解析;命名空间;命名空间与模块;声明合并。
第 4 步：Node.js
前端工程化与模块化：Linux 常用命令;Less/Sass;NPM;Git 的使用;AMD/CMD/UMD;ES6模块化
高级进阶：Node.js 服务端开发;Node 基础入门;Express 框架基础;中间件开发;MVC开发模式;基于Express的后端路由;MongoDB数据库的基本使用;MySQL数据库的基本使用;基于Token的登录状态保持;Node.js的EventLoop;文件上传(单文件/多文件);模板引擎;静态资源加载;服务端渲染页面
第 5 步：构建工具
Webpack:
基础入门：为什么需要Webpack;小试 Webpack;自动引入资源;搭建开发环境;资源模块;管理资源;使用 babel-loader;代码分离;缓存;懒加载;拆分开发环境和生产环境。
高级进阶：提高开发效率，完善团队开发规范;模块与依赖;扩展功能;多页面应用;Tree shaking;渐进式网络应用程序 PWA;shimming 预置依赖;创建 library;模块联邦;提升构建性能。
vite：为什么选用Vite;搭建Vite开发环境;创建第一个Vite项目;NPM依赖解析和预构建(依赖预构建简介、esbuild、缓存);模块热重载(常用框架集成、HMR-API);Vite+TypeScript;Vite中的Vue和JSX(使用Vite创建Vue2项目、Vite支持Vue3使用JSX);在Vite中使用CSS;Vite静态资源引用;Vite中使用WebWorker;Vite中引入WebAssembly;Vite中导入JSON及Glob导入;Vite中集成ESLint;构建生产版本;环境变量和模式;腾讯云Webify项目部署;服务端渲染SSR(Vue3案例、React案例);后端集成。
京公网安备 11010802030320号