nagatea/introduction_marpit.md Secret

## introduction_marpit.md

      
    Raw
  

              introduction_marpit.md
            
          
  marp
  size
  theme
  paginate
  backgroundColor
  backgroundImage
  style
  
  
  true
  58140
  gaia
  false
  white
  url(thema.png)
  section {
  padding-top: 80px;
}
footer {
  margin-left: 20px;
}
h1 {
  padding-top: 100px;
}
h2 {
  font-weight: 100;
}
h3 {
  margin-top: 10px;
  font-weight: 100;
  color: #11a3d4;
}
h4 {
  font-weight: 100;
}
ul li {
  padding-bottom: 20px;
}
ul ul li {
  padding-bottom: 0px;
}
code {
  background: #eee;
  color: #000;
}

  
Marpitの紹介

@nagatech
2019年9月24日 #らんぷろ_LabBase

自己紹介


nagatech (ながてち, Twitter: @nagatech_i)
東京工業大学 情報理工学院 数理・計算科学系4年
traP SysAd班 booQチームリーダー
アイドルマスターシリーズと音楽ゲームが大好き


みなさん


Marpit 知ってますか？


Marpitとは


Marpitとは


このスライドです！


Marpitとは


Markdownからスライドを作成するためのフレームワーク
このスライドはMarpitで作られています
以降、Marpitでできること紹介


Marpitでできること

Markdownをそのままスライドにできる


---がページの区切り
タイトルは#
見出しが##
・は*で表示

インデントも対応してる


つまりMarkdownの記法がそのまま資料作成に使える


Marpitでできること

画像の埋め込み


![](image.png)で画像表示
![w:600px](image.png)で横幅指定もできる
![bg](image.png)で背景指定

このスライドの背景はそういうこと


Marpitでできること

HTMLタグの埋め込み・CSSの適用


レイアウトの微調整もできる！！！


頑張れば画像の回り込みもできるぞ！！！！！！！！！！！！


Marpitのメリット


LT資料の作成が簡単にできる
好きなエディタで資料作成ができる

スマホのメモ帳とかでもお気軽資料作成
VSCodeなら拡張機能で確認しながら作成できる


Gitでバージョン管理ができる


Marpitのデメリット


デザインは商用アプリケーションに負ける

Power PointとかKeynoteとか
それはそう
ある程度ならHTML・CSSでカバーできる


そこそこ学習コストがかかる

おもにレイアウトまわり
HTML・CSSの勉強にもなって圧倒的成長💪😤


まとめ


MarpitはMarkdownからスライドを作成するための
フレームワーク
Markdownの記法で直感的にスライド作成ができる
HTML・CSSでレイアウトを調整できる
みんなもMarpitで資料作成しよう！！！