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 小时前
2024年最新版Vue3学习笔记
前端·vue.js·笔记·学习·vue
Jiaberrr1 小时前
JS实现树形结构数据中特定节点及其子节点显示属性设置的技巧(可用于树形节点过滤筛选)
前端·javascript·tree·树形·过滤筛选
赵啸林1 小时前
npm发布插件超级简单版
前端·npm·node.js
罔闻_spider2 小时前
爬虫----webpack
前端·爬虫·webpack
吱吱鼠叔2 小时前
MATLAB数据文件读写:1.格式化读写文件
前端·数据库·matlab
爱喝水的小鼠2 小时前
Vue3(一) Vite创建Vue3工程,选项式API与组合式API;setup的使用;Vue中的响应式ref,reactive
前端·javascript·vue.js
盏灯2 小时前
前端开发,场景题:讲一下如何实现 ✍电子签名、🎨你画我猜?
前端
WeiShuai2 小时前
vue-cli3使用DllPlugin优化webpack打包性能
前端·javascript
Wandra2 小时前
很全但是超级易懂的border-radius讲解,让你快速回忆和上手
前端
ice___Cpu2 小时前
Linux 基本使用和 web 程序部署 ( 8000 字 Linux 入门 )
linux·运维·前端