Tweet
Tweet

Slide 1

Slide 1 text

-*/&Ϡϑʔʷ%FOP-BOE*OD.FFUVQ -*/&εΩϚχͷϑϩϯτΤϯυ։ൃʹ %FOPΛ࠾༻ͨ͠ཧ༝ -*/&Ϡϑʔגࣜձࣾ ߵ૥࿨࢘

Slide 2

Slide 2 text

ߵ૥࿨࢘ ,B[VTIJ,POPTV -*/&Ϡϑʔגࣜձࣾιϑτ΢ΣΞΤϯδχΞ !LB[VTIJLPOPTV ೥-*/&גࣜձࣾʢ౰࣌ʣʹ৽ଔೖࣾ ΤϯδχΞϦϯάϚωʔδϟʔɾςοΫϦʔυ ʮ-*/&εΩϚχʯϑϩϯτΤϯυνʔϜ

Slide 3

Slide 3 text

τϐοΫ ͳͥ%FOPΛ࠾༻͔ͨ͠ %FOPಋೖΛৼΓฦͬͯ %FOPΛͲͷΑ͏ʹ׆༻͍ͯ͠Δ͔

Slide 4

Slide 4 text

τϐοΫ ͳͥ%FOPΛ࠾༻͔ͨ͠ %FOPಋೖΛৼΓฦͬͯ %FOPΛͲͷΑ͏ʹ׆༻͍ͯ͠Δ͔

Slide 5

Slide 5 text

എܠrٕज़બఆͷߟ͑ํ ϛχϚϜͳબ୒ͷੵΈॏͶ ෳࡶͳཁ݅΁ͷରԠ ϩοΫΠϯͷճආ "MMJOPOFͳιϦϡʔγϣϯ ΤίγεςϜϩοΫΠϯ ٕज़తෛ࠴ͷϦεΫ αϓϥΠνΣʔϯ߈ܸ

Slide 6

Slide 6 text

ϓϩμΫτͷϦχϡʔΞϧͱ͍͏νϟϯε ϥϯλΠϜ͸Ͳ͏͢Δ͔ʁ 1VSF41"

Slide 7

Slide 7 text

+BWB4DSJQUϥϯλΠϜͷͭͷإ ։ൃ؀ڥ 4FSWFS$MPVE #SPXTFS

Slide 8

Slide 8 text

/PEFKTΛʮਖ਼͘͠ʯ؀ڥߏங͢Δ࡞ۀɺർΕ·ͤΜ͔ʁ

Slide 9

Slide 9 text

ർΕΔϙΠϯτ w &4.PEVMF4ZOUBYͰॻ͍͍ͯΔ͚Ͳ$PNNPO+4ͱ࣮ͯ͠ߦ͞ΕΔίʔυ w ࣮ߦ؀ڥɾϥϯλΠϜʹ͋ΘͤͯઃఆඞཁͳUTDPO fi HKTPO w 5ZQF4DSJQUΛ࣮ߦ͢ΔͳΒඞཁͳUTOPEFUTY w Ϧϯλʔͷઃఆ ΞϓϦέʔγϣϯ։ൃऀʹͱͬͯΤίεγςϜ͕ෳࡶ͗͢Δ

Slide 10

Slide 10 text

%FOPΛ࠾༻ͨ͠ཧ༝ w 8FCඪ४ʹ४ڌ͢Δ࢟੎ w ͻͱͭͻͱͭͷࣄ߲Λݕ౼͠ͳͯ͘΋GVUVSFQSPPGͳ͜ͱ͕Ͱ͖Δ w ʮͰ͖ͳ͍͜ͱʯ͕ଟ͍ͷ͸͍͍͜ͱ

Slide 11

Slide 11 text

τϐοΫ ͳͥ%FOPΛ࠾༻͔ͨ͠ %FOPಋೖΛৼΓฦͬͯ %FOPΛͲͷΑ͏ʹ׆༻͍ͯ͠Δ͔

Slide 12

Slide 12 text

%FOPΛͲͷΑ͏ʹ׆༻͍ͯ͠Δ͔ w /PEFKTޓ׵ͳQBDLBHFNBOBHFSͱͯ͠࢖͍ͬͯΔΘ͚Ͱ͸ͳ͍ w QBDLBHFKTPOͷ࡟আ w ͢΂ͯͷίʔυ͸%FOPͰ࣮ߦ w 7JUF 7JUFTUPO%FOP

Slide 13

Slide 13 text

5ZQF4DSJQU w AWJUFDPO fi HNUTA΍։ൃ࣌ʹ࢖༻͢ΔεΫϦϓτྨʹ͍ͭͯ͸AEFOP DIFDLAΛ࢖༻ w ϑϩϯτΤϯυͷίʔυʹ͍ͭͯ͸EFOP্ͰAUTDAΛ࣮ߦ w ϑϩϯτΤϯυ࣮૷ͱςετͦΕͧΕͷͨΊʹUTDPO fi HKTPOΛϝϯςφϯε

Slide 14

Slide 14 text

'PSNBUUFS-JOUFS w 'PSNBUUFS͸1SFUUJFSΛ࢖༻ w -JOUFS͸TSDʹ͍ͭͯ͸&4-JOU ͦΕҎ֎͸EFOP@MJOU

Slide 15

Slide 15 text

τϐοΫ ͳͥ%FOPΛ࠾༻͔ͨ͠ %FOPಋೖΛৼΓฦͬͯ %FOPΛͲͷΑ͏ʹ׆༻͍ͯ͠Δ͔

Slide 16

Slide 16 text

'SPOUFOE։ൃͷπʔϧ܈Λಈ͔͢؀ڥͱͯ͠ w ϑϩϯτΤϯυ։ൃ؀ڥͷηοτΞοϓ͕γϯϓϧʹͳͬͨ w %FOPͰಈ࡞͢Δ5ZQF4DSJQUϑΝΠϧʹ͍ͭͯ͸ઃఆͷ؅ཧΛ%FOPʹ೚ͤͨ w ։ൃ؀ڥͰ࣮ߦ͞ΕΔίʔυͷϥϯλΠϜͱͯ͠ͱͯ΋ັྗత

Slide 17

Slide 17 text

ϒϥ΢βͰಈ͔͢ίʔυͷ։ൃ؀ڥͱͯ͠ w EFOP@GNUͩͱDTTUFNQMBUFMJUFSBMʹରԠͰ͖ͣ w EFOP@MJOU͸ϓϥάΠϯγεςϜ͕ະ੒ख़ w EFOPDIFDL͸EFOPͰಈ࡞͢Δίʔυ͕લఏ w ࠓޙͷEFOP@MJOUͷಈ͖ʹظ଴

Slide 18

Slide 18 text

ґଘύοέʔδͷ؅ཧ w QBDLBHFKTPOΛ୤٫Ͱ͖ͨ w OPEF@NPEVMFT͸ϒϥ΢βͰ࣮ߦ͞ΕΔίʔυͷϑΝΠϧஔ͖৔ʹͳͬͨͷ Ͱɺೝ஌ίετ͕௿Լͨ͠

Slide 19

Slide 19 text

{ "dependencies": { "express": "4.19.2", "react": "18.3.1", "react-dom": "18.3.1" } } &YQSFTTͱҰॹʹͳΒͿ3FBDUͷҙຯʁ

Slide 20

Slide 20 text

import { defineConfig } from 'npm:vite'; import react from 'npm:@vitejs/plugin-react'; // @deno-types="npm:@types/react@18.2.66" import 'npm:react@18.2.0'; // @deno-types="npm:@types/react-dom@18.2.22" import 'npm:react-dom@18.2.0'; // https://vitejs.dev/config/ export default defineConfig({ plugins: [react()], }); 'SPOUFOEͷґଘ͸WJUFDPO fi HNUTͷ෭࡞༻ʹͳͬͨ

Slide 21

Slide 21 text

-PDLϑΝΠϧͷ໰୊ w ಛఆͷύοέʔδ͚ͩΞοϓάϨʔυͨ͠MPDLϑΝΠϧΛ࡞Εͳ͍ w AOQNJGPP!MBUFTUA w %FOPࣾͱͷϛʔςΟϯάͰɺෳ਺ͷMPDLϑΝΠϧ͕࡞ΔΞΠσΞ͕ग़ͨ w -PDLϑΝΠϧΛ෼ׂ͢Δ͜ͱͰ1SFUUJFS &4-JOU͸ৗʹ࠷৽൛Λ࢖༻ w QBDLBHFKTPOͱ͍͏֓೦͕ͳ͍͜ͱʹΑΔ෭࣍తͳϝϦοτ

Slide 22

Slide 22 text

·ͱΊ w ͜Ε·ͰϥϯλΠϜબఆαʔόͷ࿩͕த৺ w +BWB4DSJQUϥϯλΠϜʹ͸ෳ਺ͷإ͕͋Δ w %FOPͰ'SPOUFOE։ൃΛγϯϓϧʹ w 'SPOUFOEͷπʔϧ܈Λಈ͔͢؀ڥͱͯ͠ʜ✅ ϒϥ΢βͰ࣮ߦ͞ΕΔίʔυͷ։ൃ؀ڥͱͯ͠ʜ📋

Slide 23

Slide 23 text

5IBOLZPV