Why Set Up a React Project?
React needs a build tool to manage dependencies, compile JSX, and optimize performance. The two most popular ways to set up a React project are:
- Create React App (CRA) – Official but slower and its now Sunset
- Vite – Faster, modern alternative
Setting Up React with Vite
Vite is a modern build tool that offers:
- Faster development server.
- Better performance with ES modules.
- Optimized production build.
Steps to Create a React App with Vite
1. Open Terminal & Run:
npm create vite@latest my-app --template react
or using Yarn:
yarn create vite@latest my-app --template react
or using pnpm:
pnpm create vite@latest my-app --template react
2. Navigate to the project folder:
cd my-app
3. Install dependencies:
npm install
4. Start the development server:
npm run dev
Vite For
| Feature | Vite 🚀 | CRA 🐢 |
|---|---|---|
| Startup Speed | ⚡ Instant | 🐌 Slow |
| Build Speed | 🔥 Fast | 🚶♂️ Moderate |
| Uses Webpack? | ❌ No (ES Modules) | ✅ Yes |
| Production Build | ✅ Optimized | ⚠️ Heavier |
| Plugins Support | ✅ Excellent (Rollup-based) | ✅ Good (Webpack-based) |
Top comments (1)
Great post Vite really shines when it comes to development speed and overall developer experience.
I’ve also been working with Vite and recently put together a Vite + Ant Design v6 dashboard starter template to help speed up initial setup. It comes with routing, environment configuration, layout structure, menus/sidebars, and responsive behavior preconfigured.
If anyone is interested in a quick starting point for building dashboards, I’m happy to share it here: Link
Some comments have been hidden by the post's author - find out more