0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

AWSの勉強 Day1 EC2の作成し、HTMLを公開する

0
Last updated at Posted at 2026-06-29

今年(2026年4月)に新卒として入社し、クラウド系の部署に配属されました。

AWSを学ぶ中で、「ただ手を動かすだけで終わらせず、自分の言葉で整理して知識として定着させたい」と思い、この学習記録を書くことにしました。

この記事は、AWS初心者である自分が学んだことや、つまずいたポイント、理解したことをまとめた備忘録です。

同じようにAWSを学び始めた方の参考にもなれば嬉しいです。

目次

VPCとは

VPCとはAWS上の自分専用の街のようなもの(正確にはネットワーク)
ここにサーバやいろいろな機能を設置していくことでオリジナルの環境を構築できる。

image.png
こんな感じでAWS上にはたくさんの街(VPC)がある。

VPCの作成

上部の検索バーから「VPC」と検索し、「VPCを作成」から作成する。
作成は、「VPCのみ」でよい。
「VPCなど」を選ぶと後ほど自分で設定して作成する他の機能まで自動で作成されてしまうためである。
名前タグとIPv4 CIRDをそれぞれ入力する。
名前は何でもよく(my-vpcや○○-vpcなど)、CIDRは「10.0.0.0/8」「172.16.0.0/12」「192.168.0.0/16」の範囲から選択する。今回は 172.16.0.0/16 をVPCのCIDRとして設定する。
それぞれの違いはこの先で割り当てられるIPアドレスの量が変わる。(左から右にかけて割り当てられる量は少なくなる)

「VPCのみ」の選択、名前タグとIPv4 CIRDの入力が終われば、そのまま右下の「VPCを作成」を押せば作成完了。
これで自分だけの
image.png

サブネットとインターネットゲートウェイの作成

サブネットとは先ほど作った街をさらに区画分けするイメージ。

image.png

パブリックサブネットとプライベートサブネットがあり、文字通り誰でも中を見ることができるのか、できないのかの違いがある。今回のHTMLを表示するだけであればだれが見ても問題ないので、パブリックサブネットのみを作成する。
VPCのダッシュボードからサブネットを選択し、右上の「サブネットを作成」を押す。
VPCは先ほど作成したものを選択する。

image.png

選択するとサブネットの設定ができるようになるので、サブネット名を付け、アベイラビリティゾーンを選択する。
アベイラビリティゾーンとはサブネットの保存場所。1a,1b,1cどれも機能に違いはない。わかりやすいよう、最初は1aを選択しておくのが無難。
IPv4 VPC CIRD ブロックは自動で入力されている。
IPv4 サブネット CIRD ブロックには、IPv4 VPC CIRD ブロックの左から3つ目のゼロを好きな数字に変える。(1にするのが無難)
これが区画番号になる。例:VPC 172.16.0.0/16であればサブネットは172.16.1.0/16にする。
すべて入力できたら作成を押す。

image.png

続いてインターネットゲートウェイの作成
インターネットゲートウェイとは街の入り口のイメージ。インターネットから来た通信をここでキャッチする。
VPCのダッシュボードからインターネットゲートウェイを選択し、右上の「インターネットゲートウェイを作成」を押す。
これは名前を付けるだけで作成完了。
その後作成したインターネットゲートウェイをVPCにアタッチする必要がある。どの街の入り口とするかを決める。
作成後、アクションから「VPCにアタッチ」を選択。

image.png

作成したVPCを選択して「インターネットゲートウェイのアタッチ」を押せばアタッチ完了。

image.png

EC2とは

EC2とはVPC上のマンション(仮想サーバー、ほぼPC)を建てることができるサービスである。
建ったマンションのことをインスタンスという。
この仮想サーバにいろいろな機能を盛り込んでいくこと(マンションに部屋を作ること)で、HTMLを表示したり、WEBアプリを動かしたりする。

image.png

EC2インスタンスの作成

上部の検索バーから「EC2」と検索し、左のダッシュボードから「インスタンス」を選択する。
インスタンスに移動出来たら「インスタンスを起動」を押す。
名前は何でもよく、OSを選択する。
今回はLinuxを選択。理由はWebサーバーやSpring Bootなどのアプリケーションを動かすのに適しているため。
image.png

続いてインスタンスタイプの選択とキーペアの選択
インスタンスタイプとは、作成するインスタンスの性能のことで、今回はそこまで高性能である必要はないため、「t3.micro」を選択。
キーペアとは、今後自宅のPCから遠くにあるインスタンス(サーバ)にアクセスする鍵のこと。これがないとせっかく作ったサーバに何もできなくなる。
「新しいキーペアの作成」から名前だけ決めて、残りはデフォルトのまま作成すればよい。
後ほど保存場所が大事になるので保存場所はしっかり覚えておくこと。

image.png

次にネットワーク設定。右上にある設定を押し以下が入力できるようにする。
自分で作成したVPCとサブネットを選択。
セキュリティグループ名と説明を入力する。(これもなんでもいい)
image.png

セキュリティグループを決めたら少し下に行き、インバウンドセキュリティグループのルールの設定を行う。
タイプは「ssh」と「HTTP」。sshは今作成しているインスタンスにファイルの作成や読み書き、削除など操作を行う通信のこと。HTTPはインスタンス内のファイルを読み込むときの通信。
ソースタイプは「自分のIP」、「カスタム」を選択。HTTPの方だけソースを選択する必要があり、「0.0.0.0/0」を選択。
これができたらインスタンスを起動する。

image.png

これでAWS上にLinuxのサーバーを立ち上げることができた!

HTMLを公開する

※ここからはLinuxの操作メインになる。
Windows PowerShellを起動し、先ほどペアキーを保存した場所に移動する。
今回はダウンロードフォルダーにあるため移動する。

#ダウンロードに移動
cd Downloads

ペアキーのある場所まで移動できたら、EC2インスタンスと接続する。
xx.xx.xx.xxには接続するインスタンスのパブリック IPv4 アドレスを入れる

#インスタンスに接続
ssh -i ".\ペアキーの名前.pem" ec2-user@xx.xx.xx.xx
   ,     #_
   ~\_  ####_        Amazon Linux 2023
  ~~  \_#####\
  ~~     \###|
  ~~       \#/ ___   https://aws.amazon.com/linux/amazon-linux-2023
   ~~       V~' '->
    ~~~         /
      ~~._.   _/
         _/ _/
       _/m/'

が出れば接続成功

しかしこのままだと接続したインスタンスはなんの機能もないので、Apacheをインストールして起動させる。
ApacheとはWebサーバーソフトウェア。

# Apacheのインストール
sudo dnf install -y httpd
# Apacheの起動
sudo systemctl start httpd

最後に所定の場所にHTMLを作成する
Apacheは/var/www/html内にあるindex.htmlを表示するため、/var/www/htmlに移動しindex.htmlを作成する。

#/var/www/htmlに移動
cd /var/www/html/
#/var/www/htmlにindex.htmlを作成
echo "<h1>Hello AWS!</h1>" | sudo tee /var/www/html/index.html

これで、http://パブリック IPv4 アドレス にアクセスするとindex.htmlが表示される。
今回はセキュリティの設定をしていないのでhttp

image.png

無事表示された!

まとめ

VPC・サブネット・Internet Gatewayを作成してネットワークを構築した。
EC2インスタンスを作成し、SSHで接続した。
ApacheをインストールしてWebサーバーを構築した。
index.html を配置し、ブラウザからHTMLを表示できることを確認した。

補足

EC2 Instance Connectを使ってブラウザでPowerShellと同じ操作ができる機能があるが、EC2 Instance Connectを仲介してインスタンスに接続するため(インスタンスが受け取るIPが自分のIPではなくEC2 Instance ConnectのIPになっていしまう)、sshが自分のIPのみの状態だとインスタンスに接続できないことが分かった。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?