最近GitHubからBitbucketに移行しましたが、GitHub Pagesを使ってホストしていたサイトを除けば、比較的スムーズに移行できました。BitbucketはGitHubと同様の機能を提供していますが、GitHubには一部の追加機能は含まれていません。ここでは、Bitbucketで基本的なウェブサイトをホスティングし、この機能を活用する方法を簡単にご紹介します。
名前の通りだ
私にとってBitbucketの最大の魅力は、リポジトリ数ではなく、プロジェクトに参加しているユーザー数やチームメンバー数に基づいて課金されるという点です。とはいえ、Bitbucketリポジトリは必要な数だけ作成でき、費用は発生しません。Bitbucketで静的ウェブサイトをホスティングするのは、新しいリポジトリを設定し、必要なファイルやコンテンツを追加するだけです。
リポジトリ作成のポイントは、ユーザー名と一致する名前を設定することです。この名前はbitbucket.orgの文字列の先頭に追加され、リポジトリ名として使用されます。例えば、私のウェブサイトのリポジトリは、アカウント名がaspatton01であるため、aspatton01.bitbucket.orgという名前になっています。Bitbucketでリポジトリを作成したら、クローンを作成し、必要なファイルを追加して、変更内容をBitbucketにプッシュできます。私のサイトでは、リポジトリと同じ名前のローカルディレクトリを作成しました。このディレクトリでGITが初期化され、Bitbucket.orgリポジトリにリンクされます。
git init
git remote add origin https://username:[email protected]/username/username.bitbucket.org.git
ローカルにリポジトリを設定したら、ファイルを追加してサイトを立ち上げることができます。例えば、デフォルトのホームページであるindex.htmlファイルを追加します。ローカルディレクトリに追加したら、gitコマンドを使ってBitbucket.orgリポジトリにプッシュできます。まずファイルを追加し、次にコミットします。コミットが完了すると、オンラインリポジトリにプッシュされます。
- git add . — これにより、すべてのファイルがリポジトリに追加されます。
- git commit -m 'Comment' — リポジトリへの変更をコミットします。
- git push -u origin master — 現在のマスター ブランチのすべての変更をオンライン リポジトリに送信します。
別のコンピュータに移動してリポジトリを操作したい場合は、git cloneコマンドを使ってローカルコピーを作成できます。リポジトリの正確な構文はBitbucketサイト（図A ）から簡単に取得できます。ポイントアンドクリック式のインターフェースを好む場合は、SourceTree（図B ）などのGitクライアントを使用できます。
git clone https://username:[email protected]/username/username.bitbucket.org.git
図A
Bitbucket インターフェースを使用すると、クローン コマンドに簡単にアクセスできます。
図B
SourceTree クライアントで Web サイト リポジトリを操作します。
Bitbucket でホストされるサイトの主な特徴は、静的であること、つまり PHP などの言語による動的コンテンツがないことです。静的サイトだからといって、CSS や JavaScript などの Web 標準を使用して機能を拡張できるため、見栄えが悪いというわけではありません。例えば、Bootstrap フレームワークをリポジトリに簡単に追加して、サイトの見た目と機能を強化できます。Bootstrap ファイルをダウンロードしてローカルリポジトリに追加し、Bitbucket でホストされるサイトにプッシュするだけです。以下のコマンドでこのタスクを実行できます。
git add .
git commit âm âBootstrapâ
git push âu origin master
図Cは、 Atomで読み込まれたローカルリポジトリディレクトリとホームページが開いている状態を示しています。図Dは、 Internet Explorerで開いたサイトを示しています。
図C
Atom でローカル リポジトリを操作する。
図D
Internet Explorer で開いた Bitbucket サイト。
静的コンテンツの生成
GitHub Pages を強力にしている重要な機能の一つは、静的ウェブサイトジェネレーターである Jekyll を使用していることです。Jekyll は、マークアップとテンプレートファイルを使用して静的コンテンツを生成します。Jekyll は Bitbucket の静的ホスティングには含まれていません（追加もできません）が、出力（静的コンテンツ）は Bitbucket でホストできます。つまり、GitHub Pages と同じ機能を持つ追加の手順となりますが、サイトを生成し、生成されたファイルを Bitbucket にプッシュするだけです。以下のコマンドは、静的コンテンツ生成における Jekyll の部分を示しています。
- jekyll new ExampleSite — ExampleSite ディレクトリに新しい Jekyll サイトを生成します。
- cd ExampleSite — Jekyll サイトが生成されたディレクトリに移動します。
- jekyll build — Jekyll サイトを構築し、静的ファイルを生成します。
- cd _site — 静的コンテンツを含むディレクトリに移動します。
Jekyllの静的コンテンツディレクトリ（_site）に移動したら、前述のコマンドを使ってBitbucketリポジトリにプッシュできます。手動での作業は面倒ですが、お気に入りのツールを使えば簡単に自動化できます。図Eは、 Jekyllで生成したブログをBitbucket経由で配信するサンプルです。
図E
Bitbucket でホストされている Jekyll 生成サイト。
ホスティングサイトに最適なオプション
GitHub Pages 機能が大好きだったので、Bitbucket でも同様の機能が使えるようになったことに大喜びしました。すべてのウェブサイトに最適というわけではありませんが、個人サイトやシンプルな静的サイトであれば、Bitbucket は必要なものをすべて提供してくれます。サイトのホスティングだけでなく、サイトアセットのソース管理も行えます。
GitHub Pages との唯一の違いは、Bitbucket 上のサイトのリポジトリはパブリックである必要がなく、プライベート リポジトリをホストできることですが、静的コンテンツはブラウザーで簡単に表示できるため、大きな問題にはなりません。
Bitbucket ホスティングは、無料という素晴らしい価格で素晴らしいオプションです。
