これは個人的なものです。 それは何気ない金曜日の夕方で、私には「単純な」目標がありました。それは、  ドメインを使用して で静的ウェブサイトをホストすることです。つまり、それはどれほど難しいことでしょうか？ 10 の記事、4 つのチュートリアル、2 つのビデオ、そしてインターネットが提供するものすべてを試すのに丸 1 日かかったということを考えると、かなりの成果だと思われます。 GoDaddy AWS S3 でも心配しないでください。あなたの旅はずっとスムーズになるでしょう。最初の基本的なステップ、つまり、キャッチーなドメインを獲得することから始めて、一緒にこの冒険に乗り出しましょう。 コンテンツの概要 GoDaddy: インターネット パイの一部を確保! アマゾン ウェブ サービス: ウェブサイトがファーストクラスで利用できる場所 GoDaddy ドメインを AWS S3 バケットに移行する ウェブマスター: ピカピカの新しいサイトのスムーズな更新 セレブレーションタイム: ライブです!   GoDaddy: インターネット パイの一部を確保!   (GoDaddy を使用して個人ドメインを取得して設定する方法を学びます。) そこで、あなたはウェブ上に独自の小さなコーナーを設立することにしました。これからのエキサイティングな時代！基本的な から始めましょう。 ドメインの取得 ステップ 1: ドメインを選択する まずは、あなた自身またはあなたのプロジェクトをよく表す、ユニークで記憶に残るドメイン名をブレインストーミングすることから始めます。短く、わかりやすく、綴りやすいものにしてください。いくつかのオプションを念頭に置いたら、GoDaddy の Web サイトにアクセスしてください。  ステップ 2: 検索して選択する GoDaddy のホームページで、希望のドメイン名を検索バーに入力します。第一希望が決まっても、がっかりする必要はありません。 GoDaddy は別の提案を提供するか、最初のアイデアのバリエーションを試すこともできます。利用可能な気に入ったドメインを見つけたら、  ボタンをクリックしてカートに追加します。  [Make it Yours] ステップ 3: カスタマイズとチェックアウト GoDaddy は、プライバシー保護や専門的な電子メール アドレス (<ユーザー名>@yourdomain) など、さまざまなアドオンやオプションを提供します。これらの製品を確認し、ニーズに合ったものを選択し、チェックアウトに進みます。取引を完了すると、ドメインがあなたのものになります。  ステップ 4: セットアップと構成 ドメインを取得したので、目的の URL に表示されるまでに、いくつかのセットアップ手順と変更が必要になる場合があります。ドメイン設定を構成し、ホスティングに接続し (これについては次に説明します)、起動に向けてすべてが最高の状態にあることを確認します。セットアップのこの部分では、ドメインの DNS レコードと転送ルールにアクセスします。  このようにして、GoDaddy でインターネット パイの一部を確保することに成功しました。デジタルの旅の次の段階である AWS S3 によるホスティングに今後も注目してください。 アマゾン ウェブ サービス: ウェブサイトがファーストクラスで利用できる場所 (アマゾン ウェブ サービスの S3 で Web サイトをホスティングする方法の紹介。) インターネットの大国へようこそ:  。ウェブが海だとしたら、AWS はその最強の船となるでしょう。今日、あなたはウェブサイトをスタイリッシュにホストするために乗り出します。  アマゾン ウェブ サービス (AWS) ステップ 1: AWS ランドスケープをナビゲートする AWS は広大で、初めて利用する人にとっては圧倒されるような無数のサービスがあります。既存の AWS アカウントにログインするか、新しいアカウントを作成します。 : 初めて AWS にログインすると、AWS マネジメント コンソールが表示されます。これは AWS サービスのコントロール センターなので、そのレイアウトを少し調べてみましょう。左上の「サービス」ドロップダウンに注目してください。これは、すべての AWS 製品の頼りになるハブです。  慣れる   : [サービス] ドロップダウンの下で、[ストレージ] カテゴリに [S3] がリストされています。 「S3」をクリックして S3 コンソールに入り、静的 Web サイトのホスティングを管理します。  S3 の検索 ステップ 2: S3 バケットの作成 バケットを Web サイトのストレージ ユニットとして考えてください。 「バケットの作成」ボタンをクリックします。ここで、バケットに名前を付けます (通常、わかりやすくするためにドメイン名と一致する必要がありますが、好きな名前を付けても問題ありません)、ターゲット ユーザーに最も近いリージョンを選択し、ここではデフォルト設定に従います。  : S3 コンソールで、青い「バケットの作成」ボタンをクリックします。バケット名の入力を求めるウィンドウが表示されます。一貫性を保つために、ドメインによく一致する名前を選択してください。 バケットに名前を付ける : 遅延を最小限に抑えるために、視聴者に近いリージョンを選択します。各地域は特定の地理的エリアに対応します。私個人としては、米国に拠点を置いており、AWS での SSL 認証プロセスに役立つため、常に米国東部リージョンを使用することを好みます (これについては次のセクションで詳しく説明します)。  リージョンの選択 : 多くの設定はデフォルトで問題ありませんが、各オプションに目を通して理解を深めてください。ここではあまり調整する必要はないと思われますが、慣れておくことは将来のトラブルシューティングや調整にとって重要です。 設定を確認する ステップ 3: バケットの構成 バケットの準備ができたら、いくつかの構成を行います。プロパティと権限を設定してバケットを公開し (デフォルトでは非公開であるため)、他のユーザーが Web サイトを閲覧できるようにします。また、ここで機能を有効にし、インデックスとエラー ドキュメントを指定することで、静的 Web サイト ホスティングを設定します。 : ユーザーがバケット ファイルにアクセスできるようにするには、「すべてのパブリック アクセスをブロック」のチェックを外します。アクセスを許可すると次のようになります。  パブリック アクセス設定 ステップ 4: コンテンツをアップロードして公開する すべての設定が完了したら、Web サイトのファイルをバケットにアップロードする準備が整いました。ドラッグ アンド ドロップするか、HTML、CSS、その他のファイルを S3 バケットに手動でアップロードするだけです。   : 静的 Web サイト ファイルを新しいバケットにアップロードします。これを行うには、AWS CLI を使用するか、[オブジェクト] タブの [アップロード] オプションを選択します。個人的には、常にアップロード オプションを使用します。  Web サイト ファイルのアップロード : バケットの [プロパティ] タブに移動し、[静的 Web サイト ホスティング] までスクロールします。 「編集」をクリックし、静的 Web サイトホスティングを有効にして、「インデックス」テキストフィールドにデフォルトのページ名 (通常は「index.html」) を入力します。変更を保存することを忘れないでください。  静的 Web サイト ホスティングの有効化 : [権限] タブに移動し、バケットポリシーを追加して、バケットへのパブリック読み取りアクセスを許可します (YOUR-BUCKET-NAME を変更し、以下に示すコードを追加します)。このポリシーでは、インターネット上の誰でもバケット内のオブジェクトを読み取ることができるため、データを公開してアクセスできるようにする必要があります。ポリシーを他の変更とともに保存する前に、必ずポリシーの権限を確認して理解してください。 パブリックアクセスの付与     { "Version": "2012-10-17", "Statement": [ { "Sid": "PublicReadGetObject", "Effect": "Allow", "Principal": "*", "Action": [ "s3:GetObject" ], "Resource": [ "arn:aws:s3:::YOUR-BUCKET-NAME/*" ] } ] } ステップ 5: ライブ サイトをテストする AWS は、ホストされているコンテンツに独自のエンドポイントを提供します。このリンクをクリックすると、すべてがうまくいけば、静的 Web サイトが生き生きと動作していることがわかります。 そして、それができました！ AWS への最初の降下は気が遠くなるように思えるかもしれませんが、これらの手順を実行すると、着陸しただけでなく、拠点を設定したことになります。次の冒険の準備はできていますか?次のセクションでは、ライブ配信について詳しく説明します。  ついに完了: サイトが公開されました!   (Web サイトを正常にホストし、実際に稼働するまでの手順を説明します。) おめでとうございます。もうすぐです!次に、ピカピカの新しい GoDaddy ドメインを、細心の注意を払って設定した AWS S3 バケットに指定して、すべてをバインドしましょう。  GoDaddy ドメインを AWS S3 バケットに移行する ステップ 1: AWS ACM を使用して SSL 証明書を取得する AWS 証明書マネージャー (ACM) を開きます。   「リクエスト」をクリックして新しい証明書を開始し、「パブリック証明書をリクエスト」を選択します。 ドメイン名を追加します —  および  。 www.your-domain.com your-domain.com  「DNS検証」を選択します。  証明書の作成後、ACM によって 2 つの CNAME レコードが生成されます。後で使用できるように、「CNAME 名」と「CNAME 値」の両方をコピーします。  ステップ 2: GoDaddy で DNS レコードを更新する GoDaddy アカウントにログインし、選択したドメインのドメイン設定に移動します。  「追加設定」の「DNS の管理」に進みます。  ACM によって提供される CNAME レコードを追加します。指定された両方の値セットに対してこの手順を繰り返します。  「タイプ」を「CNAME」に設定します。  「名前」は、ACM の「CNAME 名」から .   (この場合は _95c3d23b4c008dfcadeed5b518ed3d1d.www & _2bb2bfda7c66af8c036422465b415a8c になります)。 を省略したものです。 あなたのドメイン.com CNAME 名の一部  「値」は、ACM からの「CNAME 値」です（そのままコピー）。  「TTL」を「デフォルト」に設定します。  これらの変更が反映され、証明書が検証されるまでしばらく時間がかかります。  ステップ 3: AWS CloudFront ディストリビューションの作成 AWS で CloudFront コンソールを開きます。   「 」をクリックします。 ディストリビューションの作成  S3 バケット Web サイトの URL を「   」として入力します (自動提案されたリンクの使用は避けてください)。  Origin Domain  「   」で、「HTTP を HTTPS にリダイレクトする」を選択します。 Viewer Protocol Policy  「  で、「セキュリティ保護を有効にする」を選択します。 Web アプリケーション ファイアウォール (WAF)」  「 」の下で、優先する Web サイト URL (  と  ) の両方に「  」を追加します。 設定 www.your-domain.com your-domain.com 代替ドメイン名 (CNAME)  「 」で以前に作成した ACM 証明書を選択します。  カスタム SSL 証明書 ディストリビューションの作成プロセスを完了し、展開されるまで待ちます (通常は 5 ～ 10 分)。  ステップ 4: ドメインを CloudFront に向けて最終調整する 残念ながら、GoDaddy の標準 DNS サービスは、CloudFront への直接の ALIAS または ANAME レコードをサポートしていません。したがって、ベスト プラクティスは、www サブドメインの CNAME を設定してから、ルート ドメインを www サブドメインにリダイレクトすることです。 www の CNAME はすでにあるので、それを変更しましょう。   ディストリビューションの作成時に指定された、  のような CloudFront ドメイン名をメモします。 CloudFront ドメインの取得: dxxxxxxxxxxxxx.cloudfront.net  GoDaddy の標準 DNS は、ルートドメインの CloudFront を直接指す ALIAS または ANAME レコードをサポートしていません。これに対処するには、  サブドメインの CNAME を設定し、ルートを にリダイレクトします。 ルートドメインレコードの更新: www www     サブドメインの既存の CNAME レコードを変更します。 www の CNAME の調整: www タイプ: CNAME 名前:www データ: [CloudFront ドメイン名]  TTL: 1 時間 (お好みに応じて調整してください) トラフィックをルート ドメインから サブドメインにリダイレクトする転送を実装します。 ルート ドメイン転送の設定: www  GoDaddy のダッシュボードでドメインの DNS 管理に移動します。  「転送」セクションを見つけて、「ドメイン」転送を追加します。 転送先:  www.your-domain.com リダイレクトタイプ: 301 (永続) 設定: 転送のみ 既存の NS、SOA、および レコードを変更せずに維持します。 他のレコードの処理: _domainconnect これらの DNS 調整後、伝播にはしばらく時間がかかる場合があり、即時から数時間までかかる可能性があります。などのツールを活用する 伝播ステータスをグローバルに監視します。 伝播時間の考慮事項: DNSチェッカー 伝播が完了すると、  または にアクセスすると、ユーザーは HTTPS 経由で CloudFront でホストされているサイトに安全に誘導されます。  your-domain.com www.your-domain.com ウェブマスター: ピカピカの新しいサイトのスムーズな更新 (新しくホストされた Web サイトの更新と保守に関するガイド)。  AWS S3 でホストされている静的ウェブサイトの更新は簡単なプロセスです。サイトを最新の状態に保つには、次の手順に従ってください。 ステップ 1: AWS S3 へのアクセス AWS コンソールにログインします。  S3 サービスに移動します。  Web サイトをホストしているバケットを開きます。 ステップ 2: Web サイトのファイルを更新する 既存のファイルを更新するには: 置換するファイルに移動します。 同じ名前のファイルをアップロードしてこのファイルを上書きするか、既存のファイルを削除して新しいバージョンをアップロードします。 新しいファイルを追加するには、バケット内の関連ディレクトリにファイルをアップロードするだけです。 ステップ 3: ファイルのアクセス許可 (必要な場合) 新しいファイルをアップロードするときは、そのアクセス許可が正しく設定されていることを確認してください。 バケットがパブリックの場合、訪問者がアクセスできるように、通常は新しいファイルを「パブリック読み取り」に設定する必要があります。 ステップ 4: キャッシュのクリア (CloudFront を使用している場合) コンテンツ配信に AWS CloudFront を利用している場合は、キャッシュが原因で更新がすぐに反映されない可能性があることに注意してください。 更新されたコンテンツを表示するには、無効化を作成してキャッシュをクリアする必要がある場合があります。  CloudFront ディストリビューションに移動し、[無効化] タブに移動し、更新されたファイルのパスを入力して無効化を作成します (すべてのファイルを無効化するには を使用します)。 /* ステップ 5: テスト ファイルと設定を更新した後、Web サイトにアクセスして、変更が反映され、期待どおりに機能していることを確認します。 さまざまなデバイスやブラウザでテストして、互換性と適切な表示を確認します。 お祝いの時間: ライブです! デジタルの波をうまく乗り越えて、ピカピカの新しい Web サイトを立ち上げられたこと、おめでとうございます!仮想不動産が稼働し、世界中からの訪問者を安全かつ迅速に迎える準備が整いました。 この道のりは、一見気の遠くなるようなものですが、GoDaddy へのドメイン登録から、AWS S3 での安全な静的ウェブサイトのホスティング、さらにスピードとセキュリティ層を強化する CloudFront でのデプロイに至るまでの道のりでした。あなたの成功に乾杯! 🚀🎉

Walkthroughs, tutorials, guides, and tips. This story will teach you how to do something new or how to do something better.

Embarking on a Tech Odyssey: My Journey from ‘Horrible’ to ‘Less Horrible’

Read My Stories

このオーディオは、ストーリーの元の言語で制作されています。

ドメインのブリッジング:GoDaddy から AWS S3 にスタイリッシュに移行する方法!

About Author

コメント

ラベル

この記事は

Related Stories

デジタルノマドの皆さん、タイの新しい DTV ビザについて知っておくべきこと

AI/ML データレイクのリファレンスアーキテクチャを構築するためのアーキテクトガイド

18 種類の開発者ツールで生産性を向上しましょう 🚀🔥

AI の力を解き放つ。最先端技術の体系的レビュー: 概要と序論

デジタルノマドの皆さん、タイの新しい DTV ビザについて知っておくべきこと

AI/ML データレイクのリファレンスアーキテクチャを構築するためのアーキテクトガイド

18 種類の開発者ツールで生産性を向上しましょう 🚀🔥

AI の力を解き放つ。最先端技術の体系的レビュー: 概要と序論

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps