Markdownで書ける静的サイト。究極の Flat-File CMS（コンテンツ管理システム）と呼べるかな？

文章はテキストファイルでいい。テキストエディタがあればいい。データベースなんていらない。サーバー容量もそんなにいらない。装飾も機能も、簡単でいい。もっと軽く簡単でシンプルなものがいい・・・そう考えて、ワードプレスどころかPHPすら動かない、ここ、GitHubページにサイトを立ち上げました。

何も持たずに陸の孤島へやって来た

これは（名前はまだありません^^;）、Markdownで記述できるシンプルなFlat-File CMS（コンテンツ管理システム）を目指した静的サイトのためのファイルです。index.htmlと、JavascriptによるMarkdownパーサーで構成されています。 PHPやCGIは、利用していません（そもそもここでは動きませんw） webページで表示される「index.html」をテキストエディタでべた書きするだけなのですが、肝心の記事をHTMLで書くのは大変です。ちょっと修正するだけでも面倒です。それなら記事部分「<article>～</article>」をMarkdownで書けるようにしました。これは、Singularity CMS と [MDwiki](http://dynalon.github.io/mdwiki/#!index.md)にインスパイアされて作られた、[HoneDrops](https://www.catch.jp/honedrops/index.ja/)を参考にしました（この場を借りてお礼申し上げます。ありがとうございました）。ヘッダー部分とフッター部分は前の記事をコピペして、後はMarkdownで好きなように書いた記事を新しいフォルダに放り込めば、それでおしまい。フォルダ名がそのままパーマリンクになります。Markdown部分は、クライアント側でHTML文章に変換してくれます。 [HoneDrops](https://www.catch.jp/honedrops/index.ja/)との違いは、 - PHP は使いません - JQuery は使いません - Bootstrap も使いません - HTMLがそのまま通るようにしました ### 特徴 1. データベース不要 > 管理やバックアップが楽 2. サーバー負荷が軽い > Markdownのレンダリングはクライアントで実行 3. 記事の更新が簡単 > ファイルを放り込むだけ 4. Google検索に対応 ### ページの作成マークアップ：[marked.js](https://github.com/chjj/marked)を使っているので、一般的なMarkdownが通ります。Markdownにない記法は、直接HTMLで書けばOKです。代償として「<」や「>」や「&」はそれぞれ、「<,>,&」と書かなくてはならなくなりました。「Markdownしか書きません！」ということなら、[marked.js](https://github.com/chjj/marked)のオプションで設定できますが、今はこのままでいいですw ついでのついでに、改行をそのまま改行（<br />）とするオプションも生かしています。いちいちスペースを2個入れるのも面倒ですからね。 HTMLで書いたときに、改行がそのまま生かされて面倒なことになりますが、そこも今のところガマンしますw ### ページアクセス |URL|表示されるページ| |:-----------|:------------| |/|/index.html| |/index|/index.html| |/category|/category/index.html| |/category/sub01/|/category/sub01/index.html| それぞれ「index」や「index.html」を付けても同じページが表示されてしまいますね。重複URLということで、怒られるかな？「.htaccess」で禁止させようかな？ ### その他 - titleタグはその都度書いています - HTMLタグをちゃんと使っていないから、SEO的には弱いかな？見出しタグ（<h2>とか）くらいは、HTMLで書いています^^; - style.cssで、ページごとの設定が可能です - フォルダ内に「index.html」と一緒にサムネイルファイルとか入れておけます（サイドバーを見てくださいね） - サイドバーの記事一覧は、別ファイルにしてiframeで実現しています（書き換えるのが一回で済みますねw） ### Markdown 001.jsで、[marked.js](https://github.com/chjj/marked)のオプションを設定しています。 ### 属性の追加 [marked.js](https://github.com/chjj/marked)で出力されない属性などを追加する場合には、直接HTMLで記述できます。 ### ライセンスありません^^; 公開された技術の寄せ集めですからね。ソースを見たら、何をしているのか丸わかりです。まだ途中段階で汚いですから、あんまり見ないでくださいねw ### Credits #### HoneDrops - Copyright (c) 2017 Yutaka Catch. (MIT License) - https://www.catch.jp/honedrops/index.ja/ #### marked.js - Copyright (c) 2011-2014, Christopher Jeffrey. (MIT License) - https://github.com/chjj/marked/