React-CodeVortex: 强大的后台管理系统

Nodejs版本：18.14.0 包管理器：yarn（1.22.19）

React-CodeVortex 是一个基于 React、Vite、TypeScript、react-router-dom、mobx、ant design、axios 和 sass 技术构建的现代化后台管理系统。它还集成了 CICD 实现了自动化部署，并且使用了 nodejs 版本 18.14.0 和 yarn 版本 1.22.19。

特性

• 现代化的用户界面：采用 Ant Design 设计风格，提供简洁、美观的用户界面🎨，提升用户体验。
• 强大的路由功能：使用 react-router-dom 实现动态路由，轻松管理多个页面和视图。
• 状态管理：借助 MobX 进行状态管理，确保数据的一致性和可靠性。
• 数据请求：通过 Axios 进行 API 调用，与后端数据进行无缝交互📡。
• 样式定制：使用 Sass 进行样式定制，轻松打造独特的外观和风格。
• 类型安全：利用 TypeScript 提供的类型检查和智能提示，提高开发效率和代码质量。
• 代码推送自动检查：使用 husky 自动触发代码检查，确保代码质量和提交规范
• Commitlint 代码提交规范：集成 Commitlint 代码提交规范，确保代码质量和提交规范
• 自定义 Commitlint 代码提交规范：集成自定义 Commitlint 代码提交规范，确保代码质量和提交规范 使用命令一键生成 commit 规范文本
• 自动化部署：集成 CICD 流程，实现自动化构建、测试和部署，节省时间和精力。

技术栈

• React：用于构建用户界面的流行前端框架。
• Vite：一种快速、高效的前端构建工具。
• TypeScript：强大的静态类型检查工具，增强代码的可维护性和可读性。
• react-router-dom：用于管理前端路由。
• mobx：简单、可扩展的状态管理库。
• ant design：基于 React 的企业级 UI 设计库。
• axios：用于发送 HTTP 请求的实用工具库。
• sass：强大的 CSS 扩展语言。

使用方法

1. 克隆项目到本地。
2. 安装依赖：在项目目录中运行 npm install 或 yarn install。
3. 启动开发服务器：运行 npm run dev 或 yarn dev，在浏览器中访问指定的 URL。
4. 构建生产环境：使用 npm run build 或 yarn build 生成优化后的生产版本。
5. yarn commit ：生成 commit 内容

项目结构

├── src
│   ├── components  // 组件目录
│   ├── pages       // 页面目录
│   ├── config      // 页面配置目录
│   ├── hooks       // Hooks 目录
│   ├── router      // 路由目录
│   ├── styles      // 样式目录
│   ├── types       // 类型定义目录
│   ├── store       // MobX 状态存储目录
│   ├── utils       // 实用工具目录
│   ├── App.tsx     // 应用入口文件
│   └── index.tsx   // 路由入口文件
├── public          // 静态资源目录
├── README.md
├── package.json
└── tsconfig.json   // TypeScript 配置文件

贡献

如果你有兴趣贡献代码或发现了问题，请随时提交 Pull Request。我们欢迎各种贡献，包括新功能、修复 Bug、文档改进等。

🎉感谢你的关注和支持！如果你有任何问题或建议，请随时联系我们。

项目链接