はてなブログのバックアップをしようと唐突に思った
そういえば、10年くらいはてなブログをしていて一度もバックアップをしたことないなとふと思い、突如「あしたはてなブログが潰れたらどうしよう！」と不安になったのでバックアップをとることにしました（嘘です）。
普通にパソコンにコピーしておくだけでもよいのですが、よく後で何を変更したか分からなくなったりするのでバージョン管理したいなということと、自分のパソコンもいつ壊れるか心配なのでクラウドでもバックアップしたいなということで、両方を満たすようなサービスないかなと思っていたら…ありました。いつも使っているGitHubです。
ただ、GitHubは無料アカウントだと、自分だけしかみることのできない設定をできないので、不特定多数の人に見られてしまいます。ブログは元々不特定多数の人に公開されているので、そこまで問題ないかもしれませんが、できればプライベートな設定もできると良いなということで、無料アカウントでプライベート設定のできるBitBucketを使ってみることにしました。
GitHubの有料アカウントを使っている人や、全部見られても構わないという豪放磊落な人は、GitHubでもほぼ同様の要領でできると思いますので、試してみるとよいかと思います。
Bitbucketアカウント作成
まずは下記のBitbucketのサイトに移動してアカウントを作成しましょう。
アカウント作成に関しての説明は省略します。英語のサイトですが、そんなに迷うことはないと思います。どうしても辛い人は、日本語で「Bitbucket アカウント作成」とかで検索すれば、誰か優しい人をグーグルが探してくれます。
リポジトリ作成
上のバーのRepositories -> Create Repositoryを選択して新しいリポジトリを作成しましょう。リポジトリの設定はそのままで好きな名前で作成すればよいです。今回はhatena-backupというリポジトリを作成しています。
上記画面でThis is a private repositoryにチェックが入っていると、他の人には見られないようになります
次に左のNAVIGATIONからSourceを選択すると次のような画面になりますのでCreate a READMEというボタンをクリックしてください。NAVIGATIONが画面に出て来ない場合は、ブラウザを横長画面にしてみてください。
すると次のような画面が出てきます。これは、このリポジトリ（バックアップファイルを置く場所）が何かという説明を記載するファイルです。特に変えなくてもよいのでそのままCommitをクリックします。Commitというのは、ここではファイルのセーブみたいなものと覚えておけばよいです。わけのわからないこと書いてあるのは嫌だという人は、全部消して「はてなのバックアップ」とか書いてCommitをクリックすればよいと思います（好きなように書いて大丈夫です。日本語も使えます）。
次に、以下のような画面が出てきます。今回どういう変更をしたかという説明を記載する内容です。今回もこのままCommitをクリックします。
ここで、またNAVIGATIONのSourceをクリックすると、次のような画面が出てきます。
これでリポジトリの作成は完了です。次に、このリポジトリにバックアップしたいファイルを追加していきます。
リポジトリにバックアップファイル追加
右上のNew fileをクリックします。ここで、バックアップするファイル名と内容を入力する画面が出てくるので、はてなブログの設定画面を開いて、バックアップしたい項目をコピペします。例えばデザインCSSをコピペしてみましょう。
コピペして
貼り付ける！
ファイル名はcssとか自分が後でわかりやすいファイル名にしておけばOKです。この後、READMEを作成したときと同様に、Commitを2回クリック。
その後NAVIGATIONのSourceをクリックすると、cssというファイルが追加されているのがわかると思います。
これで、デザインCSSのバックアップは完了です。他にも記事上とか記事下とか自分がカスタマイズした設定があれば、その設定毎にファイルを作成して同じようにコピペしておけばよいです。自分はarticle-topとかarticle-mobileとか名前つけて保存しています。スマホ用のカスタマイズしている人は、忘れずそちらもバックアップしておきましょう。mobileとかつけておいて後でわかるようにしても良いですね。
ファイルの変更
ここまでだと、単なるメモ帳へのコピーと変わりませんね。では、変更したときはどうなるか。ここからがいわゆるバージョン管理システムの真骨頂です。ここで例えばはてなブログのテーマを変えてデザインcssを変更したとします。
その場合、先ほどのcssというファイルをクリックします。
ここで、右上のEditというボタンをクリックしましょう。すると編集画面が出てくるので、新しい内容をコピペしてやりましょう。
ここでCommitをクリックしてもよいのですが、今回は隣のView Diffというボタンをクリックしてみましょう。
ジャーン、なんと今回の変更で前回からどこが変わったかが分かりやすく色付きで表示されるのです。もし間違いがあれば、ここで気づくこともありそうですね。
問題がなければ、このままCommitをクリックしてやりましょう。その後、この画面で今回変更した内容を分かりやすく書いておくとよいです。
NAVIGATIONのSourceをクリックすると、ファイルの右側に今回の変更内容が記載されているのがわかると思います。
cssの中身をみると、新しい内容で保存されています。
あれ？新しい内容で上書きされちゃったけど、前のバージョンに戻したいときはどうすれば良いの？と思ったあなた！ご安心を！右上のHistoryというボタンをクリックしてください。以下のように、過去の変更履歴は全て保存されていて、いつでも過去の内容を呼び出すことができるのです。
過去の内容をみたいときは、Commitという行の下の暗号のような数字をクリックしましょう。例えば上記の例だとbd823abという番号が最初に作成したファイルなので、クリックしてみます。すると以下のように変更前のファイルが表示されます。
もしデザイン変更して前の状態に戻したくなった場合は、これをはてなブログの設定画面の方にコピペしてやればもとどおりになるというわけです。この作業をファイルを変更するたびに実施してやれば、バージョン管理しながらのバックアップが実現できます。
ブログのデータ自体のバックアップ
デザインだけでなく、ブログのデータ自体もバックアップしておきたいですね。ブログのデータのエクスポートの仕方は以下を参照ください。
ブログのアドレス.export.txtといったファイルがダウンロードできます。中身はテキストファイルなので、適当なテキストエディタで開いて、後はデザインと同じ要領でコピペすればバックアップできます。記事数が多い人は、結構重いファイルになります（自分は10MBくらいありました）ので、ちょっと大変かもしれませんね。GitHubだと、ファイルを直接アップロードすることもできるのでもう少し楽です。Bitbucketではできないみたいです。
テキスト以外の画像や動画などのデータ
ここまででブログのデザインや、本文のテキストをバックアップできました。他に、ブログに貼り付けている画像や動画などのデータもバックアップしたいところですが、こちらは、使用しているサービスによって変わってくるので、またそれぞれのサービスに合わせて個別にバックアップを取る必要があるのですが、今回の記事の範囲からは少しずれるので扱いません。はてなフォトライフの画像とか、バックアップしてないので、また気が向いてバックアップしたら別で書くかもしれません。
まとめ
コピペだけで、はてなブログのバージョン管理しながらバックアップする方法を解説しました。いざというときのために、こうやってバックアップをとっておくと安心ですね。今回はコピペだけでできる簡単な方法のみを解説しましたが、さらにGitHubやGitのコマンドを使いこなすと、例えばコマンド一発ではてなブログのデザインを1舜で前の状態に戻したりといったことも可能になります。
また、レンタルサーバーでWordPress等を使ってブログをしている人は、レンタルサーバーがSSHでアクセスようになっていれば、例えば一定の期間毎にGitHub/Bitbucketサーバに自動でバックアップをとるといったこともできたりします。もし興味がある方は調べてチャレンジしてみるのも良いかと思います。
