How to use Bootstrap CDN In React Bootstrap

This is one of the easiest ways to use bootstrap in your React app. The best thing about bootstrap CDN is no requirement for installation or downloads. You just need to copy and paste a link in the head section of your app to make it work. Below is the link that you need.

<link rel="stylesheet" href="https://www.w3wiki.nethttps://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" 
integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" 
crossorigin="anonymous">

In case your application needs JavaScript components along with the bootstrap, then at the bottom of the page place <script> tag, just before the closing </body> tag. 

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" 
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" 
crossorigin="anonymous"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" 
integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ" 
crossorigin="anonymous"></script>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js" 
integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm" 
crossorigin="anonymous"></script>

These snippets will be added to the public/index.html page.

Example: index.html in public directory will be

We all know the popularity of React, and how this library has made development tasks easier for frontend developers. React is the most popular front-end library for building the user interface of the application. Industries are slowly reducing the use of jQuery and DOM libraries for building their application.

When it comes to building a responsive app, CSS frameworks are useful in the market. If you work as a front-end developer, then Bootstrap, Foundation, and Bulma kind of framework are not new for you. Most industries use the Bootstrap framework. Millions of websites are running on bootstrap.

Here in this blog, we are going to discuss how to use React and Bootstrap, how to add bootstrap to React app. How to install the React bootstrap package and how to use it in React application. Let’s start with it…

There are mainly three ways to use Bootstrap with React JS app.