Skip to content

GitLab Pagesの使い方紹介!ウェブサイトを公開する手順まとめ

GitLab.com では、「Repository」などでファイルの中身を見ることができます。

このときファイルを開くとソースが表示されますが、HTML ファイルなどは「ソースではなくウェブページとして表示してほしい」というときがあるかもしれません。

そんなときには、これから紹介する GitLab Pages が役に立ちます。

GitLab Pages とは

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

  • プロジェクト、ユーザー、グループごとのサイトを作成できる
  • 無料で利用できる
  • httpsに対応している
  • 静的なサイトを作成できる
  • 静的サイトジェネレータを利用できる

この記事では、プロジェクトのリポジトリをそのまま静的なウェブサイトとして公開する方法について紹介します。

使い方

使い方はもちろん公式サイトにも掲載されているので、詳しくはそちらをご覧ください。

公式ドキュメント
GitLab Pages documentation – GitLab Documentation

チュートリアル
Hosting on GitLab.com with GitLab Pages | GitLab

この先は、詳しいことは置いておいてとにかくすぐに公開したい、という方に向けた内容になっています。

実際にやることは、設定用の .gitlab-ci.yml をルートディレクトリに作成し、それを origin/master にプッシュするだけです。

リポジトリをそのまま公開する場合、「Hosting on GitLab.com with GitLab Pages | GitLab」にも掲載されているものですが、以下の .gitlab-ci.yml がそのまま使えます。

master にプッシュするたびにデプロイする、という設定が書かれています。public というパスは GitLab Pages の内部のものなので、リポジトリに public ディレクトリを作成しておく必要はありません。

動作確認

デプロイ処理の実行状態は、Pipelines > Pipelines > All から確認できます。

origin/master にプッシュすると、画面に [running] のログが追加されます。そのまましばらく待機しているとスクリプトの実行が完了し、Status が [passed] に変化します。

デプロイしたページの URL は Settings > Pages で確認できます。

https://[ユーザー名].gitlab.io/[プロジェクト名] がページの URL です。

注意点

GitLab Pages では、ドメインの下にプロジェクトごとのディレクトリが作成され、その中にソースが展開されます。そのため、ルート相対パスを使っている場合、ローカルの開発環境によってはパスがつながらなくなる恐れがあるので注意が必要です。

Comments are closed.