create-react-appコマンドを使ってReact-Bootstrapを導入

Facebook公式のcreate-react-appコマンドを使ってReact.jsアプリを爆速で作成するを見て、少し試した。React-Bootstrapの導入まで軽く試してみた。

環境

ローカル環境:Windows10
ターミナル：GitBash + ConEmu

Qiitaの記事通りHello-Worldまで

Terminal

npm install -g create-react-app
create-react-app hello-world
npm start

ターミナルで上記のコマンド実行で、この画面まで。

Hello-World以降

React-Bootstrap Getting started通りに導入

1.Terminal

npm install react-bootstrap --save

2.Terminal

bower install react react-bootstrap

bash: bower: command not found

2のコマンド実行時に、上記のエラーがでる。以下のコマンド実行し、再度2を実行。

3.Terminal

npm install -gf bower

App.jsで試しにButtonを読み込んでみる。

App.js

import { Button } from 'react-bootstrap';
~~以下のコードをdivタグ内に記述。
<Button className="btn-github" >View Code</Button>

index.htmlでbootstrap.cssを読み込む。

index.html

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">　->追加
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap-theme.min.css">　->追加

bootstrapのボタンが表示される。

##その他参考
bower command not found windows