GitHubで簡単にブログができるようになる「HubPress.io」を試してみた! | Select *
コンピュータ

GitHubで簡単にブログができるようになる「HubPress.io」を試してみた!

HubPress.io-Topなんだかんだでブログを3年も続けている@deepblue_willです。

ブログを書く方法は今ではいろいろあります。私みたいにWordpress使ってもいいですし、Hatenaブログなどのブログサービスもいいと思います。そんな中エンジニアにお馴染みのGitHubを利用してブログをやる方法を発見したので今日はそれを紹介したいと思います。


HubPress.io


HubPress | A web application to build your Blog on GitHub

エンジニアおなじみのGitHub。最近ではデザイナーの方も使っているようです。
馴染みのあるツールでブログをやれたら抵抗もないですし、GitHubなら無料でできるのでいいですよね。

GitHubに作成できるGitHub Pagesを利用してブログが作れてしまうWebアプリケーションです。
(GitHub Pagesについては→「たった3分!無料!GitHubにWebページ(GitHub Pages)を作る方法」で詳しく解説してます!)

非常に簡単に作れちゃうのでほんと素敵なアプリです。
当然作るためにはGitHubのアカウントが必要なので作っておきましょう!

早速ブログを作ってみた

まずGitHubにあるhubpress.ioのリポジトリを自分のリポジトリへフォークします。

hubpress4

手順

{username}.github.ioのリポジトリがない方
  1. フォークしたリポジトリ名を「{username}.github.io」を変更します。(Settingsから変更できます。)
  2. hubpress/config.jsonusernamerepositoryNameは↑で変更したリポジトリ名に変更します。
  3. edit-config
  4. ブラウザで「http://{username}.github.io/」にアクセス
  5. 以下のような画面が出てくればOK!
  6. HubPress.io-Top
2の手順で{username}.github.ioが作れない方
  1. Settingsからデフォルトのブランチを「gh-pages」に変更する
  2. set-default-branch
  3. リポジトリを「gh-pages」に切り替える
  4. change-branch
  5. hubpress/config.jsonusernamerepositoryNameを変更する
  6. edit-config
  7. ブラウザで「http://{username}.github.io/{repositoryName}」にアクセス
  8. HubPress.io-Top

管理画面へログイン

hubpress-login 「http://{username}.github.io/{repositoryName}/hubpress」もしくは「http://{username}.github.io/hubpress」にアクセスすると上記のようなログイン画面が表示されます。
ここにGitHubのアカウントを入力するとログインすることができます。

ログインすると以下のような画面が表示されて、ブログを書くことができるようになります。

hubpress1

ブログを書いてみた

書き方は非常にシンプルです。
Markdownで書くことができるので、知っている方にとっては簡単にブログを書くことができます。
書いたMarkdownはプレビューをその場で確認できるので、いちいち他のツールで確認する手間が省けます。
書き終わったら、右下の「保存」ボタン→「公開」ボタンの順でクリックすればブログを公開できます。
hubpress3

公開したブログを確認する場合は、「http://{username}.github.io/({repositoryName})/
にアクセス。
下のような画面にならない場合は、ブラウザを再読み込みすると更新されます。
hubpress2

ただ、まだ出来たてで色々バグがあるのか、書く上で以下を注意した方がよいです。

  • 公開日を指定できる:published_at:記法yyyy-mm-ddで記述する。(yyyy/mm/ddで書いたらちゃんと公開されなかった。。)
  • エディタにURLを書くとキャレットがおかしくなる。(Markdownの[リンク名](URL)の記法も効かない)
  • 同じ日を公開日にした記事を2つ投稿できない?

最後に

管理画面の「SETTINGS」からいろいろカスタマイズ可能です。
Google Analyticsの設定もできます。
とはいえ、すこし面倒な部分(例えば、画像はimages/にPushしないといけない)などいうあるので、ゆるくブログやりたい人向きですかね。

私みたいにちょっと弄りたいひとも含め、GitHubのアカウントお持ちの方はためしてみてください!

ではでは。

このブログをRSS登録する! この記事をはてブする!

Comment

  • hinaloe

    HubPressのマークアップはMarkDownではなくAsciiDocですよ!(`[]()`が使えないのは当然です……)
    現状日本語タイトルにするとファイル名がおかしくなったりするかと思いますがWPのスラッグみたいにファイル名指定できるようにはなるかと。

Zenback

Categories

  • Lifehack (57)
  • Web (140)
  • まとめ (172)
  • コンピュータ (132)
  • 仕事 (10)
  • 趣味 (104)
  • 雑記 (88)