搭建环境的时候,我们必须要先确保环境有node环境和npm环境,如下使用cmd命令

确保自己有了这两个环境之后我们就可以开始搭建项目,首先找一个文件夹,这个文件夹用来初始化当前环境,例如,我这里选择的是E盘的learn-react目录下:依次敲击一下命令:

选择的时候选择React和TypeScript,这时候就可以去文件夹中使用vscode打开项目,发现有初始项目只有2个依赖:

我们需要添加依赖:

    "react-redux": "8.0.5",
"react-router-dom": "6.4.4",
"redux": "^4.2.0"

然后使用npm i命令,进行下载依赖

下载完毕之后,就可以使用npm run dev来启动项目

点击即可访问主页,我这里展示如下:

可以看到,主页展示成功。

我们这里还可以在启动的时候加上条件参数例如 --host  :这个参数就是来展示我们的本地地址和网络访问的地址;   --port 端口号  =>这个使用来指定启动的时候的端口号

React后台管理系统(TypeScript、Redux状态管理)环境搭建01的更多相关文章

  1. 微信小程序里使用 Redux 状态管理

    微信小程序里使用 Redux 状态管理 前言 前阵子一直在做小程序开发,采用的是官方给的框架 wepy , 如果还不了解的同学可以去他的官网查阅相关资料学习:不得不说的是,这个框架确相比于传统小程序开 ...

  2. TypeScript完全解读(26课时)_1.TypeScript完全解读-开发环境搭建

    1.TypeScript完全解读-开发环境搭建 初始化项目 手动创建文件夹 D:\MyDemos\tsDemo\client-demo 用VSCode打开 npm init:初始化项目 然后我们的项目 ...

  3. react+redux状态管理实现排序 合并多个reducer文件

    这个demo只有一个reducer 所以合并reducer这个demo用不到 ,但是我写出来这样大家以后可以用到,很好用,管理多个reducer,因为只要用到redux就不会只有一个reducer所以 ...

  4. react之redux状态管理

    1.传统MVC框架的缺陷 模型(model)-视图(view)-控制器(controller)的缩写 V即View视图:用户看到并与之交互的界面. M即Model模型是管理数据:很多业务逻辑都在模型中 ...

  5. 《React后台管理系统实战 :一》:目录结构、引入antd、引入路由、写login页面、使用antd的form登录组件、form前台验证、高阶函数/组件

    实战 上接,笔记:https://blog.csdn.net/u010132177/article/details/104150177 https://gitee.com/pasaulis/react ...

  6. 《React后台管理系统实战 零》:基础笔记

    day01 1. 项目开发准备 1). 描述项目 2). 技术选型 3). API接口/接口文档/测试接口 2. 启动项目开发 1). 使用react脚手架创建项目 2). 开发环境运行: npm s ...

  7. react后台管理系统路由方案及react-router原理解析

        最近做了一个后台管理系统主体框架是基于React进行开发的,因此系统的路由管理,选用了react-router(4.3.1)插件进行路由页面的管理配置. 实现原理剖析 1.hash的方式   ...

  8. Redux状态管理方法与实例

    状态管理是目前构建单页应用中不可或缺的一环,也是值得花时间学习的知识点.React官方推荐我们使用Redux来管理我们的React应用,同时也提供了Redux的文档来供我们学习,中文版地址为http: ...

  9. React项目中使用Mobx状态管理(二)

    并上一节使用的是普通的数据状态管理,不过官方推荐使用装饰器模式,而在默认的react项目中是不支持装饰器的,需要手动启用. 官方参考 一.添加配置 官方提供了四种方法, 方法一.使用TypeScrip ...

  10. 【共享单车】—— React后台管理系统开发手记:主页面架构设计

    前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. ...

随机推荐

  1. pandas之loc/iloc操作

    在数据分析过程中,很多时候需要从数据表中提取出相应的数据,而这么做的前提是需要先"索引"出这一部分数据.虽然通过 Python 提供的索引操作符"[]"和属性操 ...

  2. pandas之设置显示格式

    在用 Pandas 做数据分析的过程中,总需要打印数据分析的结果,如果数据体量较大就会存在输出内容不全(部分内容省略)或者换行错误等问题.Pandas 为了解决上述问题,允许你对数据显示格式进行设置. ...

  3. 新手小白需要了解的 Go 基础细节杂谈

    今日记录一下 学习 golang 这门语言遇到的一些比较特殊的细节,供大家参考. 所以,在我们输出内容的时候,可以包含很多的非 ASCII 码字符.实际上,Go 是天生支持 UTF-8 的,任何字符都 ...

  4. kali装机 安装输入法 修改国内源

    1-先配置国内源官方kali源 vim /etc/apt/sources.list 插入如下源 deb http://mirrors.aliyun.com/kali sana main non-fre ...

  5. Kubernetes学习之旅

    # Kubernetes学习之旅 ## 引言 - 为什么选择Kubernetes- Kubernetes简介- Kubernetes的发展历程 ## Kubernetes基本概念 - 节点(Node) ...

  6. Vulnhub Joy Walkthrough

    Recon 这台靶机对枚举的要求较高,如果枚举不出有用的信息可能无法进一步展开,我们首先进行普通的扫描. ┌──(kali㉿kali)-[~/Labs/Joy/80] └─$ sudo nmap -s ...

  7. express获取登录服务器的IP地址

    let ip = (req.headers['x-real-ip'] || req.connection.remoteAddress).slice(7);      

  8. 特性介绍 | MySQL 测试框架 MTR 系列教程(一):入门篇

    作者:卢文双 资深数据库内核研发 去年年底通过微信公众号[数据库内核]设定了一个目标--2023 年要写一系列 特性介绍+内核解析 的文章(现阶段还是以 MySQL 为主). 虽然关注者很少,但本着& ...

  9. Go语言:两种常见的并发模型

    Go语言:两种常见的并发模型 在并发编程中,须要精确地控制对共享资源的访问,Go语言将共享的值通过通道传递 并发版"Hello World" 使用goroutine来打印" ...

  10. Tars-Cpp 协程实现分析

    作者:vivo 互联网服务器团队- Ye Feng 本文介绍了协程的概念,并讨论了 Tars Cpp 协程的实现原理和源码分析. 一.前言 Tars 是 Linux 基金会的开源项目(https:// ...