React学习教程(2)安装

作者: 四冶读史 | 来源:发表于2017-10-26 13:44 被阅读44次

概述

React主要依赖于React和React-DOM这两个库,你可以直接去官网下载,或者使用一个React CDN库,或者通过node.js来管理,根据你的需求,可自行选择。
React 可被灵活地运用在各种项目中。你可以用它创建新的应用程序,也可以逐渐地将其加入到现有的代码库中而无需重写。
Reate React App 并不处理后端逻辑和数据库,它只会创建一个前端的构建管道,所以可以和任何后端搭配使用。
你可以在任何由其他 JavaScript UI 库编辑的现有应用中,将 React 渲染进一个 DOM 元素。

直接使用

React可以直接下载使用,也可以使用一个React CDN库。
可以到官网下载最新版本https://reactjs.org/
研发环境

<script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>

生产环境

<script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>

通过npm使用React

使用该方式的前提是,你的系统已装有Node.js,并支持npm。

npm install -g create-react-app
create-react-app my-app
cd my-app
npm start

启动后可通过localhost:3000查看界面。
React目录结构
创建项目后,目录结构如下:

my-app/
  README.md
  node_modules/
  package.json
  public/
    favicon.ico
    index.html
    manifest.json
  src/
    App.css
    App.js
    App.test.js
    index.css
    index.js
    logo.svg
    registerServiceWorker.js

注:
本教程相关的所以源码,可在https://github.com/areawen2GHub/reacttest.git下载

参考地址:
https://reactjs.org/docs/installation.html
http://www.runoob.com/react/react-install.html

相关文章

  • React学习教程(2)安装

    概述 React主要依赖于React和React-DOM这两个库,你可以直接去官网下载,或者使用一个React C...

  • 【教程】react实战

    React实战 一、前期准备 1、React安装与创建项目 详情参见 【react教程】 2、组件的打包 以调用a...

  • 【教程】react教程(精简)

    react 教程 一、React安装 参考:小结点node博客-react的安装与使用 1 、 使用npm安装脚手...

  • React 实践(一)

    参考:《React 入门实例教程--阮一峰》、《React 学习教程--众成翻译》。React 框架入门学习摘录。...

  • React学习笔记

    写在前面 React入门学习笔记。 教程可参考:React 教程 | 菜鸟教程阮一峰的网络日志 > React 入...

  • React Native环境配置坑

    React Native中文环境配置教程 1.安装brew,然后node单独官网下载安装 2.切换淘宝线路以加快下...

  • 第二章 React-Native react-navigatio

    2-1 安装react-navigation 2-2 安装react-native-gesture-handler...

  • ROS安装教程(1) - 安装

    ROS安装教程目录 ROS安装教程(1) - 安装(本章)ROS安装教程(2) - 配置ROS安装教程(3) - ...

  • ROS安装教程(2) - 配置

    ROS安装教程目录 ROS安装教程(1) - 安装ROS安装教程(2) - 配置(本章)ROS安装教程(3) - ...

  • React Native资料

    React-Native学习指南 Awesome React-Native系列 教程 react-native 官...

网友评论

    本文标题:React学习教程(2)安装

    本文链接:https://www.haomeiwen.com/subject/rvfkpxtx.html