Slide 1

Slide 1 text

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

Slide 2

Slide 2 text

Daichi Ishikawa / @nicedchy 2018/11 - piece of cake, inc. note ͷ ϑϩϯτΤϯυϦϓϨΠεΛ୲౰ Vue.js Japan User Group Staff Who am I

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

Work in Progress Release note https://note.mu/noteeng/m/me7637ba82821

Slide 7

Slide 7 text

Angular.js

Slide 8

Slide 8 text

Nuxt.js

Slide 9

Slide 9 text

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

Slide 10

Slide 10 text

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

Slide 11

Slide 11 text

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

Slide 12

Slide 12 text

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

Slide 13

Slide 13 text

ελʔτΞοϓ໨ઢͰͷ Nuxt.js ͷڧΈ ࠷৽ͷϑϩϯτΤϯυ DX ͕ڗडͰ͖Δ ɹɾVue.js ΤίγεςϜɺίϛϡχςΟͷόοΫΞοϓ ɹɾVSCode & TypeScript (WIP) ɹɾSPA ͷٕज़Ͱ BFF ͷߏ੒͢ΔͳͲॊೈͳબ୒ࢶ Nuxt.js Λ࠾༻ͯ͠Α͔ͬͨ࿩

Slide 14

Slide 14 text

Nuxt.js Λ࠾༻ͯ͠Α͔ͬͨ࿩ ελʔτΞοϓ໨ઢͰͷ Nuxt.js ͷڧΈ ΧϦΧϦνϡʔχϯάͷ౔୆͕طʹग़དྷ্͕͍ͬͯΔ ɹɾCode Splitting / Smart Prefetch / PWA etc. ɹ εϩʔΫΤϦΛ௚͢౳ຊ࣭తͳվળʹूதͰ͖Δ

Slide 15

Slide 15 text

ελʔτΞοϓ໨ઢͰͷ Nuxt.js ͷڧΈ ݸਓతʹ࠾༻ʹରͯ͠΋ޮՌΞϦ ɹɾVueFes લ 4ਓ => 7ਓ Nuxt.js Λ࠾༻ͯ͠Α͔ͬͨ࿩

Slide 16

Slide 16 text

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

Slide 17

Slide 17 text

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

Slide 18

Slide 18 text

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

Slide 19

Slide 19 text

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

Slide 20

Slide 20 text

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

Slide 21

Slide 21 text

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

Slide 22

Slide 22 text

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

Slide 23

Slide 23 text

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

Slide 24

Slide 24 text

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

Slide 25

Slide 25 text

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

Slide 26

Slide 26 text

Goodbye Lambda note ͕ࢭ·ͬͨ೔

Slide 27

Slide 27 text

Hello
 Elastic Beanstalk note ͕ࢭ·ͬͨ೔

Slide 28

Slide 28 text

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

Slide 29

Slide 29 text

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

Slide 30

Slide 30 text

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

Slide 31

Slide 31 text

ര଎ʂnote ΧΠθϯνʔϜ

Slide 32

Slide 32 text

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

Slide 33

Slide 33 text

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

Slide 34

Slide 34 text

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

Slide 35

Slide 35 text

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

Slide 36

Slide 36 text

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

Slide 37

Slide 37 text

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

Slide 38

Slide 38 text

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

Slide 39

Slide 39 text

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

Slide 40

Slide 40 text

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

Slide 41

Slide 41 text

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

Slide 42

Slide 42 text

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

Slide 43

Slide 43 text

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

Slide 44

Slide 44 text

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

Slide 45

Slide 45 text

Thanks!