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

note カイゼンやっていき💪

note カイゼンやっていき💪

Frontend de KANPAI! #6 の登壇資料です。
スタートアップにおける Nuxt.js 採用の強み、note のリプレイス、Serverless 構成をやめた話しました。
https://frokan.connpass.com/event/120702/

054deedcc25cbeacb6cd34c43b7df26a?s=128

Daichi Ishikawa

March 15, 2019
Tweet

Transcript

  1. Daichi Ishikawa Frontend de KANPAI! #6 note ΧΠθϯ΍͍͖ͬͯ

  2. Daichi Ishikawa / @nicedchy 2018/11 - piece of cake, inc.

    note ͷ ϑϩϯτΤϯυϦϓϨΠεΛ୲౰ Vue.js Japan User Group Staff Who am I
  3. None
  4. None
  5. None
  6. Work in Progress Release note https://note.mu/noteeng/m/me7637ba82821

  7. Angular.js

  8. Nuxt.js

  9. ࠓ೔ͷςʔϚ͸ʮΈΜͳͷαʔϏεͮ͘Γʯ Agenda

  10. ɾNuxt.jsΛ࠾༻ͯ͠Α͔ͬͨ࿩ ɾnoteϦϓϨΠεதͷۤ࿑࿩ʢϝΠϯʣ Agenda

  11. Agenda ɾNuxt.jsΛ࠾༻ͯ͠Α͔ͬͨ࿩ ɾnoteϦϓϨΠεதͷۤ࿑࿩

  12. Nuxt.js Λ࠾༻ͯ͠Α͔ͬͨ࿩ ελʔτΞοϓ໨ઢͰͷ Nuxt.js ͷڧΈ

  13. ελʔτΞοϓ໨ઢͰͷ Nuxt.js ͷڧΈ ࠷৽ͷϑϩϯτΤϯυ DX ͕ڗडͰ͖Δ ɹɾVue.js ΤίγεςϜɺίϛϡχςΟͷόοΫΞοϓ ɹɾVSCode &

    TypeScript (WIP) ɹɾSPA ͷٕज़Ͱ BFF ͷߏ੒͢ΔͳͲॊೈͳબ୒ࢶ Nuxt.js Λ࠾༻ͯ͠Α͔ͬͨ࿩
  14. Nuxt.js Λ࠾༻ͯ͠Α͔ͬͨ࿩ ελʔτΞοϓ໨ઢͰͷ Nuxt.js ͷڧΈ ΧϦΧϦνϡʔχϯάͷ౔୆͕طʹग़དྷ্͕͍ͬͯΔ ɹɾCode Splitting / Smart

    Prefetch / PWA etc. ɹ εϩʔΫΤϦΛ௚͢౳ຊ࣭తͳվળʹूதͰ͖Δ
  15. ελʔτΞοϓ໨ઢͰͷ Nuxt.js ͷڧΈ ݸਓతʹ࠾༻ʹରͯ͠΋ޮՌΞϦ ɹɾVueFes લ 4ਓ => 7ਓ Nuxt.js

    Λ࠾༻ͯ͠Α͔ͬͨ࿩
  16. ɾNuxt.jsΛ࠾༻ͯ͠Α͔ͬͨ࿩ ɾnoteϦϓϨΠεதͷۤ࿑࿩ Agenda

  17. ɾnote͕ࢭ·ͬͨ೔ ɾര଎ʂnoteΧΠθϯνʔϜ note ϦϓϨΠεதͷۤ࿑࿩

  18. ɾnote͕ࢭ·ͬͨ೔ ɾര଎ʂnoteΧΠθϯνʔϜ note ϦϓϨΠεதͷۤ࿑࿩

  19. ຊ൪Lambda؀ڥ͕Ұ೔ࢭ·ͬͨ࿩ note ͕ࢭ·ͬͨ೔

  20. note ͕ࢭ·ͬͨ೔ ग़ۈͨ͠Β Կ΋ͯ͠ͳ͍ͷʹյΕͯͨ

  21. note ͕ࢭ·ͬͨ೔ ౰࣌ͷΠϯϑϥߏ੒

  22. ىͬͨ͜͜ͱ ɾશͯͷϒϥ΢βͰTUBUVTDPEF ɾ͕ͩDVSMͰਖ਼ৗʹ/VYUͷϨεϙϯε͸ฦΔ ɾSFRVFTUIFBEFS͕ո͍͠ʁ ɾSF*OWFOUޙͳͷͰ-BNCEBʹมߋ͕ೖ͔ͬͨΒʁ ɾBXTTFSWFSMFTTFYQSFTT͕DPOOFDUJPOFSSPS note ͕ࢭ·ͬͨ೔

  23. note ͕ࢭ·ͬͨ೔ ֘౰ͷ Issue https://github.com/awslabs/aws-serverless-express/issues/199

  24. ະͩݪҼ͕Ϧϙʔτ͞Ε͍ͯͳ͍ note ͕ࢭ·ͬͨ೔

  25. ΋͠׬શҠߦޙʹى͍ͬͯͨ͜Βɾɾɾ ӡ༻͠ଓ͚͍ͯ͘ͷ͸ϦεΫ͕ॏ͗͢Δ note ͕ࢭ·ͬͨ೔

  26. Goodbye Lambda note ͕ࢭ·ͬͨ೔

  27. Hello
 Elastic Beanstalk note ͕ࢭ·ͬͨ೔

  28. ৼΓฦΔͱ ɾগͳ͍ϦιʔεͷதͰɺΠϯϑϥͷ໰୊͸͔ͳΓΫϦ ςΟΧϧ ɾશެ։લͩͬͨͷͰϐϘοτͰ͖ͨ ɾ#''ͲΜͳΠϯϑϥߏ੒ʹ΋ରԠͰ͖࠷ߴ ɾ-BNCEB'VODUJPOॻ͍ͯͳͯ͘ॿ͔ͬͨ note ͕ࢭ·ͬͨ೔

  29. ɾnote͕ࢭ·ͬͨ೔ ɾര଎ʂnoteΧΠθϯνʔϜ note ϦϓϨΠεதͷۤ࿑࿩

  30. note ͷΧΠθϯࠩ෼ٵऩͷ࿩ ര଎ʂnote ΧΠθϯνʔϜ

  31. ര଎ʂnote ΧΠθϯνʔϜ

  32. ڈ೥͸େ͖͘ඈ༂ͨ͠ΧΠθϯνʔϜ ϦϦʔεͨ͠ࢪࡦ਺͸݅Ҏ্ ര଎ʂnote ΧΠθϯνʔϜ

  33. ര଎ʂnote ΧΠθϯνʔϜ PV UU ͱ΋ʹ̍೥ؒͰ2ഒʹͳΓ·ͨ͠

  34. ࠷ۙͷେ͖͍ϦϦʔε ɾApple Music, Spotify ຒΊࠐΈ ɾϑΝΠϧΞοϓϩʔυػೳ ɾ໨࣍ػೳ ɾίϯςετϖʔδ UI ΧΠθϯ

    ര଎ʂnote ΧΠθϯνʔϜ
  35. note ͷࠜװʹͳΔ editor ը໘΍هࣄը໘ʹߋ৽ස౓ߴ ര଎ʂnote ΧΠθϯνʔϜ

  36. ޻਺ॏ͍ͨ΋ͷ΋ଟ͍ͨΊɺ Nuxt νʔϜͰೋॏϝϯς͕΍͹͍ ര଎ʂnote ΧΠθϯνʔϜ

  37. Nuxt Ͱ࡞ͬͯɺຊ൪ͷτϥϑΟοΫ ྲྀͤ͹͍͍Μ͡Όͳ͍ʁ ര଎ʂnote ΧΠθϯνʔϜ

  38. ϓϩμΫγϣϯϦϦʔεୈҰ஄  6*ΧΠθϯ ര଎ʂnote ΧΠθϯνʔϜ

  39. ֮ޛΛܾΊ͍ͯͧ͘ʂ ര଎ʂnote ΧΠθϯνʔϜ

  40. ֮ޛΛܾΊͨ݁Ռ ɾ3/15 ݱࡏ 5 ը໘͕ Nuxt ͰՔಇத ɾΠϯϑϥͷෛՙࢼݧ΋݉ͶΔ͜ͱ͕Ͱ͖ͯΔ ɾNuxt νʔϜͷ͓৲ʹՐ͕͍ͭͨ

    ര଎ʂnote ΧΠθϯνʔϜ
  41. ͓৲ʹՐ͕͍ͭͨ ɾApple Music, Spotify ຒΊࠐΈ ɾϑΝΠϧΞοϓϩʔυػೳ ɾ໨࣍ػೳ ര଎ʂnote ΧΠθϯνʔϜ

  42. 4݄த०ࠒ Nuxt ൛ͰϦϦʔε༧ఆ ര଎ʂnote ΧΠθϯνʔϜ

  43. ֮ޛΛܾΊ͍ͯͧ͘ ര଎ʂnote ΧΠθϯνʔϜ

  44. We are hiring Markdown ରԠͯ͘͠ΕΔΤϯδχΞืूத https://www.wantedly.com/projects/208206

  45. Thanks!