Web の構成要素 5

Barbara Streisand
リリース: 2024-12-10 15:39:14
オリジナル
493 人が閲覧しました

The Building Blocks of the Web 5
Web 開発の取り組みを開始する場合、Web の「方法」と「理由」を理解することは、HTML、CSS、または JavaScript を学ぶのと同じくらい重要です。

Web 開発を始めるために必要なすべての重要な知識を得ることができます。

インターネットはどのように機能するのでしょうか?

インターネットは Web のバックボーンであり、Web を可能にする技術インフラストラクチャです。最も基本的なインターネットは、一斉に通信するコンピューターの大規模なネットワークです。

「インターネットの仕組み」の詳細ビデオ

Web の基礎: 2024 年の Web の構成要素に関するガイド

ウェブは劇的に進化しましたが、その中心となる原則は、デジタル世界を理解し、構築しようとしている人にとって依然として不可欠です。このガイドでは、基本的な定義から最新のオンライン エクスペリエンスを強化するテクノロジーに至るまで、Web の基本的な概念を詳しく説明します。

1. World Wide Web (WWW): 相互接続された情報システム

ワールド・ワイド・ウェブは、単にウェブと呼ばれることも多く、相互にリンクされた文書やリソースからなる広大なシステムであり、インターネットを介してアクセスされます。基盤となるネットワーク インフラストラクチャ)。これは、情報が世界中で共有され、アクセスされる巨大な図書館と考えてください。

  • 主要コンポーネント:
    • リソース: これらは、Web ページ、ドキュメント、画像、ビデオ、その他のデジタル コンテンツといった Web の構成要素です。
    • URL (Uniform Resource Locators): Web ページの住所など、各リソースを識別する一意のアドレス (例: https://www.example.com/about)。
    • HTTP/HTTPS (ハイパーテキスト転送プロトコル): Web ブラウザーとサーバーが情報を交換する方法を管理する通信ルール (プロトコル)。 HTTPS は、暗号化を通じてセキュリティ層を追加します。
    • Web サーバー: Web リソースを保存および提供するコンピューター。
    • Web ブラウザ: ユーザーが Web リソースにアクセスして操作できるようにするソフトウェア アプリケーション (Chrome、Firefox、または Edge など)。

2. Web ページ、Web サイト、Web アプリ: 違いを理解する

  • Web ページ: 通常は HTML で記述され、テキスト、画像、ビデオ、その他のメディアを表示できる単一のドキュメント。
  • Web サイト: 関連する Web ページのコレクション。通常は単一のドメイン名でリンクされています。複数の章からなる本と考えてください。
  • Web アプリ (Web アプリケーション): デスクトップまたはモバイル アプリケーションと同様の機能を提供する、よりインタラクティブで動的なタイプの Web サイト。例には、Gmail、Google ドキュメント、および多くの最新のソーシャル メディア プラットフォームが含まれます。 Web アプリは多くの場合、JavaScript フレームワークや API などの高度なテクノロジーを活用して、豊かなユーザー エクスペリエンスを提供します。

3. Web ページの構築: HTML、CSS、JavaScript の 3 要素

Web ページの作成には、次の 3 つのコア テクノロジーが必要です:

  • HTML (ハイパーテキスト マークアップ言語): 基礎。 HTML は Web ページの構造とコンテンツを提供し、見出し、段落、画像、リンクなどの要素を定義します。まるで建物の骨組みのようです
  • CSS (カスケード スタイル シート): スタイリスト。 CSS は、Web ページのプレゼンテーションと外観を制御し、色、フォント、レイアウト、応答性 (ページがさまざまな画面サイズにどのように適応するか) などの側面を処理します。それは建物のインテリアデザインや装飾のようなものです。
  • JavaScript: 頭脳。 JavaScript は、Web ページに対話性と動的な動作を追加します。これにより、フォーム検証、アニメーション、インタラクティブなマップなどが可能になります。これは建物の電気配線やスマート ホーム機能のようなもので、建物を機能的かつ動的にします。

4. Web ブラウザ: Web への窓口

Web ブラウザは、World Wide Web へのアクセスと対話を可能にする重要なソフトウェア アプリケーションです。 2024 年に人気のあるブラウザは次のとおりです:

  • Google Chrome
  • Mozilla Firefox
  • Microsoft Edge
  • サファリ
  • 勇敢
  • オペラ

ブラウザの仕組み: URL を入力すると、ブラウザはそのリソースをホストしている Web サーバーにリクエストを送信します。サーバーは必要なファイル (HTML、CSS、JavaScript、画像など) を送り返し、ブラウザーはこれらのファイルを解釈して、デバイス上に Web ページをレンダリング (表示) します。

5. サーバー: Web の原動力

サーバーは、Web リソースを保存、処理し、クライアント (Web ブラウザーなど) に配信する特殊なコンピューターです。サーバーにはさまざまな種類があり、それぞれに特定の役割があります:

  • Web サーバー: Web ページおよびその他の Web コンテンツを提供するように設計されています。一般的な Web サーバー ソフトウェアには、Apache、Nginx、Microsoft IIS などがあります。これらは、HTTP/HTTPS 経由でリクエストを処理し、データベースと対話し、リクエストされたリソースを配信します。
  • メールサーバー: 電子メールの送信、受信、およびルーティングを処理します。 SMTP (Simple Mail Transfer Protocol)、POP3 (Post Office Protocol version 3)、IMAP (Internet Message Access Protocol) などのプロトコルを使用します。
  • ファイル サーバー: ユーザーがネットワーク経由でファイルを保存、アクセス、管理できるようにします。多くの場合、FTP (ファイル転送プロトコル) または SFTP (セキュア ファイル転送プロトコル) が使用されます。

6. データベース: Web 情報の整理

データベースは、情報の保存、取得、管理、更新を容易にする、組織化されたデータのコレクションです。これらは、ほとんどの動的な Web サイトや Web アプリケーションにとって非常に重要です。

  • リレーショナル データベース (SQL): 行と列を持つテーブルにデータを格納し、テーブル間の関係を確立します。これらは構造化データに最適であり、データ操作に SQL (構造化照会言語) を使用します。例: MySQL、PostgreSQL、Oracle、SQL Server。
  • 非リレーショナル データベース (NoSQL): ドキュメント、キーと値のペア、グラフなどのより柔軟な形式でデータを保存します。これらは、大量の非構造化データまたは半構造化データに適しています。例: MongoDB、Cassandra、Redis、Couchbase。

7. クライアントサーバーアーキテクチャ: Web インタラクションの基礎

Web は基本的に クライアント/サーバー アーキテクチャ で動作します。

  • クライアント: Web ブラウザー、リソースを要求しています。
  • サーバー: リソースを保存および配信するコンピューター。

ブラウザは、以下を使用して受信したデータを解釈します。

  • DOM (ドキュメント オブジェクト モデル) インタプリタ: HTML 構造を解析します。
  • CSS インタープリター: CSS で定義されたスタイルを適用します。
  • JavaScript エンジン: JavaScript コードを実行して対話性を追加します。

8. Web 開発の種類: フロントエンド、バックエンド、フルスタック

Web 開発は通常、次の 3 つの主要な領域に分かれています。

  • フロントエンド開発: ユーザー インターフェイス (UI) とユーザー エクスペリエンス (UX)、つまりユーザーがブラウザーで直接表示し操作するすべてのものに焦点を当てます。フロントエンド開発者は、HTML、CSS、JavaScript を使用し、多くの場合、React、Angular、Vue.js などのフレームワークを使用します。
  • バックエンド開発: フロントエンドを強化するサーバー側のロジック、データベース、API を扱います。バックエンド開発者は、Python、Java、Node.js、PHP、Ruby などのサーバーサイド言語とデータベース テクノロジーを使用します。
  • フルスタック開発: フロントエンド開発とバックエンド開発の両方が含まれます。フルスタック開発者はさまざまなテクノロジーに精通しており、Web アプリケーションのあらゆる側面に取り組むことができます。一般的なフルスタックの組み合わせには、MERN (MongoDB、Express.js、React、Node.js)、MEAN (MongoDB、Express.js、Angular、Node.js) などが含まれます。

9. Web ホスティング: Web サイトをアクセスしやすくする

Web ホスティング は、Web サイトまたは Web アプリケーションにインターネット上のユーザーがアクセスできるようにするサービスです。 Web ホスティング プロバイダーは、Web サイトのファイルを保存し、24 時間年中無休で利用できるようにするためのスペースをサーバー (データ センター) 上に提供します。一般的なホスティング オプションには、共有ホスティング、VPS ホスティング、専用サーバー、クラウド ホスティングなどがあります。

お時間をいただきありがとうございます。

以上がWeb の構成要素 5の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:dev.to
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート