Skip to content

Instantly share code, notes, and snippets.

@eveningkid
Created February 13, 2020 11:19
Show Gist options
  • Save eveningkid/f33f2e20e17278c2326892087f2bac9a to your computer and use it in GitHub Desktop.
Save eveningkid/f33f2e20e17278c2326892087f2bac9a to your computer and use it in GitHub Desktop.
import React from "react";
import Container from "react-bootstrap/Container";
import Row from "react-bootstrap/Row";
import Col from "react-bootstrap/Col";
import Image from "react-bootstrap/Image";
import "bootstrap/dist/css/bootstrap.min.css";
import "./App.css";
function App() {
return (
<div className="App">
<Container>
<Row>
<Col xs={12} md={6} lg={2}>
<Image
src="https://images.dog.ceo/breeds/airedale/n02096051_1861.jpg"
fluid
/>
</Col>
<Col xs={12} md={6} lg={2}>
<Image
src="https://images.dog.ceo/breeds/airedale/n02096051_1861.jpg"
fluid
/>
</Col>
<Col xs={12} md={6} lg={2}>
<Image
src="https://images.dog.ceo/breeds/airedale/n02096051_1861.jpg"
fluid
/>
</Col>
<Col xs={12} md={6} lg={2}>
<Image
src="https://images.dog.ceo/breeds/airedale/n02096051_1861.jpg"
fluid
/>
</Col>
<Col xs={12} md={6} lg={2}>
<Image
src="https://images.dog.ceo/breeds/airedale/n02096051_1861.jpg"
fluid
/>
</Col>
<Col xs={12} md={6} lg={2}>
<Image
src="https://images.dog.ceo/breeds/airedale/n02096051_1861.jpg"
fluid
/>
</Col>
</Row>
</Container>
</div>
);
}
export default App;

This example shows you how to use react-bootstrap, from a standard Bootstrap example.

To import a component:

import Component from 'react-bootstrap/Component';

// e.g
import Container from 'react-bootstrap/Container';
@row-star-134
Copy link

In react , we know use the className instead of class. but , In bootstrap site code has class so in react error will occure. so we need to change lot of thing in code. so we have option for use bootstrap in react js without change code. it has already changed code for react developer.
https://debuggingsolution.blogspot.com/2021/04/use-bootstrap-in-reactjs.html

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment