GitLab Pagesの使い方｜無料でホームページを作成

GitLabで無料でページを公開できたので紹介します。

htmlなどの静的コンテンツを作成し、独自ドメインを設定して公開するところまで、全て無料で出来ます。
公開するためのサーバーの準備なども必要ありません。

そもそもGitLabとは

GitLab（ギットラボ）とは、Gitリポジトリ管理ソフトウェアです。

Gitリポジトリ管理では、GitHubが一番有名でしょうか。
なんだか、同じような名前で同じようなスペルで、どっちがどっちだか分からなくなりそうです。笑

GitLabはプライベートリポジトリが無料

これは大きいですね。
GitHubではプライベートリポジトリで非公開にしたい場合は有料になります。

ポートフォリオとしてソースを公開するなら良いのですが、個人ではなく企業で使う場合とか、開発途中のものは非公開にしたいので、無料でできるのは大変助かります。

自前のサーバーが利用可能

セキュリティや情報管理の観点から、自前でサーバーを用意して、GitLabの環境を作ることが可能です。

サーバーを用意して一から環境を作るというのは手間が掛かりますが、セキュリティもしっかり考えられるというのは、構築の選択肢が広がるので良いと思います。

自前でサーバーにGitLabを構築するのが面倒という場合には、GitLabのサーバー上で利用できる「GitLab.com」というサービスもあります。
https://gitlab.com/

今回の記事も、「GitLab.com」を使用して書いています。

GitLab Pages とは

GitLab 上にウェブサイトを公開できるサービスで、以下のような特徴があります。

• 無料で利用できる
• httpsに対応している
• 静的なサイトを作成できる

作成する手順

静的コンテンツを作成し、master にプッシュ

GitLab.comのページで、リポジトリを作成し、クローンします。
各種、静的コンテンツ（html、css、javascript）を作成します。

設定用の「.gitlab-ci.yml」を作成

以下の内容で作成します。

pages:
  stage: deploy
  script:
  - mkdir .public
  - cp -r * .public
  - mv .public public
  artifacts:
  paths:
  - public
  only:
  - master

master にプッシュすると自動的にデプロイする、という設定です。
public というパスは GitLab Pages の内部のものなので、public ディレクトリを作成する必要はありません。

ファイルが作成できたら、作成したコンテンツを含めて、masterにプッシュします。

デプロイ確認

デプロイの確認は、GitLab.comのページで、CI / CD ⇒ Pipelines から確認できます。



master にプッシュすると、画面に [running] の行が追加されます。
しばらく待つとデプロイが完了し、Status が [passed] になります。

デプロイしたページの URL は Settings ⇒ Pages で確認できます。
https://[ユーザー名].gitlab.io/[プロジェクト名] がページの URL となります。

ページ表示で404エラーが発生した場合

初めてのデプロイでは、実際に公開されるまで15分ほど時間が掛かるようです。
実際にデプロイ完了後、すぐにページを表示してみたところ、404エラーが発生しました。

15分ほど経過後は、404エラーも解消して正常にページが表示できました。

独自ドメインの設定

独自ドメインを設定することも可能です。
以下の記事に書いています。

2019.07.04

Cloudflareを使用してGitLab Pagesで独自ドメインを設定する

GitLab Pagesで独自ドメインを設定していきます。 前回の記事でGitLab Pagesを使用して、ページを公開するところまでいきました。 ページを公開した状態では、URLが「https://xxxxxx....

ベルトトルト

早いものでSE15年。
Javaとか得意です。でも最近はいろいろやってます。

好きなことはスポーツ、読書、食べること、カラオケ、競馬、謎解き、スイーツなどなど。
好きなことでサービスやアプリを作りたいと思う今日この頃です。

あと、身長を伸ばしたい。