Re viewのリアルタイムプレギュー機能をつくってみたよ

3,442 views

Published on

Published in: Technology
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,442
On SlideShare
0
From Embeds
0
Number of Embeds
2,147
Actions
Shares
0
Downloads
7
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Re viewのリアルタイムプレギュー機能をつくってみたよ

  1. 1. ReVIEWのリアルタイムプレギュー機能つくってみたよ 2013/8/10 ReVIEWによる書籍制作フローを勉強する会 ビ 13年8月10日土曜日
  2. 2. 自己紹介 name:八木俊広 twitter:@sys1yagi blog:http://visible-true.blogspot.jp/ 以前本を書いた時にReVIEWを使った 事があるけどもう大体忘れた。 ムトゥさんにはお世話になりました。ありがとうございました! 13年8月10日土曜日
  3. 3. もくじ 経緯 つくった デモ 仕組み 今後の展望とか 13年8月10日土曜日
  4. 4. 経緯 7/11にvvakameにテクブ本執筆者に追 加される(初稿締め切り2日前) 執筆はReVIEWを使って行われていた 最初google drive、途中でgithubも追加 LaTexこわい 売りに出されるひつじ 13年8月10日土曜日
  5. 5. 経緯 13年8月10日土曜日
  6. 6. つくった 1,2時間程度で 概ねリアルタイム プレビュー Webアプリ ファイルは1個 同時編集すると壊 れる エクスポートとか はない。 githubで公開 13年8月10日土曜日
  7. 7. デモ 13年8月10日土曜日
  8. 8. 仕組み サーバ: Node.js DB: 今のところ使ってない Node.js ReVIEW エディタ(ブラウザ) ①変更を送信 ②reファイルを書き換えて review呼び出し ③終わったでー ④出来たHTMLのデ ータを返す 13年8月10日土曜日
  9. 9. 導入の仕方 nodejs, npm, bower, rubyを入れる git clone https://github.com/sys1yagi/PreVIEW.git cd PreVIEW ./setup ./run.sh http://localhost:3000/にアクセス ファイルの場所 PreVIEW/tmp/index.re (編集されるファイル) PreVIEW/index.html (ビルド後のファイル) 13年8月10日土曜日
  10. 10. 今後の展望 ReVIEWプロジェクトを作成してファイル管理する機能 差分ビルド プレビューのカスタマイズ(CSS適用) エクスポート(HTML, PDF) githubとの連携 コラボレータの追加 エディタをリッチに(行番号とか自動補完) チートシート表示 ショートカットキー エラー表示(ビルドエラー等) バグフィックス ( //list[][]{が死ぬ) etc... 13年8月10日土曜日
  11. 11. 今後の展望 ReVIEWプロジェクトを作成してファイル管理する機能 差分ビルド プレビューのカスタマイズ(CSS適用) エクスポート(HTML, PDF) githubとの連携 コラボレータの追加 エディタをリッチに(行番号とか自動補完) チートシート表示 ショートカットキー エラー表示(ビルドエラー等) バグフィックス ( //list[][]{が死ぬ) etc... エンジニアじゃなくて も使えるサービスへ? 13年8月10日土曜日
  12. 12. おわりに ソースとか:  https://github.com/sys1yagi/PreVIEW とりあえず触る(動いてない時もある): http://ec2-54-214-204-32.us-west-2.compute.amazonaws.com:3000/ pull requestを待ち続ける 13年8月10日土曜日

×