How to Include bootstrap css in React app?

You can easily use/ include bootstrap css in your React js app, by following these quick steps:

Step 1  – Open your React app’s terminal and navigate to the project directory.

Step 2  – Install Bootstrap using npm by running the following command:

npm install bootstrap

Step 3  – Once the installation is complete, navigate to your index.js file (or App.js file if you are using create-react-app).

Step 4  – Import the Bootstrap CSS file by adding the following line at the top of the file:

import 'bootstrap/dist/css/bootstrap.css';

Step 5  – Save the changes to the file.

Your React app should now be using Bootstrap’s CSS.

Alternatively, you can use Bootstrap CDN:

You can use Bootstrap’s Content Delivery Network (CDN) by adding the following link in the head section of your index.html file:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" />

 

This method is the easiest way to use Bootstrap in a React app, but it may affect the app’s performance.