import React from 'react'
import ReactDOM from 'react-dom'

const App = () => {
  return (
    <>
      <h1>ボタン</h1>
      {/* 問題2. コンポーネントを表示しよう */}
      <PlusButton />
      {/* ここまで */}
    </>
  )
}

// 問題1. コンポーネントを実装しよう
const PlusButton = () => {
  return (
    <div>
      <button>+</button>
    </div>
  )
}
// ここまで

ReactDOM.createRoot(document.getElementById('root')).render(<App />)


code-lesson

関数コンポーネント

import React from 'react'
import ReactDOM from 'react-dom'

const App = () => {
  return (
    <>
      <h1>ボタン</h1>
      {/* 問題2. コンポーネントを表示しよう */}

      {/* ここまで */}
    </>
  )
}

// 問題1. コンポーネントを実装しよう

// ここまで

ReactDOM.createRoot(document.getElementById('root')).render(<App />)


component（1つ）

まずは必要なスキルを確認しましょう！