bootstrap-powered-react

Bootstrap Powered React

Modular Bootstrap CSS for your React Application

Getting Started

In a React project:

yarn add bootstrap-powered-react bootstrap lodash

Usage

import React from "react";
import BPRElements from "bootstrap-powered-react";

const { Div, H1, P, Button } = BPRElements;

export const PrimaryAlert = (props) => (
  <Div className="alert alert-primary my-2" {...props} />
);

export const LargeButton = (props) => (
  <Button className="btn btn-lg btn-primary" {...props} />
);

export default function App() {
  return (
    <Div className="container">
      <H1>Hello StackBlitz!</H1>
      <P>Start editing to see some magic happen :)</P>
      <PrimaryAlert>Primary Alert</PrimaryAlert>
      <LargeButton>Large Primary Button</LargeButton>
    </Div>
  );
}

Demo

Checkout this demo on StackBlitz.