how to add carsoul to react project

1import React, { Component } from 'react';
2import ReactDOM from 'react-dom';
3import "react-responsive-carousel/lib/styles/carousel.min.css"; // requires a loader
4import { Carousel } from 'react-responsive-carousel';
5
6class DemoCarousel extends Component {
7    render() {
8        return (
9            <Carousel>
10                <div>
11                    <img src="assets/1.jpeg" />
12                    <p className="legend">Legend 1</p>
13                </div>
14                <div>
15                    <img src="assets/2.jpeg" />
16                    <p className="legend">Legend 2</p>
17                </div>
18                <div>
19                    <img src="assets/3.jpeg" />
20                    <p className="legend">Legend 3</p>
21                </div>
22            </Carousel>
23        );
24    }
25}
26
27ReactDOM.render(<DemoCarousel />, document.querySelector('.demo-carousel'));
28
29// Don't forget to include the css in your page
30
31// Using webpack or parcel with a style loader
32// import styles from 'react-responsive-carousel/lib/styles/carousel.min.css';
33
34// Using html tag:
35// <link rel="stylesheet" href="<NODE_MODULES_FOLDER>/react-responsive-carousel/lib/styles/carousel.min.css"/>