React Tutorial

Učení podle příkladů

Náš nástroj "Show React" usnadňuje demonstraci React. Zobrazuje kód i výsledek.

import React from 'react';
import ReactDOM from 'react-dom';

function Hello(props) {
  return <h1>Hello World!</h1>;
}

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

Učení pomocí cvičení

ReactDOM.(myElement, document.getElementById('root'));

Reagovat Kvíz

Otestujte si své schopnosti React v kvízu.

Reagovat Kvíz

Vytvořit aplikaci React

Chcete-li se naučit a otestovat React, měli byste si na svém počítači nastavit prostředí React.

Tento tutoriál používá create-react-app.

Tento create-react-appnástroj je oficiálně podporovaným způsobem vytváření aplikací React.

Node.js je vyžadován pro použití create-react-app.

Otevřete svůj terminál v adresáři, ve kterém chcete vytvořit aplikaci.

Spuštěním tohoto příkazu vytvořte aplikaci React s názvem my-react-app:

create-react-app nastaví vše, co potřebujete ke spuštění aplikace React.

Spusťte aplikaci React

Spuštěním tohoto příkazu se přesunete do my-react-appadresáře:

Spusťte tento příkaz pro spuštění aplikace React my-react-app:

Objeví se nové okno prohlížeče s nově vytvořenou aplikací React! Pokud ne, otevřete prohlížeč a zadejte localhost:3000do adresního řádku.

Výsledek:

Co byste již měli vědět

Než začnete s React.JS, měli byste mít středně pokročilé zkušenosti v:

• HTML
• CSS
• JavaScript

Měli byste mít také nějaké zkušenosti s novými funkcemi JavaScriptu zavedenými v ECMAScript 6 (ES6), o nich se dozvíte v kapitole React ES6 .