目录
前端领域广阔且发展迅速，建议选择一个主攻方向（如React/Vue）深入
提醒：单学前端还是不行的，最好是学全栈
1. 基础三件套
1.1 HTML
语义化标签（<header>, <section>, <article>等）
表单元素和属性
SEO基础优化
无障碍访问（ARIA）
1.2 CSS
盒模型（标准/怪异模式）
选择器优先级和权重计算
布局技术（Flexbox/Grid/浮动/定位）
响应式设计（媒体查询/视口单位）
CSS变量（Custom Properties）
动画（transition/animation）
预处理器（Sass/Less）
1.3 JavaScript
ES6+特性（let/const、箭头函数、解构等）
异步编程（Promise/async-await）
DOM操作和事件机制
原型和原型链
闭包和作用域
模块化（ES Module/CommonJS）
2. 前端框架
2.1 React
组件生命周期（类组件）和Hooks（函数组件）
状态管理（useState/useReducer/Context）
虚拟DOM和Diff算法
路由（React Router）
状态管理库（Redux/MobX/Recoil）
服务端渲染（Next.js）
2.2 Vue
响应式原理（Object.defineProperty/Proxy）
组件通信（props/$emit/vuex/pinia）
指令系统（v-model/v-for等）
组合式API（Composition API）
Vue Router和Vuex/Pinia
Nuxt.js（SSR框架）
2.3 Angular
模块和依赖注入
组件和指令
服务和RxJS
表单（模板驱动/响应式）
NgRx状态管理
变更检测机制
3. 工程化工具
3.1 构建工具
Webpack（配置/loader/plugin）
Vite（基于ESM的快速构建）
Rollup（库打包）
Babel（JavaScript编译）
npm/yarn/pnpm（包管理）
3.2 代码质量
ESLint（代码规范检查）
Prettier（代码格式化）
Stylelint（CSS规范检查）
Husky（Git钩子）
Jest/Vitest（单元测试）
Cypress/Playwright（E2E测试）
4. 网络和安全
4.1 HTTP/HTTPS
请求方法（GET/POST等）
状态码（200/304/404/500等）
缓存机制（强缓存/协商缓存）
跨域解决方案（CORS/JSONP/proxy）
Web安全（XSS/CSRF/SQL注入防护）
4.2 性能优化
资源压缩（Gzip/Brotli）
图片优化（WebP/懒加载）
代码分割（Code Splitting）
预加载/预渲染（preload/prefetch）
虚拟列表（大数据渲染优化）
Web Workers（离线程计算）
5. 前沿技术
5.1 TypeScript
类型系统（接口/泛型/联合类型）
类型推断和类型守卫
装饰器（Decorators）
与React/Vue集成
5.2 WebAssembly
高性能计算应用
与JavaScript互操作
5.3 微前端
单SPA
Qiankun
Module Federation
5.4 可视化
Canvas/SVG
D3.js
ECharts/Highcharts
Three.js（3D图形）
6. 移动端开发
6.1 响应式开发
移动优先设计
1px边框问题
高清屏适配（retina）
移动端事件（touch/swipe）
6.2 混合开发
React Native
Flutter
小程序开发（微信/支付宝）
PWA（渐进式Web应用）
7. 其他重要技能
7.1 设计协作
UI设计工具（Figma/Sketch/PS）
设计系统（Storybook）
像素还原技巧
7.2 版本控制
Git工作流（Feature/Branch/Git Flow）
常用命令（commit/rebase/merge）
GitHub/GitLab协作
7.3 软技能
需求分析能力
与后端/产品/设计的沟通协作
技术文档编写
持续学习能力
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
