1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

どうも、主にRustNode.jsでバックエンド開発を行なっている奏です。
最近、Xのタイムラインを眺めていると「個人開発始めました」「バイブコーディングでサービス/ツールを作りました」などの投稿が増えたように思います。
そして、私は思いました。
今、始めたての開発者(AIだけも含む)が増えたということは初心者が多いいということ、
ウェブサイトのデプロイ方法がわからない人も多かったりするのでしょう。
というわけで、自前のサーバーを用意せずに完全無料でウェブサイトを公開する方法をいくつか書こうと思います。

GitHubPages

まずはGitubPagesです。これは皆様お馴染み、Gitを扱うサービス、GitHubのホスティングサービスです。

公開方法は結構簡単、まず、GitHubで新しいリポジトリ(既存リポジトリ)を開きます。
そしてリポジトリにhtmlファイルなどをコミットしましょう。
ディレクトリごとにルートにindex.htmlを配置すると自動的にホームページに設定されます。

ちなみに、ルートに404.htmlを配置すると、間違ったURLを指定された際に自動的に404のページが表示されます。

htmlやcss、jsが配置できると、リポジトリの設定を開きましょう。
設定の「Page」を開きます。
IMG_0007.jpeg
IMG_0008.jpeg
Build and deploymentと書かれているセクションのBranchの左側(画像ではNoneとなっている)ところをクリックし、main(またはメインブランチ)を選択し、その横にあるSaveをクリックします。

数分待てば、URLが表示され、正常に公開できます。

しかし、GitHubPagesは公開リポジトリのみでしかデプロイできないので、ソースコードを隠したいなら次のCloud flare Pageを使うのがおすすめです。

Cloud flarePage

次はDNSでお馴染み、クラウドフレアさんのサービスを使います。

画像が不足していますが何卒ご容赦ください。

クラウドフレアにログイン、またはアカウントを作成します。

ダッシュボードにログインできたら右上などに**+ボタンがあると思うので、それをクリックしPages**をクリックします。
PagesをクリックするとファイルをアップロードやGitHub、Gitlabなど選択できると思いますが、一番楽なものを選んでみてください。

ちなみに、GitHubやGitLabだと、公開ブランチにプッシュされると自動でデプロイされるのでおすすめです。

まとめ

GitHubを使っており、手軽さを求めるならGitHub Pages、速さなどを求めるならクラウドフレアPagesをお勧めします。

あ、ちなみにどちらも独自ドメインは設定できますが、設定方法はまた記事にするかもしれません。

1
1
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
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?