過去のブログをgithubにバックアップした
2019年3月末にジオシティーズが閉鎖されるということで、過去に自分が書いたものを引っ越し及び、バックアップすることししました。10年以上も前に書いたもので、しばらく忘れていたものでしたが、ちょっともったいなかったので、引越しました。
引っ越す上で、サービスがなくなりにくいことと、いつでも引っ越せる形にしたいと思って、markdonで記事を書き、github上にアップする形にしました。
引越・バックアップ先のページは
になります。
システム構成
ブログシステムの元はこちらになります。
githubの機能の一つにgithub.ioというものがあり、HTMLファイルをアップロードすれば、独自のWEBページを表示できるサーバ機能があります。さらにgithub.ioではgithubやQiita記事によく使われる「Markdown」形式のファイルをJekyllによって、自動でHTML変換する機能を持っています。
- ローカルでMarkdown(.mdファイル）で記事を作成
- githubにアップロード
- github.ioのjekyllによって.mdファイルをhtmlファイルに変換
- github.ioによってHTMLを表示
3と4に関しては自動で行われるので、記事を書いてgithubにアップロードすれば記事が自動的に追加されています。
作成環境
markdownはちょっとプレビューを見ないと変になっていることが多く、アップロードしてから修正を繰り返すと結構手間なので、VS Codeのプレビュー機能を使っています。WEBで見るのとはスタイルは違いますが、markdownのスペース入れ忘れとかは防げるので、便利です。
また、ページ内に表示する画像ファイルのリンクが間違っているとやり直しになったりすることもあります。VS Codeの「フォルダーを開く」を使ってフォルダ全体を開いた後、そのフォルダを「ルート」としたパスを使うとプレビューで表示できます。また、github.io で表示するときも同じ「ルート」からのパスで表示できます。つまり、同じ/images/xxx.png のパスで、アップ前のプレビュー時にロカール上にある画像も、アップロード後にWEB上ある画像も表示できます。
また、VS Codeではgitをインストールすることで、VS Code内からコミットやプッシュができるので、VS Code内で作業が完結できます。コマンドはすぐ間違えたり、忘れたりするのでほとんど使わないのですが、gitのアップロード作業もコマンドは使わずマウスクリックでできます。
- /imgames/ 内に記事に使うイメージファイル(.png)を置く
- VS Code /_posts/ に.mdファイルを作り、記事を作成
- VS Code 内で変更を「コミット」
- VS Code 内でgithubへ「プッシュ」を実行
- 少ししてから(html変換に少し時間がかかる）にWEB上でブログを確認
メリット
- Markdownの汎用性が高く、ツールや引越し先の選択肢が多い
- ローカルに.mdファイル ⇒ htmlファイル変換ソフトが不要
- ローカルでもVS Codeでプレビューが確認できる
- VS Code内でアップロードまで完結できる
- コマンド操作が不要
- ローカルのNASなどに簡単にバックアップしておける
- 画像リンクがルートパスなので記事と画像の関係は維持したまま保管できる
ちょっと不便なところ
できれば内部リンクもJekyllのテンプレートに依存しないような形で、.mdファイルのリンクを自動的にhtmlリンクに変えてくれるようなものになっていれば、良かったと思います。
また、VS Code上のプレビューと少し異なる部分やスタイルの違いなど、アップロードしないとわからないことがあって、また.mdファイル ⇒ htmlファイル変換に少しタイムラグがあるので、それがちょっと使いにくい部分であります。
このブログとほかのブログの関係
使い方としては過去のブログのバックアップのほか、これからの記事はこちらで書いた後、他のブログに転載するという形にしたいと思います。論文では２重投稿かもしれませんが、個人のブログに制約があるわけではないと思います。こちらがメイン保管場所で、内容によって他のブログに転載する形にしようと思っています。