GitLab Pagesの使い方|無料でホームページを作成
GitLabで無料でページを公開する方法を紹介します。
HTMLやCSSで静的コンテンツを作成し、独自ドメインを設定して公開するところまで、全て無料で出来ます。
公開するためのサーバーの準備なども必要ありません。
ページを公開したい時に、サーバーの準備などが必要なく、どれだけ簡単に公開できるかという点は非常に重要だと思います。
そもそもGitLabとは
GitLab(ギットラボ)とは、Gitリポジトリ管理ソフトウェアです。
Gitリポジトリ管理では、GitHubが一番有名でしょうか。
なんだか、同じような名前で同じようなスペルで、どっちがどっちだか分からなくなりそうです。笑
GitLabはプライベートリポジトリが無料
これは大きいですね。
GitHubではプライベートリポジトリで非公開にしたい場合は有料になります。
ポートフォリオとしてソースを公開するなら良いのですが、個人ではなく企業で使う場合とか、開発途中のものは非公開にしたいので、無料でできるのは大変助かります。
自前のサーバーが利用可能
セキュリティや情報管理の観点から、自前でサーバーを用意して、GitLabの環境を作ることが可能です。
サーバーを用意して一から環境を作るというのは手間が掛かりますが、セキュリティもしっかり考えられるというのは、構築の選択肢が広がるので良いと思います。
自前でサーバーにGitLabを構築するのが面倒という場合には、GitLabのサーバー上で利用できる「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エラーも解消して正常にページが表示できました。
独自ドメインの設定
独自ドメインを設定することも可能です。
以下の記事に書いています。
↓ベルトトルトは、こういうお悩み系の記事書いてますので、ご覧ください。
https://boost-on.net/author/bertolt
以下、参考まで。
公式ドキュメント(英語) https://docs.gitlab.com/ee/user/project/pages/
チュートリアル https://about.gitlab.com/2016/04/07/gitlab-pages-setup/
早いものでSE15年。
Javaとか得意です。でも最近はいろいろやってます。
好きなことはスポーツ、読書、食べること、カラオケ、競馬、謎解き、スイーツなどなど。
好きなことでサービスやアプリを作りたいと思う今日この頃です。
あと、身長を伸ばしたい。
コメント ( 0 )
トラックバックは利用できません。
この記事へのコメントはありません。