Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【ITニュース解説】Supriya R

2026年09月15日に「Dev.to」が公開したITニュース「Supriya R」について初心者にもわかりやすく解説しています。

作成日: 更新日:

ITニュース概要

個人のポートフォリオサイトをAWSのS3とCloudFrontで公開した。S3にサイトファイルを保存し、CloudFrontのCDN機能で高速かつ効率的にユーザーへコンテンツを配信。これにより、クラウドでの静的サイト構築と配信の仕組みを実践的に学んだ。

出典: Supriya R | Dev.to公開日:

ITニュース解説

ある開発者が、自身の作成したポートフォリオウェブサイトをインターネット上に公開するため、Amazon Web Services(AWS)というクラウドサービスを利用した事例について解説する。このプロジェクトの目的は、作成したウェブサイトを安全かつ効率的に、世界中の誰もが見られるようにすることだった。具体的には、Amazon S3とAmazon CloudFrontという二つのAWSサービスを組み合わせて実現している。

ウェブサイトには大きく分けて二つの種類がある。一つは、データベースと連携して動的に内容が変化する「動的ウェブサイト」、もう一つは、あらかじめ用意されたHTMLやCSS、画像ファイルなどをそのまま表示する「静的ウェブサイト」だ。この開発者のポートフォリオウェブサイトは、後者の静的ウェブサイトに分類される。静的ウェブサイトは、情報を変更しない限り内容が変わらないため、専用のウェブサーバーを常に稼働させておく必要がなく、よりシンプルかつ低コストで運用できるという特徴がある。

まず、ウェブサイトのファイルを保存し、インターネットを通じて公開するために利用されたのがAmazon S3(Simple Storage Service)である。S3は、AWSが提供するストレージサービスで、ファイルを「バケット」と呼ばれる仮想的な入れ物に保存する。このバケットは、インターネット上の住所のようなもので、世界中で一意の名前が付けられる。開発者は自分のウェブサイトのファイルを保存するために、「supriya-2403717674422053」という名前のS3バケットを作成し、ウェブサイトのメインファイルである「index.html」をはじめとするすべてのファイルをそこにアップロードした。S3の便利な点は、ウェブサイトのファイルをバケットにアップロードするだけで、特別な設定なしに静的ウェブサイトとして公開できる機能を持っていることだ。これにより、従来のウェブサーバーを自分で構築・管理する手間を省き、非常に手軽にウェブサイトをホスティングできる。

S3にウェブサイトを置くだけでも公開は可能だが、さらにウェブサイトを高速に、そして安定して配信するためにAmazon CloudFrontが導入された。CloudFrontは、コンテンツデリバリネットワーク(CDN)と呼ばれるサービスの一種で、ウェブサイトのコンテンツを世界中に分散配置されたサーバー(「エッジロケーション」と呼ばれる)にキャッシュ(一時的に保存)することで、ユーザーからのアクセスに対して最も近いエッジロケーションからコンテンツを配信する仕組みを提供している。これにより、ユーザーがどこにいても、ウェブサイトの読み込み速度が大幅に向上し、待ち時間(「レイテンシ」と呼ばれる)が短縮される。

開発者は、CloudFrontの「ディストリビューション」を作成し、「portfolio」という名前を付けた。そして、このCloudFrontディストリビューションがどこからウェブサイトのコンテンツを取得するか、その「オリジン」として先ほど作成したS3バケットを設定した。この設定により、CloudFrontはS3バケットに保存されているウェブサイトのファイルを、自身のネットワークを通じてユーザーに届けることができるようになる。

最終的なウェブサイトの配信の流れは以下のようになる。ユーザーがウェブブラウザで開発者のポートフォリオサイトにアクセスしようとすると、そのリクエストはまずCloudFrontが受け取る。CloudFrontは、自分のエッジロケーションにそのウェブサイトのコンテンツがキャッシュされているかを確認し、もしあればそこから直接ユーザーにコンテンツを配信する。もしキャッシュがなければ、S3バケット(オリジン)からコンテンツを取得し、それをユーザーに配信すると同時に、将来の高速配信のためにエッジロケーションにキャッシュとして保存する。この仕組みにより、多くのユーザーが同時にアクセスしても、ウェブサイトは常に高速で安定して表示されることが期待できる。

このプロジェクトを通じて、開発者はAWSを使ったクラウドデプロイメントの実際を体験した。ローカルで開発したウェブサイトを、AWSのインフラストラクチャに乗せて世界に公開する一連のプロセスを学ぶことができたのは大きな成果だ。具体的には、S3バケットの作成と設定、静的ウェブサイトファイルのアップロードとホスティング、CloudFrontディストリビューションの作成、S3バケットをオリジンとして設定する方法、そしてCDNを通じてウェブサイトコンテンツを配信する仕組みについて実践的な知識を得ることができた。

このように、Amazon S3とCloudFrontを組み合わせることで、開発者はシンプルな静的ウェブサイトを、高可用性かつ高速な状態で世界中に公開することが可能になる。これは、ウェブサイトの公開を考えているシステムエンジニアの初心者にとって、非常に実践的で有効な方法の一つと言えるだろう。クラウドサービスの基本的な概念と、具体的なウェブサイトのデプロイ方法を学ぶ上で、この経験は貴重な第一歩となるはずだ。

関連コンテンツ

関連IT用語