项目简介

尚医通后台管理项目是一个极为全面和完整的React项目,涵盖了前端开发所需的大部分技术和方法。项目采用React18版本,搭配上流行的TypeScript语言,使用了Hook函数组件式开发模式,并且通过使用Redux、Antd、Axios等优秀的第三方库,提高了应用程序的效率、可维护性、可扩展性和用户体验。

项目在实现过程中,对代码进行了高度复用,利用Create-React-App快速搭建了后台管理模板项目,并使用React路由库构建了整体的路由页面结构。同时也充分考虑了国际化、权限校验等问题,有效提升了项目的可配置性和可定制性。此外,项目还采用Echarts对数据进行了可视化展示,进一步提升了应用程序的交互性和用户体验。

综合来看,这个项目是一个非常值得学习和借鉴的优秀案例,从中可以学习到很多前端开发的实践经验和优秀开发方法。

适学人群

  • 前端开发初学者

    了解React、TypeScript、Redux等技术,掌握完整项目开发流程

  • 高校毕业生

    有一定技术基础,希望增长经验、接触更广技术面

  • 已经熟悉React生态圈的开发者

    深入了解新特性、提升开发效率、实践项目管理

  • 要求课程基础

    React

主要技术点

  • 01

    理解并实践完整的项目开发流程,为后面公司的项目开发做准备。

  • 02

    基于React18版本开发,并搭配流行的TypeScript语言。

  • 03

    放弃类组件开发模式,选择更高效的Hook函数组件式开发模式。

  • 04

    使用Create-React-App搭建后台管理的模板项目,实现代码的高度复用。

  • 05

    使用React路由库,搭建项目的整体路由页面结构。

  • 06

    使用Redux + Redux-Thunk + React-Redux + @Reduxjs/Toolkit对组件状态进行集中管理。

  • 07

    使用Antd快速搭建项目界面,并实现按需引入打包。

  • 08

    使用Swagger进行在线接口调试,与后台完美对接。

  • 09

    对Axios请求进行二次封装,高度复用请求编码。

  • 10

    利用国际化相关插件,实现项目的国际化处理。

  • 11

    基于Localstorage与Token相关技术,实现登陆、自动登陆与退出登陆的完整流程。

  • 12

    利用Echarts,对后台相关数据进行数据可视化展现。

  • 13

    利用高阶组件、浏览器本地存储、Token等相关技术实现用户的权限校验。

项目效果展示