Simple Vite React Express

Simple Vite React Express is a full-stack JavaScript boilerplate that bundles Vite 6, React 19, Express 5, and PostgreSQL via Prisma into a single runnable template with working CRUD examples.

What is Simple Vite React Express?

Simple Vite React Express is a boilerplate for building web applications on a JavaScript stack: Vite 6 handles frontend tooling, React 19 renders the UI, Express 5 serves the API, and PostgreSQL persists data through Prisma 7. The repository includes a demo CRM that lets you manage contacts, tasks, and projects with full create, read, update, and delete operations, plus form handling and database relationships. It is developed by Avinava, released under the MIT License, and credits Antigravity in the README footer.

Key Features

• Working demo CRM — Includes contact, task, and project pages with server routes under /api/v1/, covering list, get by ID, create, update, and delete operations for each resource.
• Frontend stack — Vite 6 with hot module replacement, React 19, Material-UI 6 theming, React Router 7 for routing, Formik and Yup for forms, and Axios with interceptors for HTTP requests.
• Backend stack — Express 5 routes, Prisma 7 ORM with the adapter pattern, Celebrate and Joi for input validation, Helmet for security headers, and rate limiting middleware.
• Database tooling — Prisma schema in prisma/schema.prisma, migration history, a seed script, and npm run db:studio to open the Prisma Studio GUI.
• Setup automation — npm run setup runs an interactive configuration; npm run dev starts the client and server concurrently, and the app opens at http://localhost:3000.
• Testing and code quality — Vitest and React Testing Library for tests, ESLint 9 with flat config, Prettier formatting, and coverage reports via npm run test:coverage.
• Production workflow — npm run build creates a production bundle, npm start runs it, and npm run preview previews the build before deploy.
• Customization roadmap — The README includes a table mapping demo files to replace, such as prisma/schema.prisma, src/server/routes/v1/, src/server/services/, src/client/pages/, and src/client/hooks/, plus steps for updating the project name, logo, HTML title, and Material-UI theme.

Who should use Simple Vite React Express?

Developers who want a working full-stack JavaScript scaffold rather than a set of blank directories will find this template useful. It suits those who need a demo CRM as a starting point for launching a product or internal tool quickly.

• Full-stack JavaScript developers — get a React and Express app with Prisma and PostgreSQL already wired together, instead of configuring the toolchain from scratch.
• Hackathon participants — clone the repo, run npm install, npm run setup, and npm run dev to have a working CRUD app with a database within minutes.
• Freelance developers — build client portals or internal tools by replacing the demo models and restyling the Material-UI theme to match the client's brand.
• Developers learning Prisma — study real schema relationships, migrations, and a seed file inside a small, readable codebase with both frontend and backend tests.

Use cases

• SaaS founders: prototype a product around contacts, tasks, and projects, using the existing API routes and database relationships to validate features before writing production code.
• Teams building internal dashboards: use the admin-style pages, service layer, and hooks as a foundation, then swap in their own domain models and pages.
• Students and learners: explore a production-grade file structure with separate src/client and src/server folders, route definitions, service layers, and test suites.

How does it work?

Clone the repository with git or npx degit Avinava/simple-vite-react-express my-project, install dependencies, run the interactive npm run setup, then start the client and server with npm run dev. The database workflow uses npm run db:setup to run migrations and generate the Prisma client, npm run db:seed to load sample data, and npm run db:studio to inspect data through Prisma Studio.

FAQ

Is Simple Vite React Express free?

Yes, the repository is released under the MIT License, so you can use it in commercial projects without paying a license fee.

Does the template include a TypeScript version?

The README points to a successor repository named agentic-react-express-ts that ports the same stack to TypeScript end-to-end, adds tRPC, and pre-wires guardrails including Lefthook, ESLint, Knip, Vitest, and Gitleaks.

What database does it require?

It requires PostgreSQL. The setup and troubleshooting sections assume PostgreSQL is running locally, and npm run db:setup creates the database schema and regenerates the Prisma client.

How do I remove the demo code?

The README provides a customization table listing where to replace the database schema, API routes, business logic, pages, hooks, and API service layer, along with steps for updating the project name, logo, and HTML title.

Which package versions are used?

The README lists Vite 6, React 19, Material-UI 6, React Router 7, Express 5, and Prisma 7 in its dependency badges and architecture section.