Tweet
Tweet

Slide 1

Slide 1 text

Markdown でスライド作成 #symfony_meetup 2016.04.24 @qckanemoto 1 / 38

Slide 2

Slide 2 text

@qckanemoto （たつ き ち） 名古屋 か ら来ました （株）カルテットコミュニケーションズ CTO PHP 歴 4 年 , Symfony 歴 2 年（ 1 年 ぐ ら いROM 専） 　　　　　　 ちょっとだ けお 手伝 い しました 2 / 38

Slide 3

Slide 3 text

カルテットコミュニケーションズ 絶賛 PHPer 募集中！ 「Symfony2 本 」 の @hidenorigoto さん Joined ！ リスティング広告運用ツール 「Lisket」 3 / 38

Slide 4

Slide 4 text

カルテットコミュニケーションズ エンジニアの働 き やすさ超大事にしてます 4 / 38

Slide 5

Slide 5 text

カルテットコミュニケーションズ SNSか メールで お 気軽に ご 連絡 く ださ い 5 / 38

Slide 6

Slide 6 text

本題 6 / 38

Slide 7

Slide 7 text

Markdown でスライド作成 7 / 38

Slide 8

Slide 8 text

以前の僕 8 / 38

Slide 9

Slide 9 text

最近の僕 9 / 38

Slide 10

Slide 10 text

Ｉ ＭＤ 10 / 38

Slide 11

Slide 11 text

メジャーなツール が いく つ かあ ります 11 / 38

Slide 12

Slide 12 text

Reveal.js 12 / 38

Slide 13

Slide 13 text

Cleaver 13 / 38

Slide 14

Slide 14 text

わ が ままな僕 最終的に 4:3 と か16:9 と か で PDF 化した い Keynote みた い にタイマーとノートを見な が ら発表 した い 14 / 38

Slide 15

Slide 15 text

Remark 15 / 38

Slide 16

Slide 16 text

16 / 38

Slide 17

Slide 17 text

17 / 38

Slide 18

Slide 18 text

18 / 38

Slide 19

Slide 19 text

使 い 方 19 / 38

Slide 20

Slide 20 text

インストール $ g i t c l o n e g i t @ g i t h u b . c o m : q c k a n e m o t o / r e m a r k b a s e . g i t $ c d r e m a r k b a s e $ n p m i n s t a l l - - g l o b a l g u l p $ n p m i n s t a l l $ g u l p t h e m e # デフォルトテーマを有効化 $ g u l p s l i d e # サンプルスライドを有効化 20 / 38

Slide 21

Slide 21 text

スライドを表示 $ g u l p s e r v e 21 / 38

Slide 22

Slide 22 text

スライドを新規作成 $ m k d i r s l i d e s $ v i s l i d e s / s y m f o n y - m e e t u p - 1 1 . m d # これを編集 $ g u l p s l i d e - t s l i d e s / s y m f o n y - m e e t u p - 1 1 . m d $ g u l p s e r v e 22 / 38

Slide 23

Slide 23 text

スライドを編集 中はファイルの変更を監視してリアル タイムにブラウザ が 更新されるので 、 快適に編集 で き ます Remark 独自の拡張記法と か は https://github.com/gnab/remark/wiki 参照 remarkbase 独自のユーティリティ class と か は https://github.com/qckanemoto/remarkbase 参照 g u l p s e r v e 23 / 38

Slide 24

Slide 24 text

テーマを自作 テーマと言っても CSS ファイル 1 つで OK 自分用に作ったものを https://github.com/qckanemoto/remarkbase-themes で公開してるのでよろし け ればど う ぞ $ m k d i r - p t h e m e s / y o u r - o w n - t h e m e $ v i t h e m e s / y o u r - o w n - t h e m e / s t y l e . c s s # これを編集 $ g u l p t h e m e - t t h e m e s / y o u r - o w n - t h e m e $ g u l p s e r v e 24 / 38

Slide 25

Slide 25 text

プレゼンテーション ブラウザ上で をタイプするとプレゼンテーショ ンモードに P 25 / 38

Slide 26

Slide 26 text

プレゼンテーション ブラウザ上で をタイプするとウィンドウを複製 （複製したウィンドウはページ が 同期される） C 26 / 38

Slide 27

Slide 27 text

プレゼンテーション ブラウザ上で をタイプするとフルスクリーンモ ードに F 27 / 38

Slide 28

Slide 28 text

プレゼンテーション 手元はプレゼンテーションモード プロジェクタ側はフルスクリーンモード こ れで気分は Keynote 28 / 38

Slide 29

Slide 29 text

PDF 出力 Remark 自体にそ ういう 機能はな い OS の印刷機能で PDF 出力する し か も謎の苦し い ハック が 必要 でも出来るには出来る！ 29 / 38

Slide 30

Slide 30 text

PDF 出力（ Chrome の例） 1. （ファイル→ 印刷） 2. を に 3. を に ⌘+ P 送信先 P D F に保存 余白 なし 30 / 38

Slide 31

Slide 31 text

PDF 出力（ Chrome の例） こ のままだと 、 変な余白 が で き てしま う 31 / 38

Slide 32

Slide 32 text

PDF 出力（ Chrome の例） し か し 、 ウィンドウの大 き さを調整すると … 32 / 38

Slide 33

Slide 33 text

PDF 出力（ Chrome の例） ピッタリ！ 33 / 38

Slide 34

Slide 34 text

PDF 出力（ Chrome の例） あ とは 「 保存 」 するだ け です 34 / 38

Slide 35

Slide 35 text

PDF 出力（ Chrome の例） ピッタリ！ってなるウィンドウのサイズは多分環 境によって変わるので 、 探り当てて く ださ い ｗ 僕の MacBook Pro 13in では 910 x 682 でピッタリ です Window Resizer って いうChrome 拡張を使 う と 、 サイズを覚 え させて おい てワンクリックでリサイ ズと か で き て便利です 35 / 38

Slide 36

Slide 36 text

まとめ 36 / 38

Slide 37

Slide 37 text

Ｉ ＭＤ Markdown 最高 Keynote の代わりなら Remarkがいい と思 い ます remarkbase 便利だと思 う のでぜひ使ってみて く だ さ い 37 / 38

Slide 38

Slide 38 text

Thanks :) 38 / 38