ReactJS Hook Pattern ~Deriving State~

・This pattern means to avoid storing a state that can be calculated from existing other states. In ReactJS, this pattern is officially recommended as Avoid redundant state.

import { useState } from "react";

function App() {
  const [firstName] = useState("John");
  const [lastName] = useState("Doe");

  const fullName = `${firstName} ${lastName}`;

  return (
    <div>
      <p>Full Name: {fullName}</p>
    </div>
  );
}

export default App;