初识react（1）——使用脚手架创建项目

最新推荐文章于 2023-11-14 09:57:28 发布
最新推荐文章于 2023-11-14 09:57:28 发布
阅读量264 收藏
点赞数 3
分类专栏： # React 文章标签： react脚手架
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43652492/article/details/104944194
版权

  最近在学react，看了些基本知识的视频，奈何下手做项目时多遇坎坷，故记录这一路的学习。

全局下载create-react-app

npm install -g create-react-app

创建项目

create-react-app 项目名
例如：create-react-app demo

在这里插入图片描述

下载成功后打开项目，项目目录如下：
在这里插入图片描述
启动项目

cd 项目名 //进入到项目

npm start //启动项目

如图所示：
在这里插入图片描述
启动后浏览器显现项目页面
在这里插入图片描述

这样一个react脚手架就搭建好了

小R.
关注
专栏目录
React学习一（初识React）
qq_44872688的博客
03-12 1519
文章目录前言一、React 基础知识1、什么是React2、Virtual DOM3、函数式编程4、JSX 语法（1）概念（2）JSX 基本语法①XML 基本语法②元素类型③元素属性④JavaScript 属性表达式⑤表达式二、React开发环境的搭建1、基本应用(传统应用)2、脚手架开发三、React组件1、React组件的构建2、React 组件的构建方法（1）React.createClass（2）ES6 classes（3）无状态函数四、React的渲染机制五、React优势 前言 参考资料：《深
适合 JS 新手学习的开源项目——在 GitHub 学编程
热门推荐
HelloGitHub 的博客
12-04 2万+
作者：HelloGitHub-小鱼干 这里是 HelloGitHub 的《GitHub 上适合新手的开源项目》系列的最后一篇，系列文章： C++ 篇 Python 篇 Go 篇 Java 篇 JavaScript 篇 Java 篇中老荀说到当今互联网份额最大的编程语言是 Java，作为后辈我对此话是没有异议的。但，要说到国内互联网最火、最热闹的编程语言是什么？应该没人对 JavaScript 当选有异议吧。相对 C++、Java 这些老前辈，JS 可谓门槛之低，连 Python 都自叹不如。那作为一个.
初识vue（4）——基于脚手架编写项目
小R.的博客
10-30 286
这里我总结一下基于脚手架编写项目的基础写法。 在搭建好脚手架项目后，我删除了components、App.vue 、main.vue，重新写我的项目代码。这是文件目录： 这是 HelloWorld.vue 代码： <template> <div> <p class="msg">{{msg}}</p> </div&g...
react学习——初识react
qq_43252482的博客
01-05 139
react 是什么 是一个js框架，js框架一般用来做网站。 单页面应用。 如果以MVC的模型来看，相当于view层。 MVC是什么？ react起源和发展 facebook官方出品，2013年5月开源，觉得市面上的框架都不好用，所以自己建了一个。 react 和 Vue的差异 1.从程序角度上来看 语法，使用不一样 vue使用单文件组件：* .vue; React使用模块，*.jsx jsx react特有的语法，允许在js中，写原始的html代码 react 组件：函数式组件、类组件、hock组
初识React
zhaojiuyi的博客
08-02 1432
react学习笔记
React学习---初识React
茹嗨瑞的博客
11-09 441
React是Facebook开发的一款js库，也就是js插件一个非常大的插件，Facebook为什么要创造React呢，主要为了解决什么问题，通过这个又是如何解决的？ Facebook为什么要创造React呢 ​ Facebook 认为 MVC 模式会使他们的项目变得更加复杂，致使代码变得脆弱和不可预 测，非常难以理解和调试，特别是模型和视图间可能存在的双向数据流动。Facebook公司后期改名为meta。
初识vue框架的同学看这里——vue创建项目
weixin_48383709的博客
07-07 500
vue这个前端主流框架之一，还是非常有魅力的，虽然我是第一次使用（嘿嘿），不过跟着文档和百度前辈们的经验，上手还是比较快的，首先咱们就先来用vue创建一个项目吧。 1，首先你得保证你的电脑上安装了nodejs。 2，安装好nodejs你就可以window键+R打开cmd黑窗口，然后输入npm -V检测 这样就是安装成功的。 3，切换到淘宝镜像源 npm install -g cnpm --registry=https://registry.npm.taobao.org 4，然后就是安装vue啦 npm in
初识react（4）——在react-app中如何实现md5加密
小R.的博客
03-31 3190
  当我们用react-app做项目时，会有对用户密码加密的操作，下面给大家分享：在react-app中如何实现md5加密。   如果你不知道如何用react-app搭建脚手架项目，可去看我的博客 初识react（1）——使用脚手架创建项目   下面步入正题，1. 首先npm下载md5： npm install --save js-md5   如下图所示：   2. 引入 js-md5: ...
React详解（基础知识）——react学习part01
最新发布
weixin_46515434的博客
11-14 143
1.官网 1.英文官网: https://reactjs.org/ 2.中文官网:https://react.docschina.org/ 2.介绍描述 1.用于动态构建用户界面的 JavaScript 库(只关注于视图) 2.由Facebook开源 3.React的特点 1.声明式编码 2.组件化编码 3.React Native 编写原生应用 4.高效（优秀的Diffing算法） 4.React高效的原因 1.使用虚拟(virtual)DOM, 不总是直接操作页面真实DOM。 2.DOM Diff
初识react
lu970525的博客
09-15 225
React React学习内容 React学习版本： 16.x React老版本项目： 15.x react官网说 17.x 会使用的一些技术 React应用级脚手架 CRA dva umi create-react-app 【 CRA 】 React官网提供的脚手架 脚手架： 作用： 快速构建一个项目 全局安装create-react-app $ npm insta...
使用React实现图片画廊（送女朋友必备）
Chenkaixin0512的博客
08-29 2737
个人站点：chenkaixin.cn github：https://github.com/KaixinChen0512 这个小项目用到的主要技术是React以及webpack，历时差不多断断续续三天时间吧，初衷是为了入门react以及对webpack的工作原理有个更深刻的认识，当然其中也遇到了不少难题，现做记录，话不多说了，上效果图。 初识React首先通过React的createCla
初识jhipster v5.x：快速搭建全栈开发环境
- 创建基于Angular、React或Vue.js的现代化前端应用 - 集成Spring Boot和Spring Cloud等后端框架及工具 - 自动生成项目结构、实体类、数据库脚本等 - 提供丰富的代码生成器和调试工具 - 支持多语言、多数据库和云...
Vue全家桶（Vue基础看这篇就够了）
qq_63533863的博客
04-17 9669
第一章：vue核心 1.1.Vue 简介 1.1.1 官网 1.英文官网：Vue.js - The Progressive JavaScript Framework | Vue.js 2.中文官网：Vue.js 1.1.2 Vue是什么？ 一套用于构建用户界面的渐进式Javascript框架 作者：尤雨溪 1.1.3 Vue的特点 1.采用组件化模式，提高代码复用率、且让代码更好维护 2.声明式代码，让编码人员无需直接操作DOM，提高开发效率 3...
vue_2.0_fyf
Cat_Boom1999的博客
04-01 715
vue2.0 学习笔记 vue框架的两大核心： 一、前端开发历史 1994年可以看做前端历史的起点（但是没有前端的叫法） 1995年网景推出了JavaScript 1996年微软推出了iframe标签， 实现了异步的局部加载 1999年W3C发布第四代HTML标准，微软推出用于异步数据传输的 ActiveX(ActiveXObject)，各大浏览器厂商模仿实现了 XMLHttpRequest（这是前端的真正的起始） 2006年，XMLHttpRequest被W3C正式纳入标准（这是前端正式的起始） 2006
初识react（13）—— 使用 moment 来获取日期
小R.的博客
08-25 9687
  在写项目时，我们有时需要获取当前时间，这时我们除了用之前 js 获取日期的方式之外，也可以使用 moment 来获取日期。 1、安装 moment npm install moment --save 2、引入 moment import moment from 'moment' 3、使用 moment 获取当前时间： //获取 当前时间 moment().format('YYYY-MM-DD HH:mm:ss'); //2020-08-25 10:23:59 //获取年份 moment().
初识react（8）——引入 public 文件夹下的图片显示不出来
小R.的博客
04-18 7605
  前段时间用react写项目时曾遇到 引入在 public 文件夹下的图片显示不出来 的问题，虽然很快解决了，但我初次使用react会遇到这个问题，说明也会有一部分人也会遇到这个问题，还是总结一下吧，嘿嘿????   此时我将图片存在 public 文件夹下的 images 文件夹里，如下图所示：   这种情况下，在 react 项目的 jsx 文件里应该这样引入图片： <img src="/...
初识echarts（1）： 如何在 react 中使用echarts
小R.的博客
07-31 5667
  在写这篇博客之前，我看到网上模板中的图表总觉得“好大上啊，代码一定很复杂吧”，现在网上搜搜找找，一通摸索，突然觉得好像没那么难搞。这篇博客我先简单总结总结 “如何在 react 中使用echarts”。 一、npm安装 echarts 、echarts-for-react： npm install echarts --save npm install --save echarts-for-react 二、引入模块，这里最好按需引入： import echarts from 'echarts/lib
初识react（5）——怎么截取数组中部分数据
小R.的博客
04-01 3675
  最近做react项目时，遇到这样一个问题：遍历数据为23条，我想分别提取前20条，第21条，第22条，和第23条数据。可能是java和js学的不好，第一时间没想到怎么写。   后来知道可以用arr.slice(start,end)实现。   slice 方法返回的是一个 Array 对象，其中start指的是想要截取的头部下标，end是尾部下标，但不包括end元素。例如： let exam_o...
初识react（3）——react点击事件如何获取当前dom元素
小R.的博客
03-31 3365
  前不久做react项目时遇到了一个问题：设置一个点击事件后，无法获取当前dom元素。   比如我想在点击下图中的“关闭”图标后，将这部分内容隐藏。   我刚开始是按照之前jQuery的写法去写的，代码如下： closeInfo=()=>{ $(this).parent().hide(); };   然而却没有达到我想要的效果，$(this)并没有获取到当前dom元素。   后...
react脚手架创建项目
08-15
回答: 使用react脚手架创建项目的步骤如下：首先需要全局安装create-react-app脚手架，可以通过命令npm i -g create-react-app或者yarn global add create-react-app来进行安装。然后通过命令create-react-app项目...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值