環境構築

環境構築というのは、いつでも面倒なものです。 (そういう理由から、JavaScriptを本編では採用しました) プログラミングに限らず、面倒だったことはメモするべきです。 今回は、このページをどうやって作ったかを簡単に。

1. GitHubに登録
2. 個人サイト用のレポジトリ「ユーザ名.github.io」を作成
3. レポジトリのSettingから好きなテーマを選択

これで、http://jsmanga.github.io ができました。

ところで、HTMLタグの直打ちはシンドイです。それにソースコードを見やすく表示したい。 そこで、Markdownという簡単なフォーマットで書くと、HTMLを生成してくれるRuby製のツール「Jekyll」を導入します。

1. Rubyのインストール
2. gem install jekyll
3. jekyll用の設定ファイル_config.ymlを用意します

auto: true
server: true
markdown: redcarpet

ここでJekyllを動かすときの雛形に、index.htmlを使います。<section>タグ内を変更し、_layoutフォルダを作って移します

(変更前)

<section>
    <h3>
        <a name="welcome-to-github-pages">...</a>
        Welcome to GitHub Pages.
    </h3>
    <p>This automatic page...中略 </p>
</section>

(変更後)

<section>
｛｛content｝｝ <!-- 全角だから、半角にしてね。ここに本文が挿入されます-->
</section>

あとは、index.htmlの元となるindex.markdown(例)

---
layout: index
---

+ 連載
  + JavaScript編
    + [はじめようプログラミング](js_001.html)

+ 雑記
  + [はじめに](memo_001_intro.html)
  + [環境構築](memo_002_environment.html)

を書いてjekyll buildとかjekyll serve --safe --watchすると _siteというフォルダにHTMLサイトが自動生成されます。これらをGithubとかFC2とかサーバに上げます。

日付管理とかブログみたいにするなら、WordpressとかOctopressとかが良いと思います。 でも私のように好きに連載用のページとか並べるくらいなら、Jekyllが最適です。

あと、Markdown書くときはAtomというエディタのプレビューが便利。

(2014/07/26 - 管理人)