57 lines
1.1 KiB
Markdown
57 lines
1.1 KiB
Markdown
# React & Frontend Development Skill
|
|
|
|
## Installed
|
|
- Node.js 20.x
|
|
- npm 10.x
|
|
|
|
## Quick Start
|
|
```bash
|
|
# Create React app
|
|
npx create-react-app myapp
|
|
cd myapp && npm start
|
|
|
|
# With Vite (faster)
|
|
npm create vite@latest myapp -- --template react
|
|
cd myapp && npm install && npm run dev
|
|
```
|
|
|
|
## Common Commands
|
|
```bash
|
|
npm run dev # Development server
|
|
npm run build # Production build
|
|
npm run preview # Preview production build
|
|
npm install package # Install dependency
|
|
```
|
|
|
|
## Key Libraries
|
|
```bash
|
|
# UI
|
|
npm install @mui/material @emotion/react @emotion/styled # Material UI
|
|
npm install tailwindcss postcss autoprefixer # Tailwind CSS
|
|
npm install shadcn-ui # shadcn/ui
|
|
|
|
# State
|
|
npm install zustand # State management
|
|
npm install @reduxjs/toolkit react-redux # Redux
|
|
|
|
# Routing
|
|
npm install react-router-dom
|
|
|
|
# HTTP
|
|
npm install axios
|
|
|
|
# Forms
|
|
npm install react-hook-form
|
|
```
|
|
|
|
## Docker for React
|
|
```dockerfile
|
|
FROM node:20-alpine
|
|
WORKDIR /app
|
|
COPY package*.json ./
|
|
RUN npm ci
|
|
COPY . .
|
|
EXPOSE 3000
|
|
CMD ["npm", "start"]
|
|
```
|