Skip to content

karpolan/react-mui-vite-ts

Repository files navigation

Starter project for Vite with React + MUI using TypeScript

Mix of npm create vite and MUI with set of reusable components and utilities to build professional React application faster.

Includes:

  • Prettier for code formatting
  • Eslint for error checking
  • Vitest (or Jest) with Testing Library for testing components and hooks
  • Set of common components, useful hooks, and essential utilities
  • State management using Context API
  • Different and customized Public and Private layouts
  • Basic authentication hooks and events
  • Dark and Light mode with a toggle
  • FavIcon and Manifest for PWA

How to use

  1. Clone or download the repo from: https://github.com/karpolan/react-mui-vite-ts
  2. Copy .env.example file into .env file
  3. Replace _TITLE_ and _DESCRIPTION_ in all files with own texts
  4. Check and resolve all // TODO: directives
  5. Add your own code :)

Available Scripts

In the project directory, you can run:

npm run dev

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

npm run lint

Checks the code for errors and missing things

npm run format

Formats the code according to ./prettier.config.mjs config

npm test

Launches the test runner in the interactive watch mode.

npm run build

Builds the app for production or local development to the dist folder.