React学习笔记_01
使用Facebook的create-react-app快速构建React开发环境
前言:
create-react-app:来自Facebook官方的零配置命令行工具
create-react-app是来自于Facebook出品的零配置命令行工具,能够帮你自动创建基于Webpack+ES6的最简易的React项目模板,有助于初学者快速上手实践。安装create-react-app的方式也非常简单,可以直接使用npm命令进行全局安装。
npm install -g create-react-app create-react-app my-app
cd my-app/
npm start
执行完上述命令之后,你可以直接打开http://localhost:3000,即可以看到你React APP的运行效果。此时也是处于开发模式下,如果你要进行发布,则使用npm run build进行编译。
create-react-app生成的目录格式如下所示:
my-app/
README.md
index.html
favicon.ico
node_modules/
package.json
src/
App.css
App.js
index.css
index.js
logo.svg
如果你是使用npm start来启动配置,那么自动会进入开发模式,此时热替换是处于自动激活状态,你也可以实时地在界面或者命令行中看到错误提示:
如果你使用npm run build来编译得到生产环境,此时代码会被编译到build目录下,此时会自动将整个应用打包发布,它会自动使用Webpack控件进行优化与压缩。
React学习笔记_01的更多相关文章
- react学习笔记1--基础知识
什么是react A JAVASCRIPT LIBRARY FOR BUILDING USER INTERFACES[React是一个用于构建用户界面的JavaScript库.] React之所以快, ...
- React学习笔记--程序调试
React学习笔记 二 程序调试 前面我们搭建好了React的基本开发环境,可以编写基本的React js程序了.但完成的开发环境肯定包含调试器,怎么调试用React编写的JS程序呢?有浏览器,比 ...
- React学习笔记(一)- 入门笔记
React入门指南 作者:狐狸家的鱼 本文链接:React学习笔记 GitHub:sueRimn 1.组件内部状态state的修改 修改组件的每个状态,组件的render()方法都会再次运行.这样就可 ...
- React学习笔记(七)条件渲染
React学习笔记(七) 六.条件渲染 使用if或条件运算符来创建表示当前状态的元素. 可以使用变量来存储元素.比如: let button = null; if (isLoggedIn) { but ...
- React学习笔记(六)事件处理
React学习笔记(六) 五.事件处理 React事件绑定属性的命名采用驼峰写法,不同于传统DOM全部小写. 如果采用JSX的语法,事件函数需要用大括号{}包裹函数名,不同于传统DOM字符串小括号的方 ...
- React学习笔记(五)State&声明周期
React学习笔记(五) 四.State&声明周期 可以为组件添加"状态(state)".状态与属性相似,但是状态是私有的,完全受控于当前组件. 局部状态就是只能用于类(定 ...
- React学习笔记 - 组件&Props
React Learn Note 4 React学习笔记(四) 标签(空格分隔): React JavaScript 三.组件&Props 组件可以将UI切分成一些独立的.可复用的部件,这样你 ...
- React学习笔记 - 元素渲染
React Learn Note 3 React学习笔记(三) 标签(空格分隔): React JavaScript 二.元素渲染 元素是构成react应用的最小单位. 元素是普通的对象. 元素是构成 ...
- React学习笔记 - JSX简介
React Learn Note 2 React学习笔记(二) 标签(空格分隔): React JavaScript 一.JSX简介 像const element = <h1>Hello ...
随机推荐
- 自己动手实现java数据结构(三) 栈
1.栈的介绍 在许多算法设计中都需要一种"先进后出(First Input Last Output)"的数据结构,因而一种被称为"栈"的数据结构被抽象了出来. ...
- Kafka实战解惑
目录 一. kafka简介二. Kafka架构方案三. Kafka安装四. Kafka Client API 4.1 Producers API 4.2 Consumers API 4.3 消息高可靠 ...
- 如何在Lua与C/C++之间实现table数据的交换
之前在<C/C++和Lua是如何进行通信的?>一文中简单的介绍了lua与宿主之间的通信.简单的说两种不同的语言之间数据类型不一样又如何进行数据交换呢?那就是lua_State虚拟栈,通过栈 ...
- kubernetes1.13之后的kubeadm init config
1.kubernetes1.13之后kubeadm开始GA,由于1.13的kube-proxy有bug,删除ipvs的地方总是导致kube-proxy挂掉,所以建议直接用1.13.2,这个版本解决了b ...
- 深度学习论文翻译解析(三):Detecting Text in Natural Image with Connectionist Text Proposal Network
论文标题:Detecting Text in Natural Image with Connectionist Text Proposal Network 论文作者:Zhi Tian , Weilin ...
- MySQL基准测试(一)--原因,策略,思路
MySQL基准测试(一)--原因,策略,思路 运用benchmark的原因 验证一些你认为的问题,通过基准测试和模拟数据来验证. 解决生产系统的一些异常 测试系统的当前的运行情况,通过历史的基准测试结 ...
- 深入浅出 JVM GC(2)
# 前言 在 深入浅出 JVM GC(1) 中,限于上篇文章的篇幅,我们留下了一个问题 : 如何回收? 这篇文章将重点讲述这个问题. 在上篇文章中,我们也列出了一些大纲,今天我们就按照那个大纲来逐个讲 ...
- Android开发day-01
http://note.youdao.com/noteshare?id=b7f0d55c1e5eab20bb47e5c58e683611
- PHP FastCGI进程管理器PHP-FPM的架构
一个master进程,支持多个pool,每个pool由master进程监听不同的端口,pool中有多个worker进程.每个worker进程都内置PHP解释器,并且进程常驻后台,支持prefork动态 ...
- python之socketserver ftp功能简单讲解
TCP协议中的socket一次只能和一个客户端通信,然而socketserver可以实现和多个客户端通信. 它是在socket的基础上进行了一层封装,底层还是调用的socket # 服务端 impor ...