■P102

────────────────
import { useState } from "react";

const Counter = () => {
  const [count, setCount] = useState(0);

  const handleClick = () => {
    setCount((prev) => prev + 1);
  };

  return (
    <button onClick={handleClick}>
      {count}回押しました
    </button>
  );
};

export default Counter;
────────────────


■P103

────────────────
<button onClick={handleClick}>
  {count}回押しました
</button>
────────────────


■P104

App.jsxではなく、HTMLファイルに記述してください
────────────────
<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>カウンターアプリ</title>
</head>
<body>
  <button id="counterButton">0回押しました</button>

  <script>
    // ステートとしてのカウント値を保持
    let count = 0;

    // ボタン要素を取得
    const button = document.getElementById("counterButton");

    button.addEventListener("click", () => {
      count += 1;

      // ボタンのテキストを更新
      button.textContent = `${count}回押しました`;
    });
  </script>
</body>
</html>
────────────────

