前端开发笔记

你好！欢迎来到前端开发笔记，我是何书悦，我在这里分享我的前端开发知识和经验。

文档结构

本笔记涵盖了前端开发的各个方面，包括：

• 基础知识（HTML、CSS、JavaScript）
• 框架与工具（Vue、Node.js）
• 工程化（前端工程化、Git）
• 性能与优化
• 网络与安全
• 浏览器原理
• SEO 优化
• 软技能

请使用右侧导航栏浏览具体内容。

基础知识

HTML

• 基本结构
• 常用标签
• 表单控件
• 语义化标签
• 媒体标签
• 可访问性

CSS

• 选择器
• 盒模型
• 定位
• 浮动
• Flex 布局
• Grid 布局
• 媒体查询
• 动画
• SASS/SCSS 基础
• 层叠与继承
• BEM 命名规范

JavaScript

• 变量与数据类型
• 运算符与表达式
• 流程控制与函数
• 作用域与闭包
• 原型与继承机制
• 事件机制
• 异步编程
• DOM 与 BOM 操作
• 模块化发展史与标准
• 错误处理机制

框架与工具

Vue

• 模板语法与指令系统
• 响应式系统与 Ref/Reactive
• 组件化开发
• 生命周期钩子
• 路由与动态路由
• 状态管理（Pinia）
• Composition API 与 Setup 语法糖
• Vue DevTools 与调试技巧

Node.js

• 环境搭建与运行机制
• 模块系统
• 文件系统模块
• HTTP 模块与服务器
• NPM 与包管理工具
• Express 构建 API
• 中间件机制

工程化

前端工程化

• 模块化方案与构建工具
• 开发与生产环境配置
• 代码规范与自动化校验
• 持续集成与部署
• 包管理与依赖分析
• Monorepo 工程管理

Git

• 基本操作与命令
• 分支管理与合并策略
• 多人协作与代码审查
• 版本回退与历史查看

性能与优化

性能优化

• 加载优化
• 渲染优化
• 缓存策略
• 前端监控体系
• 关键渲染路径优化
• 代码分割与懒加载

数据结构与算法

• 基本数据结构
• 常见算法
• 算法思维与刷题技巧
• 时间与空间复杂度分析

网络与安全

网络基础与前端安全

• HTTP与HTTPS基础
• 网络底层协议基础
• 跨域与资源安全
• 前端攻击与防御机制
• 用户身份认证机制
• CORS原理与配置详解
• XSS跨站脚本攻击详解

浏览器

浏览器原理

• 浏览器渲染原理
• 事件循环与任务队列机制
• 存储机制对比
• 重排与重绘机制

SEO 优化

SEO完整教程

• SEO 教程概览
• SEO 基础知识
• 关键词研究
• 站内优化
• 技术SEO
• 站外优化
• 数据分析与SEO工具
• 高级策略与SEO趋势
• 实战项目与案例分析

软技能

前端工程师软技能系列

• 前端工程师的软技能基石
• 软技能实战指南：从入职到独当一面
• 让你脱颖而出的职场加分项
• 成为团队核心的秘密
• 写在最后：技术与软技能的平衡

注：本文档会持续更新，欢迎关注！