ReactJS: What is Reactstrap? How to use it?


Reactstrap is a React component library for Bootstrap. Reactstrap is currently compatible with Bootstrap 5.1.


Getting Started

Install Reactstrap
npm install reactstrap react react-dom

Reactstrap currently requires React 16.8 or higher.

Include Bootstrap
Import Bootstrap in your application code:
  1. npm install --save bootstrap
  2. import 'bootstrap/dist/css/bootstrap.min.css';
or include Bootstrap from a CDN URL in your HTML layout:
<head> 
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css" /> 
</head>

Import components
import React from 'react'; 
import { Button } from 'reactstrap';
import { Modal, ModalBody, ModalHeader } from 'reactstrap';


Unlike some component libraries, Reactstrap does not embed its own styles, and instead depends on the Bootstrap CSS framework for its styles and theme. This allows you to have consistent styles across your React-based components and static parts of your site, and allows you to include your own custom Bootstrap theme when needed.

More detail can be read from this url:

Comments

Popular posts from this blog

How to Inspect Problems in Your ReactJS Codes

ReactJS: Protected Routes Implementation in ReactJS