セクション 32 / 42

Web開発

React

画面を“部品(ブロック)”で組み立てる

React(リアクト)は、Webの画面を“部品(コンポーネント)”を組み合わせて作るための道具です。レゴブロックのように、小さな部品を組み立てて画面を作ります。

なぜ便利?

  • 「ボタン」「カード」「ヘッダー」などを部品にして、何度も使い回せる。
  • 同じ部品を直せば、使っている場所すべてに反映される(修正がラク)。
  • データが変わると画面が自動で更新される(例:「いいね」を押すと数字がすぐ変わる)。

たとえば商品一覧なら、「商品カード」という部品を1つ作って、データの数だけ並べるだけ。1個ずつ手で作らなくてよくなります。

このサイトもReactの部品でできている

あなたが見ているサイドバーやクイズも、それぞれ“部品(コンポーネント)”です。

次のNext.jsの土台

Reactは“表側(フロント)”の代表格。次に学ぶNext.jsは、このReactをさらに便利に使うための土台です。

理解度チェック

読み込み中…