Reusable Label component example in react js

• Create Components folder under src folder
• Create  common folder under Components folder
• Create Label folder under common folder 
• Add index.js file under Label folder and add below Code

import React from "react";

import "./style.css";

const Label = props => {

  return <label id={props.id}>{props.value}</label>;

};

export default Label;

• Add style.css file and add below Code

//CSS Style here

• Go to Components Folder and Add LabelEXP.js file and add below Code

import React from "react";

import Label from "./common/Label/index";

const LabelEXP = () => {

  return (

    <>

      <h3>Label reusable component example</h3>

      <Label id={"lblName"} value={"Name"} />

      <br />

      <Label id={"lblEmail"} value={"Email"} />

    </>

  );

};

export default LabelEXP;

• Open App.js file and update code as below

import React from 'react';

import LabelEXPfrom './Components/LabelEXP'

function App() {

  return (

    <div>

      <LabelEXP/>

    </div>

  );

}

export default App;

Output: