ReactでBootstrapを使う

開発環境は、Windows 10 Pro(64bit) + npm 6.4.1。

https://react-bootstrap.github.io/

npm install react-bootstrap bootstrap

htmlファイルのheadタグ部分に、

<link
  rel="stylesheet"
  href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
  integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
  crossorigin="anonymous"
/>

を追加する。CSSファイルを入れないと、デザインが反映されません。
自分独自のCSSファイルは、上記のCSSファイルの後に読み込むこと。

Reactのファイル内に

import Button from 'react-bootstrap/Button';

// renderのreturn内にて。
<ButtonToolbar>
  <Button variant="primary">Primary</Button>
</ButtonToolbar>

を追加する。

※注意点
作っている途中に、react-bootstrapを導入したら、リセットCSSが原因で、それまで書いていたデザインが崩れてしまった。できれば、最初から、導入すること。