I'm using reactjs for my new project and I was impressed with functionalities of react.js. But still I was confused with reactjs . I know that react js is a front end framework(not a framework though) . Still I was struggling to design a perfect website with reactjs . Using bootstrap for every single component was a nightmare for me to do until I found out ReactStrap .

ReactStrap is a react component for using bootstrap components inside your reactjs app .
By using reactstrap it is easy to import boostrap components inside our react.js app.
ReactStrap is a way to quickly add Bootstrap styling to a React application.

Reactstrap contains bootstrap components already styled.
ReactStrap will make components available to you that are already styled, so all you have to do is include them into your project and tweak their

Install it using npm command.

npm install --save reactstrap react react-dom


After installed, just import the reactstrap in your code.

import * from reactstrap;


Or if you want particular component from reactstrap, you can import particular components from reactstrap .
For example, add Button component from reactstrap .

import { Button } from 'reactstrap';


Then, In your render function use reactstrap component like this ,

<Button color="primary">Default button</Button>


Simple right ?
It is even fun to add components with reactstrap .
We can also pass predefined props to control the styling.