アプリ開発でよく使う仕組みをあらかじめ用意してくれている「土台キット」。ゼロから全部作らずに済み、決まった作法に沿うだけで品質の高いものが速く作れる。
フレームワークとは、アプリ開発で毎回必要になる仕組み(画面表示・ページ切り替え・データ処理など)を、あらかじめ用意してくれている開発の土台キットのことです。Next.js(Web開発)などが代表例です。
「家具の組み立てキット」です。木を切り出すところから家具を作る(ゼロから開発する)のは大変ですが、キットなら部品と説明書が揃っていて、ネジを締めていくだけで頑丈な家具が完成します。フレームワークは「アプリのよくある部分」を部品化して、説明書(決まった作法)付きで提供してくれます。
似た言葉に「ライブラリ」があります。ライブラリは道具箱(必要なときに自分が呼び出す)、フレームワークは工場のライン(決められた流れに自分のコードをはめ込む)。主導権が自分にあるのがライブラリ、枠組み側にあるのがフレームワークです。
初心者がつまずきやすいポイント
「どのフレームワークが最強か」の比較記事を読み込みすぎて、選ぶだけで数週間溶かすことです。個人のWeb開発なら、情報が多くAIの回答精度も高いNext.jsを選んでおけばまず困りません。選定より、1本作り切る経験のほうが100倍価値があります。
API(エーピーアイ)
プログラム同士が情報をやり取りするための窓口。中の仕組みを知らなくても、決められた形で頼めば決められた形で返ってくる。
CSS(シーエスエス)
Webページの「見た目」を書くための言語。色・文字の大きさ・余白・配置・アニメーションまで、デザインに関わる部分をすべて担当する。構造のHTMLとセットで使う。
GitHub(ギットハブ)
プログラムのコードを保管・共有するためのWebサービス。変更の履歴がすべて残り、いつでも前の状態に戻せる。Vercelと連携すると、コードを送るだけで自動でサイトが更新される。
HTML(エイチティーエムエル)
Webページの「構造」を書くための言語。見出し・段落・画像・リンクなど、ページに何がどの順で置かれるかを定義する。Webページはすべて最終的にHTMLでできている。
JavaScript(ジャバスクリプト)
Webページに「動き」を付けるためのプログラミング言語。ボタンを押したら開く、入力をチェックする、データを取ってきて表示するなど、ページ上のあらゆる動作を担当する。
Next.js(ネクストジェイエス)
Reactをベースにした、Webアプリ開発の人気フレームワーク。画面・ページ切り替え・サーバー処理までひと揃いで作れる。本サイトもNext.jsで動いている。