Webサイト用語入門。サーバー・ドメイン・APIの違い

ブラウザでURLを開くと、ブラウザはWebサイトの置き場所へ「ページのデータをください」と依頼します。受け取ったデータを組み立てたものが、私たちが見ているWebページです。

このページは、Webサイト作りを始めた人のための入門記事です。ページが届く流れに沿って用語を整理します。

まずは3つだけ覚えよう

用語	動く場所	主な役割
フロントエンド	主にブラウザ	見た目や操作部分
バックエンド	主にサーバー	データ保存、ログイン確認、処理

ブラウザは、ChromeやFirefoxなど、Webページを表示するソフトです。

サーバーは、ブラウザからの要求に応じてファイルやデータを返すコンピューター、またはソフトウェアを指します。

フロントエンドの基本となる3つの技術です。

HTMLはプログラミング言語ではなく、内容の構造を表すマークアップ言語です。

静的サイトは、あらかじめ作ったHTMLなどのファイルを基本的にそのまま返します。表示が速く、構成が単純で、記事中心のサイトと相性があります。

動的サイトは、アクセス時の条件やデータベースの内容に応じてページを作ります。データベースは、商品情報や会員情報などを整理して保存する仕組みです。ログイン機能や商品在庫など、利用者ごとに内容を変える機能に向いています。

Astroで記事をビルドして公開する「コードの種」は、静的サイトとして運営できます。

サーバーは、サイトのファイルを保存して届ける仕組みです。

ホスティングは、そのサーバーや公開環境を貸し出すサービスです。Cloudflare Pagesはホスティングサービスの一例です。

「サーバーが建物なら、ホスティングは場所と設備を借りる契約」と考えると分かりやすいでしょう。

ドメインはURLの一部分です。

IPアドレスは、ネットワーク上の接続先を表す番号です。ブラウザはDNSを使って、入力されたドメインの接続先を調べます。

DNSは、名前から電話番号を探す電話帳に似ています。人が読みやすいドメインから、コンピューターが接続に使うIPアドレスを調べます。

CDNは、世界中の複数の場所にファイルのコピーを置き、利用者に近い場所から届ける仕組みです。表示を速くし、アクセスが集中したときの負担も分けられます。

APIは、ソフトウェア同士が決められた方法で機能やデータをやり取りするための窓口です。

たとえば天気サービスのAPIを使うと、自分のサイトから天気データを取得して表示できます。

サービスによっては、利用者を確認するためにAPIキーを使います。秘密の合言葉に近い文字列なので、だれでも見られる公開ページへ直接書かないようにします。

この流れを頭に置いておくと、ページが表示されないときに、どの場所で問題が起きているかを考えやすくなります。

公開前後の作業用語は、プログラミング基本用語でも説明しています。

以下は説明の確認に使った資料です。この記事を理解するために、すべて読む必要はありません。