React 后台管理项目 入门项目 简洁清晰保姆级内容讲解

序章

React Hook的后台管理项目,从0到1搭建,内容非常丰富涵盖项目搭建、路由配置、用户鉴权、首页报表、用户列表、前后端联调等功能,推荐指数:5颗星!

视频学习链接: React 通用后台管理-零基础从0到1详细的入门保姆级别教程------哔哩哔哩bilibili


环境配置

node版本:需要 Node.js 版本 18+

编辑器:VScode

技术栈:react react-redux axios dayjs echarts

项目搭建

创建命令

js 复制代码
npx create-react-app my-app // 创建项目
cd my-app
npm start  // 启动项目

生成目录如下

引入antd UI框架

js 复制代码
npm install antd --save

修改 src/App.js,引入 antd 的按钮组件。可以看到效果

js 复制代码
import React from 'react';
import { Button } from 'antd';

const App: React.FC = () => (
  <div className="App">
    <Button type="primary">Button</Button>
  </div>
);
export default App;

引入react-redux @reduxjs/toolkit

js 复制代码
npm i react-redux @reduxjs/toolkit

讲到这里,整个项目搭建过程就完成了,由于篇幅有限,详情的视频教学 推荐视频学习链接:链接: vue3通用后台管理-零基础从0到1详细的入门保姆级别教程------哔哩哔哩bilibili

相关推荐
陈随易1 小时前
在Finch用了62亿词元,我认为这是新一代Agent工具之神
前端·人工智能·后端
水域安全老周2 小时前
水趣钓鱼救生衣专利拆解:两级锁紧如何解决落水人衣分离
java·前端·网络
传奇开心果编程2 小时前
【Xilem基础语法学与练】第7课:Xilem与Masonry底层构建技术解析
学习·rust·前端框架
计算机魔术师2 小时前
Anthropic CEO突然喊踩刹车,OpenAI罕见力挺:AI这辆车不能只踩油门了
前端
wing983 小时前
从codex转战workbuddy使用一周的感受
前端·人工智能·后端
Highcharts.js3 小时前
常见报错排雷指南2:导出失败的官方解法
javascript·react.js·ecmascript·highcharts·可视化图表·导出模块失败·导出服务
EatFan3 小时前
Java接入支付宝 JSAPI 支付保姆教程(二):流程讲解与前后端代码讲解
前端·spring boot·后端·微信小程序·小程序·uni-app
梦想平凡3 小时前
百游棋牌源代码开发搭建教程(五):房间创建、座位分配与请求幂等实现
前端·javascript·数据库·源代码管理
IT_陈寒4 小时前
Redis的Set操作居然能把我的服务整挂了?
前端·人工智能·后端
计算机魔术师4 小时前
Suno 发布 v6 音乐模型,推出 v6、v6-wild、v6-mini 三个版本
前端