Create Functional Component using ES6 Arrow Syntax

The example is a very common piece of code that will make sense of creating React components and using fat arrow syntax.

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

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

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.

import React from "react";

const Vehicles = () => <h1> Vehicles Component </h1>

export default Vehicles;

Most Helpful This Week