React Bootstrap 5

We just released React Bootstrap 5 on Product Hunt.

Only a few days after the stable release of Bootstrap 5 - we can integrate it with React 17.

Features:

• RTL support
• Material Design 2.0 guidelines
• extensive docs & API
• 700+ UI components & templates
• MIT license - free for personal & commercial use

I hope you will enjoy it :)

NPM Installation

Prerequisites

Before starting the project make sure to install Node LTS (12.x.x or higher). We are using yarn to start a project.

If you want to use package from npm you have to have a project with React. We recommend creating an app with create-react-app from react for beginners.

Step 1: Create React App.

We are using React 17+ version.

yarn create-react-app my-app or npx create-react-app my-app

Step 2: Navigate to App's directory

cd my-app

React Bootstrap 5 installlation

Step 1: Setup MDB

yarn add mdb-react-ui-kit or npm i mdb-react-ui-kit

CSS import

Add the following line in your index.js file before the App.js file import:

import 'mdb-react-ui-kit/dist/css/mdb.min.css'

Font Awesome

Add the following line in public/index.html file inside head section:

<link href="https://use.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet" />

Roboto font

Add the following line in public/index.html file inside head section:

<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" />

Set font family in globally css file for example src/index.css inside src folder as in the example:

body { font-family: Roboto, Helvetica, Arial, sans-serif; }

Step 2: Launch Your App

yarn start or npm run start

Comments

[Jagar]

Yummy, that's great I am an android developer (and also develop my APIs) but I wanted to develop some web-based stuff for my apps, and I think I can start here.