How to create Functional Component?

This component simply going to display a message in H1 tag. Create a new folder called components and within the folder create a new file Vehicles.js, for file naming convention use Pascal Case.


src\App.js
import React from 'react';
import Vehicles from "./components/Vehicles";
import './App.css';

function App() {
  return (
    <div className="App">
      <Vehicles />
    </div>
  );
}

export default App;
I have updated the App component so that it renders the Vehicles content as part of its content. The Vehicles component renders an h1 element that contains a message.

src\components\Vehicles.js
import React from "react";

function Vehicles() {
    return <h1> Vehicles Component </h1>
}

export default Vehicles;


Most Helpful This Week