「みんなの翻訳」は、世界中の文書をみんなで協力して翻訳するサイトです。

みんなの翻訳ロゴ
ブクタブ
翻訳サイト

カテゴリ一覧

このサイトについて 新規登録はこちら お試し翻訳

一覧

2017/07/28

メンテナンス終了のお知らせ

2017/7/25-2017/7/28に実施したメンテナンスは、2017/7/28/14:20に終了いたしました。 ご協力をいただき、ありが…

List

Hnoss

English⇒Japanese

shikimi

English⇒Japanese

sysInfo

English⇒Japanese

tkkobe

English⇒Japanese

ホーム新着翻訳記事一覧 > 新着翻訳記事

新着翻訳記事

静的サイト・ジェネレータを比較 | 自分にあったツールはどれだ | from PhiLhoSoft Technical Blog

  静的サイト・ジェネレータ

  僕はなんだか技術ネタの記事を書きたいわけで(この記事もしかり…)、それが今でもマイブームなわけですけどね。
 そんな動機で運営していた前のサイトですけれど、まだアクセスできる状態ではありますね。でも、もうFTPアクセスは切ってあるので、アップデートとか新しい記事のアップとかは到底出来そうにありません。

  注:この記事は未完成です。この先アップデートする予定があります。

 

  静的であること

 先日、GitHub Pagesという無料ホスティングサービスが、とりわけ、技術的な話題を取り扱うのにぴったりなことがわかりました。しかしこのサービスでは、コンテンツマネジメント・システム(WordPressなど)が使えないというのです。

 もちろん、次には「Jekyll」を使うという案が浮上しますが、僕ちょっとこれは使いたくない。

 というのも、シンタックスの出来があまり満足いかないし、
 (あくまで個人の感想です)
 Rubyツールである
 (遅い。あと、自分がその言語を詳しく知らない。いじれない。)
 ということも理由の一つだな。

 それでもヒントはある。
 だって、自分で改造できさえすれば、元のブログ・ソフトウェアが自分のニーズに完璧一致していなくても平気だから。

 そのような理由から、僕は自分が求めているサイト・ジェネレータの条件を書き出してみました。

 まず、何より静的サイトが作れること。それから、その気になれば自分の手でソフトの全要素を操作可能なこと。ここは自分の経歴しだいで、何があっているか個人差がある。

 それから、自分が必要な動的パーツがつけられるかどうか。たとえば、読者からのコメントを募集(もちろん、スパム対策つき)する機能が欲しい。

 結局、自分がみつけた限り最も手ごろな解決策は、「Disqusを使う」という方法でした。これはクロスプラットフォーム・コメントサービスで、JavaScriptだけで動きます。サイトからも、クラウドからもホスト可能なので、サーバーサイドスクリプトとかデータベースなどが要りません。
 自分のサイトに導入したことはなかったけれど、以前他人様のサイトに書き込むときに使ったことはあったんで、まあ印象はよかったわけです。
 

  さて、それらの条件に合致するツールはあるか。

 

  比べてみた

  そこで、私は「Top Open-Source Static Site Generators - StaticGen 」と「Static Site Generators」この2つのページでざっと調査してみました。そしたら、案外たくさん見つかりました。

注意:まずここで1つ注意しておくけど、使えそうなソフトウェアが見つかったら、ソフトを0から作り上げる暴挙には出ないこと。あなたが表現したいサイトは、大概こういうソフトで作れます。
 それから、わざわざお金をかけてまでドメイン名を取得する必要はないよ。GitHub.ioやその他同じようなサービスを展開している、無料サイトがちゃんとあるから。
 
 

  Hugo

  まず最初に試したのがHugoです。探してみて最初の方に見つかって、自分が欲している要点をだいたい満たしているソフトウェアでした。説明性が丁寧なのもうれしいです。ネイティブバイナリだからこそ実現できる、スピードが売りだそうです。

 しかし、すぐに自分に合わない部分も見つかりました。
 Markdownの構文解析プログラムがあまり使い物にならなくて、自分が思ったとおりにサイトを作れないだろうことがわかったのです。
 それから、自分はGo言語をよく知りません。なので、なにか細工を施すことができない。この時点で、自分がメインとして使っていく候補からは外れました。
 他の、少なくともGo言語ではないツールを探しだす必要があるようです。


  言語からサイト・ジェネレーターを探してみる

  Lua言語で書かれたジェネレーターを見つけました。これなら、自分でも内部まで理解ができそうなので、とてもそそったのですが、作者の雰囲気が何かアヤシかったことと、ユーザー数があまりに少ないということから、やめにしました。
 出処が怪しいことを除けば、自分のニーズにはあっていた気がするだけ残念です。
 

  PHPジェネレーターも候補に入りました。私が得意とする言語に、とても型が近かったからです。
 しかし、PHP言語そのものが、オフラインでの作業に不向きなようで、これも却下です。
 

  Java言語のジェネレーターは、いじるぶんには手軽ですが、動作が重いのが気がかりです。
 

  結局、これなら行けるのではないかと思ったのが、JavaScript言語で書かれたジェネレーターでした。
 有名どころでいけば、Node.jsです。この言語なら私も普段から使っていますし、ウェブに関するエコシステムなら豊富にあります。

 

  Metalsmith

  その他で自分の興味が湧いたジェネレーターは、Metalsmithです。
 コアがとても小さく、タスクやプラグインを指定できるところが良かったです。ウェブサイトだけでなく、電子書籍も作れるので、何かと使用目的がありそうなツールでした。

 

  ビルドツール

  しかし、ビルドツールの中にも、プラグインとしてサイトジェネレータを扱っていることがあることを思い出しました。たとえば、WebpackやBrunch、Gulpなどがそうです。

 たしかに、私の得意分野はウェブツールですし、MarkdownをHTMLに変換したり、SassをCSSに直すライブラリがあるなど、機能も豊富なようです。
 いざ様々な部分を工夫したいとなると、ビルドツールを使ったほうが面白そうでした。

 しかし、プラグインを探すのも、タスクの順番を指定するのも、自力でやらなくてはならないわけで、手間がかかります。
 僕ならその時間を使って、もっとたくさんの記事を書いていたいですね。

 どうにも自分には、操作が効いたとしても、「やることのテーマが決まっている」ソフトウェアのほうが合っているようです。

 

  AntWar

  そこで、Webpackと React.jsで作られた Antwarというツールを使ってみることにしました。サイトの説明がわかりやすく、自分でも調節できそうな部分がありました。
 しかし、実際使ってみたら、やはりMarkdownの識別が良くなくて、他をあたってみることにしました。

 

  AkashaCMS

  同じWebpack系のツールに、 AkashaCMSというものがあったので、これも試してみました。

 公式サイトは色味にかける構成でしたが、情報だけは丁寧でした。Markdown構文解析プログラムもきちんと機能しているようです。また、自分でもいろいろと手を加えられそうでした。

 ところが、テンプレートは自分で作らなくてはならないということで、ここで現実味が一気に失せましたね。どこからがスタート地点なのかが、わからなくなってしまいました。

 たしかに、外部ツールのEJSテンプレートシステムに対応しているので、けして1から作らなくてはならないわけではありません。
 ただそのテンプレート、コードにGoogle Codeを使っている。
 これはいただけない。だって、あそこの質問フォーラムに投稿しても、1ヶ月経ったって答えてくれない。それから、シンタックスの構成が雑だ。気まぐれにJSPやASPなどの紛らわしい言語を入れてきて、JSと混乱を起こしやすいんです。

 あと、これは個人的な理由なんですが、対応しているメタCSSがLessであることがマイナスポイントになりました。私が使えるのはSassのほうなので。

 でも、それらの部分は自分で改造すればなんとかなる部分です。
 あと作者さん、レンダラーの変更方法を公開してください。そこさえ何とかなったら、今すぐにでも使いたいツールなんです。

 

  他に発見したツールにおいては、ざっとだけ説明しますね。
 まずは、 Waffel。これはBrunchをベースに作られたジェネレータで、それなりの有望株でした。
 それから、Gatsby。機能としては良かったのだけど、React.jsとCoffeescriptで記述されていて、自分が内部までを理解することはできません。いじる上では難点になりました。

 

  Hexo

  そして色々調べてみた結果、少し前まで使っていた Hexoに逆戻りすることになりました。
 サイトと説明書がわかりやすいこともさることながら、サポートが手厚いところがこのツールの良さです。プラグインとテーマがたくさんあって、開始までに手間がかからないことが、サイトを運営していくうえでは便利でした。
 

 ただ、1つ気に食わないところをあげるとするなら、EJSとLessで記述されているテーマが割と多いところですね。なんでそんなにEJSに人気があるんですか?

  ちなみにHexoが、EJSとStylusレンダラーに対応したのは、 v.3以降です。
 その他にもプラグインはありますから、自分でテーマを作るときにしても、技術的な手段はいろいろあります。 

  新しいサイトには、 Icarusテーマを使うことにしました。動作が機敏で、見やすいデザインです。  外部ソフトではDisqus と Google Analyticsに対応しています。
 実際使うときには、CSSを少し変更して、自分のページに合わせました。 
 

  備考

  Hexoクライアントをインストールしたら、「hexo」コマンドでプロジェクトのクローンを作成できます。この機能は特に、Hexoをローカルにインストールして、ネット上の環境をそのまま移植したいときに使います。
 もう1つ、Hexo環境をローカル保存する手段として、「npm install」でHexoをローカルに展開し、必要なプラグインを導入するという方法もあります。

 
PDF
更新日:2017-08-24 19:12:58 Hnoss 0  del.icio.usに追加   はてなブックマークに追加   twitterに投稿   facebookでshare
[ 原文 ] https://philhosoft.github.io/Software/Static-site-generators/ Creative Commons License この作品は、クリエイティブ・コモンズ・ライセンスの下でライセンスされています。
クリエイティブ・コモンズ・ライセンス
翻訳者ページをみる

この記事の翻訳者

Hnoss さんの翻訳記事

【GitLab Pages 公式 を訳してみた】GitLab Pages 説明書 

GitLab Documentation > User documentation > Projects >GitLab Pages 説明書  GitLabには「GitLab Pages」という機能があります。  GitLab…2017-09-23 12:10:55

SSGを知る②:最近の静的サイト・ジェネレータ事情 | from about GitLab.com

 引き続き、静的サイト・ジェネレータ特集です。  前回は、「静的サイトとは何か」というような内容で終わってしまいましたが、いよいよ本題です。  静的サイト・ジェネレータって…2017-09-23 11:58:35

SSGを知る①:静的 vs 動的 ウェブサイト | about GitLab.com

 ウェブサイトは静的なものと、動的なもの2つに分かれますが、それらにはどのような違いがあって、どのような長所があるのでしょう。  GitLab Pagesで扱えるのはどっちだろう?  静…2017-09-23 11:23:00

【GitLab Pages 公式 を訳してみた】GitLab Pages のこと全部教えます!①

GitLab Documentation > User documentation > Projects > GitLab Pages 説明書 >GitLab Pages のこと全部教えます!① 記事の 種類 : 取扱説明書 || 対象 : 初心者 || …2017-09-23 11:17:34