Golang React JS Technology Blog

How to use React-Bootstrap component?

Example

Installing React-Bootstrap
In the Terminal, run:

npm install --save react-bootstrap

Add below to my-app\public\index.html in your project's public folder to get the latest styles.

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

my-app\src\App.js

import React, { Component } from 'react';

import { ButtonToolbar,Button } from 'react-bootstrap';



class App extends Component {

  render() {

    return (

		<div>

			<ButtonToolbar>

			  <Button bsStyle="primary" bsSize="large" disabled>

				Primary button

			  </Button>

			  <Button bsSize="large" disabled>

				Button

			  </Button>

			</ButtonToolbar>

		</div>

    );

  }

}



export default App;
Most Helpful This Week
How to use function inside JSX expression? How to use createElement in React JS? How to set property values using expression? How to pass data from child component to its parent in ReactJS? How to pass properties from parent component to child component in React JS? How to create simple React Router to navigate multiple pages?