How to configure Bootstrap in React app — reactstrap
A ‘bootstrap’ is one of the most famous CSS framework, which gives rich features for mobile responsive designs using pre-built CSS and java script libraries.
A ‘reactstrap’ is a library which specially design for react. which gives pre-built bootstrap 4 components, which gives flexibility and usability.
Installing bootstrap
npm install bootstrap
yarn add bootstrap
Installing reactstrap
npm install reactstrap reactpopper — — save
yarn add reactstrap reactpopper
Adding to the project
Once we install the bootstrap library, we can use bootstrap.min.css file to the index.js. It is better import a bootstrap.min.css file before the index.css file, since we can override default bootstrap styles from the our custom styles, if required.
Import the components
Then you can import the bootstrap components, inside any component where you need.
Use them
example 1:
example 2:
