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

Random Quote Generator Calculator Search and Filter List Records Carousel Weather Finder Bill and Discount Calculator Memory Game Random Meme Generator Search Autocomplete Form Container Voting System Google Map Compass Clock Form Validation Arrange Game Dice Game Tic Tac Toe

Golang Tutorial

Golang Reference

Beego Framework

How to create Functional Component?

Most Helpful This Week

Most Helpful This Week