FastapiAdmin/README.en.md

Fastapi-Vue-Admin v1.0.0

A rapid development framework for front-end and back-end separation based on Fastapi-Vue-Admin

English | Chinese

📚 Project Introduction

fastapi-vue-admin is a fully open-source rapid development platform that provides free usage. It combines modern, high-performance technology stacks to help developers quickly build high-quality backend systems. The project directory structure is as follows:

fastapi_vue_admin
├─ backend        # Backend project
├─ frontend       # Frontend project
├─ mkdocs         # Documentation project
├─ build          # Deployment project
├─ README.en.md   # English documentation
└─ README.md      # Chinese documentation

• Backend:

  • FastAPI:A modern, high-performance asynchronous framework.
  • Swagger:Automatically generates interactive API documentation.
  • Pydantic:Enforces type constraints.
  • SQLAlchemy 2.0:A powerful ORM library.

• Frontend:

  • Vue3:A modern frontend framework.
  • Ant Design Vue:An enterprise-level UI component library.
  • TypeScript:Static type checking.
  • Vite:A fast build tool.

• Authentication:OAuth2 using hashed passwords and JWT Bearer tokens.

• Authorization Architecture:Designed based on RBAC, supporting dynamic permission menus, button-level permission control, and data-level permission control.

• Ready-to-use:Suitable as a starting template for new projects, also useful for learning and reference.

If you find the project helpful, please give it a star!

🍻 Project Features

• Modular and loosely coupled
• Rich modules, ready-to-use
• Simple and easy to integrate
• Comprehensive documentation, easy to maintain
• Top-down, systematic design
• Unified framework, unified components, reducing selection costs
• Development standards, design patterns, code layering models
• Powerful and convenient development toolchain
• Complete local internationalization support
• Designed for team and enterprise use

📌 Built-in Modules

• Dashboard

  • Workbench:Dashboard display, entry point for common features.
  • Analytics:Displays various statistical information to help users understand system performance.

• System Management

  • Menu Management:Configures system menus, operation permissions, and button permission identifiers.
  • Department Management:Configures the organizational structure of the system, supports data permissions in tree structures.
  • Position Management:Manages user positions.
  • Role Management:Manages role menus and permission allocation, sets menu permissions for roles.
  • User Management:Maintains and manages system users, including regular information maintenance and account settings.
  • Log Management:Uniformly maintains commonly used and relatively fixed data in the system.
  • API Management:Maintains the system's configuration information, uniformly manages website configuration management functions.
  • Common Management:Maintains the release and management of system notifications and announcements.

• Monitoring Management

  • Online Users:Views currently online users in the system.
  • Server Monitoring:Views the system's runtime status, including memory, CPU, disk, etc.
  • Cache Monitoring:Views system cache information, such as cache hit rate and cache keys.

• Common Management

  • API Management:Maintains system APIs, such as API addresses and request methods.
  • Documentation Management:Maintains system API documentation, supports online API calls.
  • File Management:Configures file uploads, currently supports local storage, and can obtain storage addresses based on specific configurations.

🍪 Account Information

Account Type	Username	Password
Admin Account	admin	123456
Demo Account	demo	123456

👷 Installation and Usage

Version Information

Type	Technology Stack	Version
Backend	Python	3.10
Backend	FastAPI	0.109
Frontend	Node.js	>= 20.0（Recommended latest version）
Frontend	npm	16.14
Frontend	Vue3	3.3
Database	MySQL	8.0 Recommended latest version
Database	PostgreSQL	14（Recommended latest version）
Database	MongoDB	8.0（Recommended latest version）
Middleware	Redis	7.0 Recommended latest version

Get the Code

git clone https://gitee.com/tao__tao/fastapi_vue_admin.git

Backend

1. Install dependencies

   cd backend
   pip3 install -r requirements.txt
   
   When running pip install, I encountered the following error: UnicodeDecodeError: 'gbk' codec can't decode byte 0xad in position.
   Solution Link：https://www.cnblogs.com/RexTooru/p/17303318.html
   

2. Modify project database configuration In the app/core/config.py file, modify SQLALCHEMY_DATABASE_URI、MONGO_DB_URL and REDIS_URL

3. Create a database named fastapi_vue_admin

4. Initialize database data

   # Run in the root directory of the backend project (backend)
   # This command will automatically generate tables and data in the database
   # If the database has already been initialized, this command can be skipped
   python3 main.py init
   

5. Start the backend

   # Run in the root directory of the backend project (backend)
   python3 main.py run
   

Frontend

1. Install dependencies

   cd frontend
   npm install
   

2. Run the frontend

   npm run dev
   

3. Build the frontend

   npm run build
   

Access the Project

• Frontend URL: http://127.0.0.1:5180
• Username: admin Password: 123456
• API URL: http://127.0.0.1:8000/api/v1/docs

🔧 Module Showcase

Login

Workbench

Analytics

Menu

Department

Position

Role

User

Log

Online

Server

Cache

API

Documentation

File

Personal

Help

✨ Special Thanks

Thank you to the following projects for their contributions and support, which have made this project possible:

• FastAPI Project
• Vue3 Project
• KInit Project
• FastAPI-Vue-Admin Project
• Vue-FastAPI-Admin Project
• RuoYi-Vue3-FastAPI Project

🎨 WeChat Group

The QR codes below are personal codes that can be used for technical discussions and to discuss various issues encountered during project usage. I sincerely hope everyone can optimize the project together and actively participate in discussions to support each other!！

Personal QR Codes