全人類タコスを食え

社内LTにてタコスの素晴らしさを説いた資料です
後半はreveal.jsを用いたスライドサイトの話もあります

Transcript

1. 12/15 社内 LT 会 全人類タコスを食え ぶりお @burio_16
2. 今日のゴール：タコスを食べたくなって もらう
3. お前もタコスを食わないか？🖐️🌮👊
4. タコスって知ってますか？　
9. これは tex-mex です。アメリカナイズされたタコスです
10. タコスとは？ メキシコ料理の主食であるトルティーヤにさまざまな具材をのせる国民食 具材は多岐に渡り、豚肉、牛肉、鶏肉にとどまらず、魚や豆、サボテン
11. ぶりおがタコスを好きな理由 肉の種類 豊富なトッピング お酒との相性
12. ぶりおが好きなタコスその１ アル・パストール
13. ぶりおが好きなタコスその２ ケサビリア
14. こんな人におすすめ お肉が好きな人 スパイシーな料理が好きな人 パクチーが嫌いな人
15. ◯ ぬ...!! ◯ んでしまうぞ杏寿郎
16. タコスを食え ！ タコスを食うといえ！
17. というスライドを reveal.js を使用して作成しました。
18. 社内LT 会 自分だけの スライドデッキを作ってみた ぶりお @burio_16
19. スライド作成して、登壇したら PDF にして共有するのめんどくさくない ですか？
20. 作成したら、 自動的に 公開されるようになってほしい
21. 自分のスライドを公開できる 自分だけのスライドデッキを作りました。 https://burio-slide.dev
22. 自分だけのものって かっこいいし、イケてるし、クール じゃないですか？
23. 技術スタック フロントエンド： フロントエンド： スライド表示： デプロイ： React Next.js(app router) reveal.js Cloudflare Workers
24. できること Next.js スライドごとのOGP 画像を設定する Reveal.js プレゼンター表示 フルスクリーン表示 Cloudflare GitHub 連携により、Main ブランチ マージ時に自動デプロイ
25. reveal.js よかった点 HTML でもMarkdown でもスライド作成可能 スライドを縦と横に展開可能 Google スライドでできることと同等のことができる <section data-background-image={BG_CONTENT} data-background-size="contain" > <div className="flex h-full flex-col items-center justify-cen <h2 className="text-left text-white">reveal.jsよかった点</h <ul className="text-white"> <li>HTMLでもMarkdownでもスライド作成可能</li> <li>スライドを縦と横に展開可能</li> <li>Googleスライドでできることと同等のことができる</li> </ul> </div> </section>
26. reveal.js よかった点 HTML でもMarkdown でもスライド作成可能 スライドを縦と横に展開可能 Google スライドでできることと同等のことができる <!-- .slide: style="color: white; text-align: left;" --> ## ぶりおがタコスを好きな理由<!-- .element: style="color: white - 肉の種類 - 豊富なトッピング - お酒との相性 ---
27. reveal.js 残念だった点 PDF 出力が動作しない Tailwind 競合して文字色が変わらなかった
28. まとめ reveal.js はスライドをマークダウンやHTML でかけるだけでなく、 プレゼンのための機能を提供してくれる 作成から登壇、共有まで全てを担えるものを作れる 自分だけのスライドデッキめちゃくちゃカッコいい！