前端三剑客基础案例001

前端开发必备技能

很好！我来给你写一个前端开发必备技能清单，清晰系统，适合初学者进阶到实战用。

📌 前端开发必备技能清单（2025版）

🔸 基础三件套

✅ HTML5

• 页面结构、标签语义化
• 表单元素与表单验证
• 音视频标签、Canvas、SVG

✅ CSS3

• 盒模型 / 定位 / 浮动 / Flex 布局 / Grid 布局
• 动画与过渡（transition/animation）
• 媒体查询（响应式设计）
• 常用框架：Bootstrap / Tailwind CSS（推荐）

✅ JavaScript（原生JS）

• 变量、数据类型、函数、对象、数组、字符串操作
• 条件判断、循环、事件监听、DOM操作、表单验证
• 定时器、Promise、异步编程、Fetch/AJAX
• 本地存储（localStorage / sessionStorage / cookie）
• 模块化（ES6 import/export）

🔸 进阶技能

✅ ES6+ 新特性

• let/const、解构赋值、模板字符串
• 箭头函数、Promise、async/await
• 模板字符串、扩展运算符、Map/Set

✅ 前端工程化

• 模块化开发（ESModule / CommonJS）
• 包管理工具（npm / pnpm / yarn）
• 构建工具（Vite / Webpack）

✅ 版本管理

• Git 常用命令（clone、add、commit、push、pull）
• 分支管理 / GitHub / Gitee

✅ 浏览器调试

• Chrome DevTools 使用（Elements / Console / Network / Sources）

🔸 必会前端框架

✅ Vue 3.x（推荐）

• 组件化开发、指令、数据响应式、组合式API（Composition API）
• 路由管理（Vue Router）
• 状态管理（Pinia / Vuex）

✅ 或 React 18+

• JSX、函数式组件、Hooks
• 路由（React Router）
• 状态管理（Redux / Zustand）

🔸 前后端联调技能

✅ API接口调试工具

• Postman / Apifox

✅ 跨域与解决方案（CORS / 代理）

✅ JSON数据结构与接口规范理解

🔸 UI库 & 设计规范

✅ 常用UI组件库

• Element Plus（Vue）
• Ant D