澳门网络娱乐游戏平台-澳门电子游戏娱乐网址-官方直营

1.0 Hello World Hello World

React Learn Note 1

The easiest way to get started with React is to use this Hello World example code on CodePen. You don't need to install anything; you can just open it in another tab and follow along as we go through examples. If you'd rather use a local development environment, check out the Installation page.

React学习笔记(后生可畏)

标签(空格分隔): React JavaScript


开首读书React最佳的主意是使用我们在CodePen上的Hello World事例。你无需设置任毕建华西。你只必要在新的竹签页中展开它然后随时大家付出的事例走。若是你指望利用本地开垦意况,那就去看安装表达页。

前、Hello World

The smallest React example looks like this:

1. 创办单页面应用

使用Create React App。

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

cd my-app
npm start

预备好安顿惠临蓐条件中时,运转npm run build将会在build文件夹中开创一个优化好的应用。

澳门官方赌场,小小的的React事例长成这么:

2. 增添到现存应用

先是须求安装包:

npm init
npm install --save react react-dom

付出意况使用 react.development.js``react-dom.development.js澳门24小时app,。
传延宗族情形使用react.production.min.js``react-dom.production.min.js

  • 假若运用像webpack或Browserify那样的创设筑工程具:
import React from 'react';
import ReactDOM from 'react-dom';

ReactDOM.render(
    <h1>Hello, world</h1>,
    document.getElementById('root')
);
  • 生龙活虎旦经过援引文件使用

注意script标签type是text/babel,何况亟需援用 babel-standalone:

<!DOCTYPE html>
<html>
<head>
    <title>react demo</title>
    <script type="text/javascript" src="./node_modules/babel-standalone/babel.js"></script>
    <script type="text/javascript" src="./node_modules/react/umd/react.development.js"></script>
    <script type="text/javascript" src="./node_modules/react-dom/umd/react-dom.development.js"></script>
</head>
<body>
    <div id="root"></div>

    <script type="text/babel">
        ReactDOM.render(
            <h1>Hello, world!</h1>,
            document.getElementById('root')
        );
    </script>
</body>
</html>

The end...    Last updated by: Jehorn, Jan 03, 2018, 4:51 PM

  • React学习笔记(意气风发)- Hello World
  • React学习笔记(二)- JSX简要介绍
  • React学习笔记(三)- 成分渲染
  • React学习笔记(四)- 组件&Props

ReactDOM.render(
    <h1>Hello, world!</h1>,
    document.getElementById('root')
);

本文由澳门网络娱乐游戏平台发布于Web前端,转载请注明出处:1.0 Hello World Hello World

相关阅读