Follow the React Router getting started guide to create a new React Router application:
Choose packages that you will use in your application:
Hooks for state and UI management
Core components library: inputs, buttons, overlays, etc.
Form management library
Date inputs, calendars
Recharts based charts library
Notifications system
Code highlight with your theme colors and styles
Rich text editor based on Tiptap
Capture files with drag and drop
Embla based carousel component
Full-screen media lightbox with carousel navigation
Overlay command center
Centralized modals manager
Install dependencies:
Install PostCSS plugins and postcss-preset-mantine :
Create a postcss.config.cjs file at the root of your application with the following content:
Add styles imports, MantineProvider and ColorSchemeScript to app/root.tsx . Mantine styles must be imported before any other styles in your application (including app/app.css from the React Router template):
All set! Start the development server: