reveal.js: HTML スライド¶
Last Change: | 25-May-2016. |
---|---|
Author: | qh73xe |
Reference: | https://github.com/hakimel/reveal.js/ |
reveal.js は HTML でスライドを作成することができるツールです。 HTML でスライドを作成することで, D3.js と連携をした動的な図表を作成したり、 bootstrap と連携して、一定のレイアウトを簡単に行うことが可能です。
また、基本的には HTML で表示を行うことになりますが、 それを PDF に エクスポートすることも可能です。
導入方法¶
基本的にはスライドを作成するたびに、 github からクローンを行うとよいでしょう。
git clone https://github.com/hakimel/reveal.js.git
直接ファイルをブラウザで開けばスライドが確認できますが、 一般に簡易サーバーを立ててしまって確認をする方が何かと楽だと思います。 これは node.js を利用するとよいでしょう。 以下に fedora 環境でフルセットアップを行う方法を記述しておきます。
sudo dnf install node.js
sudo npm install -g grunt-cli
git clone https://github.com/hakimel/reveal.js.git
cd reveal.js
sudo npm install
grunt serve
grunt serve を使うことで、 http://localhost:8000 にアクセスしてスライドを確認できるようになります。
なお、 PDF にエクスポートしたい場合には http://localhost:8000/?print-pdf#/ にアクセスします。
警告
PDF エクスポート
Google Chrome でアクセスする必要があります。 単純に HTML を確認するだけでは、どうしようもなくレイアウトがアレな感じになりますが、 <Ctrl> + p で印刷画面を呼び出すとまともにプレビューを行います。 あとはこれを PDF にすればよいです。