React

基本

Reactライブラリ
<script src=”https://unpkg.com/react@16/umd/react.development.js”></script>
<script src=”https://unpkg.com/react-dom@16/umd/react-dom.development.js”></script>

<div id=”root”>wait…</div>

<script>
let dom = document.querySelector(‘#root’);

React.createElement(Createするタグ, Createする属性, Createする値);
let element = React.createElement(‘p’, {}, ‘Hello React!’);

レンダリング
ReactDOM.render(element, dom);

↓も可
ReactDOM.render(<p>Hello React!</p>, document.getElementById(‘#root’));

</script>

ディレクトリ構成

プロジェクトディレクトリ
│
├─build
│　ビルドファイル
│
├─node_modules
│　node.jsライブラリ
│
├─public
│　index.html
│　公開ディレクトリのエントリファイル
└─src
　　index.htmlから読み込まれるスクリプト、CSS
　　App.js コンポーネントソースファイル
　　App.css コンポーネント用CSSファイル
　　index.js Reactプログラムソースファイル
　　index.css Reactプログラム用CSSファイル