いきなりですが、AWS基盤で独自のwebサイトを作りたいと思っています。

HTMLやCSSなどフロントのコンテンツは別のサービスを使っていい感じに作るとして、AWSを使うメリットはバックエンドがいい感じにできることです。

登竜門となるのが、s3といったストレージサービスに格納したファイルをいかにしてCloudFrontに乗っけるのか、という部分になると思います。

雑なイメージですが、AWSであれば以下のような構成にすることでいい感じに作れます。

詳しい作り方は、ぜひAWS公式のハンズオンなどを見てみてください。

個人的にハマリポイントがいくつかあったので、そういった点について備忘録として乗っけます。

うまく設定しないと、URLにアクセスしても「AccessDenied」のページとなってしまいます。

CloudFrontには、s3パケットのHTMLファイルURLをそのままコピペしてもうまくいかない

以下のように、s3にindex.htmlをインポートした後、オブジェクトURLをCloudFrontに貼り付けると思います。

そのやり方では上手く行かなくて、CloudFrontのOriginには以下の形式でDomain nameを登録する必要があります。
{your-bucket-name}.s3-website-{your-bucket-region}.amazonaws.com

Orign Pathにも、/index.htmlを登録する必要はありません。

Origin IDは特に変える必要はありません。

s3の権限は特にいじる必要はない

公開設定がうんぬん、などありますが、特に権限周りは変えなくてもうまくいきました。

わからなければ公開設定にして、成功次第絞るやり方でよいと思われます。