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

HyperappでMarkdownエディタを作って薄い本を書きたい

4dde07a2b63c5173af76dd473bc52c00?s=47 atsuco
March 30, 2018

 HyperappでMarkdownエディタを作って薄い本を書きたい

2018/03/30 We Are JavaScripters!@17thの発表資料です

4dde07a2b63c5173af76dd473bc52c00?s=128

atsuco

March 30, 2018
Tweet

More Decks by atsuco

Other Decks in Programming

Transcript

  1. )ZQFSBQQͰ.BSLEPXOΤσΟλΛ ࡞ͬͯബ͍ຊΛॻ͖͍ͨ 8F"SF+BWB4DSJQUFST!UI !BUTVDP@

  2. ΞαΦΧΞπί!BUTVDP@ ϑϦʔϥϯε ϑϩϯτΤϯυΤϯδχΞʗ8FCσβΠφʔ ೣ೿ͷ؁ౘɺң͕௧͍ܥ8FC԰ ʙɹ8F+4ӡӦ

  3. None
  4. ݘςτϥʴ ϑϩϯτΤϯυΤϯδχΞਓͷٕज़ܥಉਓαʔΫϧɻ ʹ։࠵͞Εٕͨज़ॻయʹͯɺ ʮΠψͰ΋Θ͔Δ8FC$PNQPOFOUTʯͱ͍͏ຊΛ൦෍ɻ ຯΛ͠Ίͨզʑ͸ٕज़ॻయͰͷ৽ץ൦෍Λ໨࿦Ή΋ɺ ਐ௙͕ո͍͠ɻ

  5. 8F+4!UIͰ)ZQFSBQQͷίʔυϦʔσΟϯάͨ͠͠ɺ ͔͔ͤͬͩ͘Β͜ΕͰҰ࡭ॻ͖͍ͨ αϯϓϧʹ.BSLEPXOΤσΟλͰ΋ ࡞ͬͨΒ͍͍Μ͡Όͳ͍ʁ

  6. ৽ץͷςʔϚʹͯ͠ ͍ͭͰʹ8F+4ͷωλʹ͠Α͏

  7. 8IBUJT)ZQFSBQQ  +BWB4DSJQU੡௒ܰྔϏϡʔϥΠϒϥϦ ͦͷଞϥΠϒϥϦʹґଘͤͣɺ͘͘͞͞࢖͑Δͷ͕ૉఢɻ Ծ૝%0.ʗεςʔτ؅ཧʗΠϕϯτϋϯυϦϯά͕ػೳͷશͯ Ͱɺֶशίετ͕௿͍ͷ΋ັྗɻ

  8. ΅Μ΍Γͨ͠σϞ

  9. None
  10. Ͱ͖Δ͜ͱ ✦ .BSLEPXOೖྗͷϦΞϧλΠϜϓϨϏϡʔ ✦ ϓϨϏϡʔελΠϧͷมߋ ✦ .BSLEPXOه๏ͷิ׬ૠೖ .BEFJO 8FCQBDL )ZQFSBQQ

    NBSLFEKT FDU ੡࡞࣌ؒɿ࣌ؒ͘Β͍ ˞؀ڥߏஙʹ࣌ؒ࢖ͬͨ
  11. Α͍ εςʔτͷ؂ࢹɾϏϡʔͷߋ৽ʹશৼΓ͍ͯ͠ΔͷͰɺͱʹ͔ ͘γϯϓϧͰΘ͔Γ΍͍͢ɻ +49͕࢖͑ΔͷͰίϯϙʔωϯτͷݟ௨͕͍͍͠ɺؾ͕͢Δɻ <button onclick={() => actions.down(1)}>-</button> h("button", {

    onclick: () => actions.down(1) }, "-") ˣ
  12. Ͳ͏͠Α͏ UFYUBSFBͷೖྗΛϓϨϏϡʔ͢ΔͷʹJOOFS)5.-Λ࢖͍ͬͯΔ ͷͰͲ͏ʹ͔͍ͨ͠ɺͱ͍͏͔͔ͤͬͩ͘͠+49Ͱ؅ཧ͍ͨ͠ɻ <section id='previewHtml'> <div id='preview' className={state.previewType} innerHTML={state.preview}></div> </section>

  13. ✦ .BSLEPXOˠ+49ʹม׵ͯ͠΋ʮ+49ܗࣜͷจࣈྻʯʹͳΔ͚ͩ Ͱʮ+49Λೝࣝͯ͠ඳը͢Δʯ͜ͱ͕ग़དྷͳ͍ɺͭΒ͍

  14. ͦͷଞ͜Ε͔Β΍Γ͍ͨ͜ͱ ✦ ίʔυϋΠϥΠτ ✦ ೖྗิ׬͋ͨΓͷॲཧΛ੔͑Δ ✦ ίϯϙʔωϯτ୯Ґʹ෼ׂ ✦ ݪߘΛॻ͘

  15. ͋Γ͕ͱ͏͍͟͝·ͨ͠ ࣥචؤுΓ·͢