avataruuki.dev

技術ブログはじめました

  • note
  • 2 min read
⚠️
注意
この記事は2017年に執筆したものです。
現在のブログは、本文中の技術スタックとは異なる構成であること、内容が古くなっていることにご注意ください

前々から作ろうと思っていた個人のブログを構築しました。

フロントはVue.jsで、サーバ側はAWS Lambda+API Gatewayで構築。コンテンツ管理にはGhostを使っています。 AWS周りの構成については別の記事で詳しく書こうと思います。

読みづらい点もあるかと思いますが、よろしくお願いします。

手始めに、このブログのCMSとして導入している「Ghost」について書いてみます。

Ghostって何?

Ghost」は、Node.jsベースで作られているオープンソースのブログプラットフォームです。

元々Wordpress UIグループの副責任者として働いていたJohn O'Nolan氏によって立ち上げられたプロジェクトで、「Wordpressはただブログとして使用するには複雑になりすぎてしまった」といった所から記事を書く事に集中できるプラットフォームを主眼に置いたGhostのプロトタイプを作成、Kickstarterでの資金調達を経てGithubに公開されました。

参考:Project Ghost - "WordPress is so much more than just a blogging platform"

今年2017年の7月に、1.0(v1.0.0)がリリースされており、この記事を書いている現在の最新バージョンは、v1.18.4となっています。

料金形態としては、無料のセルフホスティングと、月額制のホスティングサービスである Ghost(Pro)があります。

導入〜実際に使ってみて

EC2上での構築でしたが、Ghost-CLIという便利なツールが公開されており、対話形式でコンフィグ生成〜今回は手動でしたが必要に応じてNginxの設定も行ってくれるようで、スムーズに構築できました。

データベースにはSQLite、MySQL、PostgreSQLが使えるため、MySQLを使っています。

実際の管理画面も非常にシンプルなデザインで、使いやすい印象です。 スマホの場合はレスポンシブで切り替わるものの、文字の範囲選択がうまく出来なかったり、ちょっと気になる点はありました。 ただこれに関しては自分のスマホが未だにiPhone5s(…)なので、スペック不足なだけだろうという感じです。

記事はMarkdownで書けます。

個人的にはコードブロックのSyntax Highlight(のアシスト?)機能が標準で付いているのは嬉しい点でした。言語を指定すれば、自動でclassを付与までしてくれるので、Prism.jsを併用する事で簡単にハイライトに対応できます。

  const foo = 10;
  const bar = (x) => {
    return x * 2;
  };
  bar(foo);

Themeの開発に関しては、テンプレート言語にHandlebarsを使います。動的な箇所をmustacheで書いていく形で、Jekyllのtemplateを作るイメージに近いかもしれません。

今回はAPIを主軸に使っているためテンプレート周りはあまり触っていないですが、いずれThemeの方も触れればと思います。

以上、簡単ではありますがGhostのご紹介でした。 もしこの記事で少しでも興味を持って頂ける方がいれば嬉しいです。

今後のこと

記事更新をしつつ、このブログのシステム改善やUIの調整など進めていければと思っています。

現状で予定している調整内容としては、

  • フォント、行間、色味など、見やすく改善したい
  • 複数タグでの絞り込み(GhostのAPIが現状未対応なようなのでなんとかしたい)
  • URL周りの調整
  • 検索(記事数が増えてきたら付けるかも)

といった具合です。 他にも気づいた点など細々アップデートを続ける予定です。