📑

広告付きWebサイトを作成し公開する手順の備忘録

に公開

概要

Webサイトを開発する!と言っても、Webページの作成だけでなく、Webページの配信設定、広告の設定といった作業も付きまとうため、特に初回のチャレンジだとイメージ沸かない部分も多く大変だと思います。

今回私も初めてのWeb開発を行ってみましたので、その備忘録を残しておきます。

手順

Webサイトを公開して広告収入を得るにはどんな手順が必要なんだろう?と気になったため一通り実践してみました。以下の工程を踏んでいます。

  1. claudeに相談しながら作りたいWebサイトと仕様を相談
  2. claude codeに仕様を投げてWebサイトを作成
  3. AWSをバックエンドとして公開設定
  4. 広告設定

Webページの開発

Webページを作成するための技術や知識にも興味はありますが、ここを深堀すると暫くWebサイトの公開までたどり着けない気がしたので、全てAIエージェントに任せました。

claude codeに5$課金で余裕でした。

Webページの公開設定

参考: S3×CloudFront×独自ドメインでHTTPS対応!S3静的サイトホスティングでサイトを公開してみる

Webサイトが静的ホスティングで済む構成ならこれが一番コスパ良いと思ってます。ドメインはRoute53内で購入すれば、ドメインサーバーの設定を省略できます。

広告設定

参考: 【図解】アドセンスの代わり「忍者AdMax」の登録方法と使い方。広告枠の作成方法から貼り付けまでのまとめ

ゲーム攻略サイトとかでよく見るような広告を設定できます。実はGoogle Adsenseにも審査を2度ほど依頼しましたが通る気配がなかったため忍者AdMaxを採用しました。

成果物

https://www.social-image-tool.com/

画像リサイズツールです。youtubeなどのSNSで使用できるサイズに一発変換可能です。類似サイトは沢山ありますが良ければ一度覗いてみてください。

https://github.com/good-name-cbl/social-image-tool

↑はGithubのリポジトリです。

Discussion