diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index fe3b767cdcf..bee26042101 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -841,36 +841,35 @@ Alternatively, you can force the linter to ignore any line by adding `// eslint- ## Adding Bootstrap -You don’t have to use [React Bootstrap](https://react-bootstrap.github.io) together with React but it is a popular library for integrating Bootstrap with React apps. If you need it, you can integrate it with Create React App by following these steps: +You don’t have to use [reactstrap](https://reactstrap.github.io/) together with React but it is a popular library for integrating Bootstrap with React apps. If you need it, you can integrate it with Create React App by following these steps: -Install React Bootstrap and Bootstrap from npm. React Bootstrap does not include Bootstrap CSS so this needs to be installed as well: +Install reactstrap and Bootstrap from npm. reactstrap does not include Bootstrap CSS so this needs to be installed as well: ```sh -npm install --save react-bootstrap bootstrap@3 +npm install --save reactstrap bootstrap@4 ``` Alternatively you may use `yarn`: ```sh -yarn add react-bootstrap bootstrap@3 +yarn add bootstrap@4 reactstrap ``` Import Bootstrap CSS and optionally Bootstrap theme CSS in the beginning of your ```src/index.js``` file: ```js import 'bootstrap/dist/css/bootstrap.css'; -import 'bootstrap/dist/css/bootstrap-theme.css'; // Put any other imports below so that CSS from your // components takes precedence over default styles. ``` -Import required React Bootstrap components within ```src/App.js``` file or your custom component files: +Import required reactstrap components within ```src/App.js``` file or your custom component files: ```js -import { Navbar, Jumbotron, Button } from 'react-bootstrap'; +import { Button } from 'reactstrap'; ``` -Now you are ready to use the imported React Bootstrap components within your component hierarchy defined in the render method. Here is an example [`App.js`](https://gist.githubusercontent.com/gaearon/85d8c067f6af1e56277c82d19fd4da7b/raw/6158dd991b67284e9fc8d70b9d973efe87659d72/App.js) redone using React Bootstrap. +Now you are ready to use the imported reactstrap components within your component hierarchy defined in the render method. Here is an example [`App.js`](https://gist.githubusercontent.com/zx6658/d9f128cd57ca69e583ea2b5fea074238/raw/a56701c142d0c622eb6c20a457fbc01d708cb485/App.js) redone using reactstrap. ### Using a Custom Theme