ReactRover aims to ease the initiation phase of any React project, presenting one of many possible solutions to streamline the process. It brings together a selection of tools and libraries—like Vite, Bun, MUI, and Tanstack—that have proven useful in reducing setup times and complexity. This toolkit is offered as a starting point, a way to quickly transition from concept to development, allowing you to focus more on creating and less on configuring.
ReactRover incorporates a carefully curated set of tools and libraries essential for modern React development. Below are the key components included in the toolkit, along with links to their official documentation:
- Vite: A modern frontend build tool that significantly improves the development experience with faster rebuilds and a lot of out-of-the-box features.
- Bun: A fast all-in-one JavaScript runtime that includes a package manager and bundler.
- MUI (Material-UI): MUI offers a comprehensive suite of free UI tools to help you ship new features faster. Start with Material UI, our fully-loaded component library, or bring your own design system to our production-ready components.
- Tanstack React Router: A flexible and lightweight routing library for React.
- Tanstack Query: A powerful data fetching and server state management tool in React applications.
- Formik: A small library that helps you with the 3 most annoying parts: getting values in and out of form state, validation and error messages, handling form submission.
- i18next: An internationalization-framework written in and for JavaScript.
- React Toastify: Allows you to add notifications to your app with ease.
- Zod: TypeScript-first schema validation with static type inference.
- Axios: Promise based HTTP client for the browser and node.js.
- Axios Auth Refresh: A small library that intercepts failed requests and retries them after refreshing an auth token.
Additionally, ReactRover supports built-in theme toggling for dark and light modes, as well as language switching capabilities, enhancing usability and customization for a diverse user base.
Before installing ReactRover, ensure that your system meets the following requirements:
- Node.js: You'll need Node.js version 16 or newer installed on your system.
- Bun: Bun is crucial for some of ReactRover's build processes. Ensure it is installed on your system.
- HTTPS Local Development: For integration with the Mock Server, setting up HTTPS for local development is recommended. Tools like mkcert can assist in managing local certificates
git clone https://github.com/behcetilhan/reactrover.git reactrover
cd reactrover
bun installCreate .env file in root directory with VITE_BACKEND_ENDPOINT defined. For Testing Server, you can use the port defined in .env.dist.
bun run devFor an optimal testing experience with ReactRover, you can use this simple mock server. This server is specifically designed to complement ReactRover by providing a minimalistic backend environment for authentication and authorization. By using this server, you can effectively test secure login flows, token refresh mechanisms, and access controls as implemented in ReactRover.
Key features include:
- JWT-based authentication and HttpOnly cookie management.
- Secure refresh token implementation for maintaining sessions.
- HTTPS and HTTP configurations.
- Pre-configured protected routes to simulate access control.
For detailed setup instructions and how to integrate this server with ReactRover, please visit the Testing Server.
If you are planning to use the test server with HTTP, don't forget to update the VITE_BACKEND_ENDPOINT in .env file
- vitest implementation
- SSO integration
- RTL support
- Tanstack Table integration
- React Charts integration
- React Select integration
- Basic mui grid,container and drawer examples
- Support for Tailwind
- Configuration support for customizable boilerplate, like enabling/disabling third party packages as i18Next or Axios