临沂建设局网站农民工保证金公司网站模板设计
概览
环境搭建
核心概念
TodoList 实战
部署上线
一、快速搭建 React 开发环境
1. 选型：Vite 或 Create React App
- Vite：轻量、热更新速度快、可定制度高，适合追求更高效率的开发者。
- Create React App (CRA)：社区支持全面，文档丰富，适合初学者上手。
我使用的是Vite
提示
2. Node.js & 包管理器
- 推荐 Node.js 16+ / 18+。
- 包管理器可选 npm / yarn / pnpm，选一个自己熟悉就好。
3. VS Code 常见插件
- ESLint + Prettier：统一代码风格，避免低级错误；
- React/Redux Snippets：快速生成组件模板，节省重复输入；
- GitLens：查看 commit 历史、分支对比等，提升协作效率。
二、React 基础：JSX、组件化、单向数据流
1. JSX 与组件
- JSX 让我们在 JavaScript 中使用类似 HTML 的语法，实际是语法糖；
- 函数组件 (Function Component) 更简洁，配合 Hooks 完成状态管理；
- 拆分组件时，遵循单一职责原则，不要让一个组件承担过多逻辑。
2. props 与 state
- props：从父组件传递的只读数据，用于展示或传递回调函数；
- state：组件内部可变数据，通过 useState / useReducer 等 Hooks 管理。
3. 单向数据流
- 父组件掌握数据，子组件通过 props 获取；子组件中触发事件