本书从实战的角度出发，提炼并总结项目开发中需要掌握的前端知识，既可以为前端开发初学者提供清晰的学习路径，又可以为具有3～5年经验的开发者提供进阶的方向。 本书包括5篇。第1篇介绍前端基础，包括前端"三驾马车”（HTML、CSS、JavaScript）和新时代的JavaScript（ES6+、Node.js、TypeScript）；第2篇介绍前端框架，围绕Vue.js 3的基础知识点和Vue全家桶展开介绍，并使用Vue.js 3实战开发一个备忘录项目；第3篇与第4篇介绍前端中级和高级知识（构建工具Vite、浏览器高阶调试、性能优化、Git协作、代码规范）在项目开发中的应用；第5篇全栈开发"仿稀土掘金”项目，帮助读者通过实战将书中的知识融会贯通。 本书内容由浅入深，将理论与实战相结合。读者如果已经掌握了"HTML + CSS + JavaScript”基础，那么学习本书可以快速打牢基础，并逐步完善自己的前端知识体系，最终具备中级和高级前端与全栈开发的能力。

第1篇 前端开发第一步：夯实基础
第1章 前端发展的几个时代
1.1 附属时代
1.1.1 前端的诞生
1.1.2 jQuery实现交互
1.2 分家时代
1.2.1 AJAX出现
1.2.2 前后端分离
1.2.3 三大框架出现并流行
1.3 工程时代
1.3.1 Node.js开启了前端工程
1.3.2 Webpack带来了编译
1.3.3 工程化体系持续完善
1.4 大前端时代
1.4.1 多端开发的现状
1.4.2 跨端开发成为趋势
1.4.3 一处代码，多处运行
1.5 Serverless时代
1.5.1 函数即服务
1.5.2 前后端一体化开发
1.6 本章小结
第2章 前端“三驾马车”，你真的掌握了吗
2.1 HTML：搭建页面的结构
2.1.1 核心DOM体系
2.1.2 语义化元素
2.1.3 了解HTML 5
2.1.4 实现表单与验证
2.2 CSS：修饰页面的布局和样式
2.2.1 3种页面布局方案
2.2.2 样式与动画解析
2.2.3 CSS工程化
2.2.4 动态值与响应式
2.3 JavaScript：页面运行的核心原理
2.3.1 数据类型与函数
2.3.2 变量与作用域
2.3.3 面向对象
2.3.4 事件循环
2.3.5 执行上下文与this
2.4 本章小结
第3章 新时代的JavaScript
3.1 ES6+：下一代语法标准
3.1.1 变量与字符串的扩展
3.1.2 对象的扩展
3.1.3 数组的扩展
3.1.4 函数的扩展
3.1.5 异步编程方案
3.1.6 模块体系
3.2 Node.js：服务端的JavaScript
3.2.1 Node.js基础
3.2.2 Node.js的内置模块
3.2.3 Npm包管理
3.2.4 环境与环境变量
3.3 TypeScript：支持类型的JavaScript
3.3.1 应该使用TypeScript吗
3.3.2 常用类型全览
3.3.3 接口与泛型
3.3.4 装饰器的妙用
3.3.5 吃透tsconfig.json
3.4 本章小结
第2篇 掌握一个主流前端框架
第4章 Vue.js 3的基础与核心
4.1 初识Vue.js 3
4.1.1 声明式渲染
4.1.2 组件系统
4.2 Vue.js的基础概念
4.2.1 状态与方法
4.2.2 条件与列表
4.2.3 模板语法
4.2.4 计算属性与监听器
4.2.5 事件处理
4.2.6 表单双向绑定
4.2.7 DOM操作
4.3 Vue.js的组件体系
4.3.1 组件状态：data与props
4.3.2 组件的自定义事件
4.3.3 组件的生命周期
4.3.4 使用插槽动态渲染模板
4.3.5 使用异步组件提升性能
4.3.6 在组件中自定义v-model
4.4 Vue.js 3的核心：组合式API
4.4.1 选项式API与组合式API
4.4.2 理解响应式状态
4.4.3 生命周期钩子
4.4.4 计算属性与监听器
4.4.5 渲染方式：模板与JSX
4.4.6 与TypeScript集成
4.5 Vue全家桶指南
4.5.1 路由管理——Vue Router
4.5.2 状态管理——Pinia
4.5.3 统一请求管理——Axios
4.6 本章小结
第5章 【实战】使用Vue.js 3编写一个备忘录应用
5.1 需求：备忘录需求分析
5.1.1 分析首页
5.1.2 分析登录页
5.2 设计：搭建项目的基础结构
5.2.1 使用脚手架创建项目
5.2.2 接入UI框架Element Plus
5.2.3 使用Vue Router配置页面路由
5.2.4 使用Pinia做全局状态管理
5.2.5 编写公共组件和公共函数
5.3 开发：业务功能编码
5.3.1 开发登录页
5.3.2 编写用户Store
5.3.3 开发首页
5.3.4 编写首页Store
5.3.5 开发文件夹列表组件
5.3.6 开发备忘录列表组件
5.3.7 开发编辑器组件
5.3.8 实现备忘录编辑
5.4 本章小结
第3篇 从3个方向提升技术实力
第6章 构建工具Vite——将新技术的代码转换为浏览器认识的语法
6.1 认识构建工具
6.1.1 老牌工具——Webpack
6.1.2 轻量工具——Rollup
6.1.3 下一代工具——Vite
6.2 在项目中使用Vite
6.2.1 使用脚手架创建项目
6.2.2 Vite的基础命令
6.3 Vite功能介绍
6.3.1 裸模块解析
6.3.2 依赖的预构建
6.3.3 模块热替换
6.3.4 TypeScript转译
6.3.5 JSX/TSX转译
6.3.6 CSS资源处理
6.3.7 静态资源导入
6.4 Vite配置介绍
6.4.1 多环境配置
6.4.2 通用配置
6.4.3 开发服务器配置
6.4.4 打包构建配置
6.4.5 性能优化配置
6.5 Vite插件系统
6.5.1 Vite官方插件
6.5.2 Vite社区插件
6.5.3 Rollup插件
6.6