React Admin Vite

Overview:

This is a simple template of a react-based backend administration system. It is built using the vite framework and utilizes React 18, functional components, and hooks. The project showcases various features including a UI framework (React Hooks) and routing (React Router v6). It also incorporates global state management (MobX MobX-React-Lite) and a powerful CSS tool (Tailwind CSS). The theme of the system is customizable with support for both light and dark styles, as well as different color themes. It also provides internationalization support with options to switch between English and Chinese languages. The project includes features such as a configuration-based router, route authentication, Axios integration for HTTP requests, token persistence, and modularized state management with MobX.

Features:

• React Hooks: Uses functional components and hooks for implementation.
• Routing (v6): Utilizes React Router v6 for managing routes in a configuration-based manner.
• Global State Management: Implements state management using MobX MobX-React-Lite.
• CSS Tool - Tailwind CSS: Employs Tailwind CSS for powerful CSS styling.
• UI Framework - antd: Integrates with antd for the UI framework.
• Internationalization: Provides support for internationalization with language toggling between Chinese and English.
• Ajax Data Request - Axios: Implements data request handling using Axios.
• Theme Customization: Supports responsive layout for both PC and mobile devices, as well as options for switching between light and dark styles and selecting from eight different color themes.

Installation:

1. Clone the project repository.
2. Navigate to the project directory.
3. Install the project dependencies by running the following command:

   npm install
   

   or

   yarn install
   

4. Start the development server by running the following command:

   npm run dev
   

   or

   yarn dev
   

5. Open your browser and visit http://localhost:3003 to view the application in development mode.

To build the application for production, run the following command:

npm run build

or

yarn build

This will create a build folder with the bundled and optimized production-ready application. The contents of this folder can then be deployed to a production environment.

Summary:

The react-based backend administration system template is a simplified project built using vite and various supporting libraries and tools. It provides a range of features including functional components, routing, global state management, a CSS framework, internationalization support, data request handling, theme customization, and more. The installation process involves cloning the repository, installing dependencies, and starting the development server. The system can also be built for production and deployed to a live environment.