Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Markdown and WYSIWYG

Markdown and WYSIWYG

#markdownnight

Sotaro Karasawa

August 29, 2017
Tweet

More Decks by Sotaro Karasawa

Other Decks in Technology

Transcript

  1. TBD in Markdown Night
    Sotaro Karasawa / @sotarok
    Product Owner of Crowi

    View Slide

  2. とつぜんですがみなさん

    View Slide

  3. Markdown で書ける最強の Wiki といえば?

    View Slide

  4. そう、

    View Slide

  5. http://site.crowi.wiki/

    View Slide

  6. ですよね!

    View Slide

  7. 自己紹介: @sotarok / Sotaro Karasawa
    • @sotarok
    • そうたろうです
    • Mercari, Inc で働いています
    • Crowi という Wiki エンジン作ってます
    • 好きなもの

    View Slide

  8. せっかくだから宣伝
    • Crowi
    • Wiki エンジンです
    • OSS でやってます
    • https://github.com/crowi/crowi
    • 2012年ごろからつくってます
    • 元々は Crocos (クロコス) という会社の社内 Wiki として作ってました
    • Crocos + Wiki で Crowi (クロウィ)
    • あ、そうそうステッカーあります
    •      そのへんのテーブルに  
    →→→
    • 社内でも使ってます

    View Slide

  9. Markdown parser
    • cmark じゃない
    • marked っていうやつですよ
    • remark よさそう今日来た甲斐がありました
    • クライアントでレンダリングしている (JS)
    • Preprocessor と Postprocessor を書いてる
    • (はいはい拡張拡張 …)
    • 結構JSっぽくない描き方しててダサいからアレだけど
    • markdownの補正、生成されたHTMLの補正
    • Plugin 機構ほしいですよね
    • ユーザーによりそった処理
    • 個人的な思いとしては、強いものが勝つからそれでいいか (標準化は大事ではあ
    るが)

    View Slide

  10. ところで

    View Slide

  11. みなさん
    Markdown は好きですか?

    View Slide

  12. • 簡易な記法わかりやすい
    • 対応しているサービスが多い
    • GitHub とか
    • というかまあ GitHub
    • Portability という考え方
    • (これはかなり重要だったりするのでは)
    • 生テキストで見ても見やすい
    • (= テキストエディタでも書きやすい)
    • テキストエディタで書いて、Paste すれば使えるとか
    • みんな WYSIWYG 好きじゃない
    • 良い思い出がない
    • 余計なことされる
    Markdown が好きな理由 (多分)

    View Slide

  13. 好き好き
    Markdown

    View Slide

  14. と思ってたんですが (本題)

    View Slide

  15. 本当にそうですか?

    View Slide

  16. WYSIWYG について
    ちゃんと考えてる

    View Slide

  17. きっかけ

    View Slide

  18. • “見たまま編集”
    • Preview ペインいらない
    • 記法に慣れていない人に優しい
    • 非エンジニアのトレーニングがいらない
    • そんなに苦労はしない、簡易な記法であることは前述の通り
    • 非エンジニアが書けない、とは言わない。もちろん、書いて くれている、メルカリのCS社員も
    書いてる
    • でも、WYSIWYG とどっちがわかりやすいかと言われたら、正直 … 明白
    • (みんな目を覚ますんだ!)
    • 付加機能の拡張表現
    • 同時編集
    • contenteditable は DOM が前提だからね、という言い訳
    • TODO化
    • HTML表現
    • メディア系の埋め込み
    WYSIWYG ってすごい

    View Slide

  19. はりつけたい
    # sotarok
    ## 自己紹介
    - 名前: Sotaro Karasawa / 柄沢 聡太郎
    - sotarok → 「そうたろっく」ではなく「そうたろうけー」
    - 呼び名は「そうたろう」または「そうたろうさん」的なやつだと喜びます
    - 誕生日: 9/15
    ## いつもいる場所
    - 六本木または吉祥寺
    - 本当は三鷹駅です
    - “三鷹” っていうと何故か田舎感があり (一駅しか違わないのに) 吉祥寺に住んでること
    にしてます

    View Slide

  20. はりつけた

    View Slide

  21. 本質的には
    • 文章が気持ちよく書ければ良い
    • 余計なことされず、きれいに表示される、軽快に動作してくれる
    • ちなみに
    • Google Docs とかも、よくはできている
    • 強いて cons を挙げれば
    • Portability
    • 逆ができるならば?
    • (例えば、他のサービスへの連携が Markdown でされる)
    • (contenteditable → markdown)
    • (いやーそれつくるのだるいよねえ)

    View Slide

  22. 結論

    View Slide

  23. Dropbox Paper いいよ
    (そんなまさかな結論)
    (うそ、結論はネタです)
    (Markdown 以外も良いケースあるよねってだけの話なのでした)
    (思考停止しない訓練として)

    View Slide

  24. あ、あと最後に

    View Slide

  25. メルカリ、エンジニア募集してます
    (もちろん宣伝させてください)
    https://www.mercari.com/jp/jobs/

    View Slide

  26. Crowi もエンジニア募集してます
    (メルカリ社でフルタイムでCrowi開発し
    たい、とかでも相談可)

    View Slide

  27. ありがとうございました

    View Slide