https://github.com/d3george/slash-admin

A Modern React Admin Template. It is based on React 19, Vite and TypeScript. It's fast !
https://github.com/d3george/slash-admin

admin admin-dashboard admin-panel admin-template ant-design antd framer-motion react react-admin react-admin-dashboard react-admin-kit react-admin-template react-markdown react-query react-router-v6 styled-components tailwindcss ts vite zustand

Last synced: 6 months ago
JSON representation

A Modern React Admin Template. It is based on React 19, Vite and TypeScript. It's fast !

• Host: GitHub
• URL: https://github.com/d3george/slash-admin
• Owner: d3george
• License: mit
• Created: 2023-08-31T08:38:22.000Z (about 2 years ago)
• Default Branch: main
• Last Pushed: 2025-05-07T12:46:27.000Z (6 months ago)
• Last Synced: 2025-05-07T13:46:28.563Z (6 months ago)
• Topics: admin, admin-dashboard, admin-panel, admin-template, ant-design, antd, framer-motion, react, react-admin, react-admin-dashboard, react-admin-kit, react-admin-template, react-markdown, react-query, react-router-v6, styled-components, tailwindcss, ts, vite, zustand
• Language: TypeScript
• Homepage: https://admin.slashspaces.com/
• Size: 7.26 MB
• Stars: 2,350
• Watchers: 20
• Forks: 409
• Open Issues: 7
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• StarryDivineSky - d3george/slash-admin - admin是一个现代化的React后台管理模板项目，采用React 19框架结合Vite构建工具和TypeScript语言开发，专注于提供高效、可扩展的管理界面解决方案。项目以快速启动和高性能著称，通过Vite的即时热更新和优化打包流程显著提升开发效率，同时TypeScript的强类型特性增强了代码的可维护性和稳定性。其核心特色包括模块化设计，允许开发者灵活定制界面组件和功能模块；响应式布局适配不同设备，确保用户体验一致性；内置主题切换功能，支持多种视觉风格配置；丰富的UI组件库覆盖常用管理界面元素，如表格、表单、图表等。项目采用组件化架构，通过可复用的UI组件和业务逻辑模块降低开发复杂度，同时提供清晰的文档和示例帮助快速上手。开发者可通过npm安装依赖并基于项目结构进行二次开发，支持自定义路由、权限系统和数据接口。此外，项目强调可扩展性，允许集成第三方库或自定义功能，适用于需要快速搭建后台管理系统的企业级应用。整体设计注重代码规范和可读性，符合现代前端开发的最佳实践，是构建企业级React管理界面的理想选择。 (前端开发框架及项目 / 管理面板)
• awesome-react - Slash Admin - A Modern React Admin Template. It is based on React 18, Vite and TypeScript. It's fast !.. (Uncategorized / Uncategorized)

README

          
 


 






 Slash Admin 

  


    



      Slash Admin is a modern admin dashboard template built with React 19, Vite, shadcn/ui, and TypeScript. It is designed to help developers quickly create powerful admin management systems.

    

    


    


    Preview

    ·

    Discord

    ·

    Document

    


    


    



**English** | [中文](./README.zh-CN.md)

##  Sponsor

 

  

  



## Preview

+ https://admin.slashspaces.com/

|![login.png](https://d3george.github.io/github-static/slash-admin/login.png)|![login_dark.png](https://d3george.github.io/github-static/slash-admin/login_dark.png)

| ----------------------------------------------------------------- | ------------------------------------------------------------------- |

|![analysis.png](https://d3george.github.io/github-static/slash-admin/analysis.png)|![workbench.png](https://d3george.github.io/github-static/slash-admin/workbench.png)

| | 

|![analysis.png](https://d3george.github.io/github-static/slash-admin/mobile.png)|![workbench.png](https://d3george.github.io/github-static/slash-admin/mobile_dark.png)

## Features

- Built using React 19 hooks.

- Powered by Vite for rapid development and hot module replacement.

- Integrates shadcn/ui, providing a rich set of UI components and design patterns.

- Written in TypeScript, offering type safety and an improved development experience.

- Responsive design, adapting to various screen sizes and devices.

- Flexible routing configuration, supporting nested routes.

- Integrated access control based on user roles.

- Supports internationalization for easy language switching.

- Includes common admin features like user management, role management, and permission management.

- Customizable themes and styles to meet your branding needs.

- Mocking solution based on MSW and Faker.js.

- State management using Zustand.

- Data fetching using React-Query.

## Quick Start

### Get the Project Code

```bash

git clone https://github.com/d3george/slash-admin.git

```

### Install Dependencies

In the project's root directory, run the following command to install project dependencies:

```bash

pnpm install

```

### Start the Development Server

Run the following command to start the development server:

```bash

pnpm dev

```

Visit [http://localhost:3001](http://localhost:3001) to view your application.

### Build for Production

Run the following command to build the production version:

```bash

pnpm build

```

## Git Contribution submission specification

- `feat` new features

- `fix`  fix the

- `docs` documentation or comments

- `style` code format (changes that do not affect code execution)

- `refactor` refactor

- `perf` performance optimization

- `revert` revert commit

- `test` test related

- `chore` changes in the construction process or auxiliary tools

- `ci` modify CI configuration and scripts

- `types` type definition file changes

- `wip` in development