React.jsの紹介

3FBDUKTͷ঺հ 7FSTJPO٢ా༟ඒ

ຊ೔಺༰ ࣗݾ঺հ +BWB4DSJQUͷྺ࢙ &4 &4 41" 41"༻ϥΠϒϥϦʔɾ ϑϨʔϜϫʔΫ 3FBDUKT
3FBDUKTσϞ 3FEVY Ϟμϯ+4։ൃ؀ڥ 8FCҎ֎Ͱͷ +BWB4DSJQUར༻ ͓஌Βͤɾ·ͱΊ 2" 2

3FBDUKT͍͍Ͷʂ ΋ͬͱ+BWB4DSJQUͷࣄΛ஌Ζ͏Α 3FBDUKT 3FEVYͷ࠷৽ͷ৘ใͳ Ͳ͸࿩͠·ͤΜ 3 ຊ೔͓఻͍͑ͨ͠ࣄ

ࣗݾ঺հ

٢ా༟ඒ :PTIJEB:VVNJ ༗ݶձࣾ&:0⒏DF IUUQXXXFZP⒏DFDPN #MPHIUUQZVVNJIBUFOBCMPHDPN 5XJUUFS!ZVVNJ 5

աڈ େֶͷ޻ֶ෦ଔۀ ଔۀݚڀͰ-JTQॲཧܥʹؔΘΔ ૊ࠐܥͷձࣾʹब৬ $"%ͷϕϯνϟʔاۀʹస৬ $"%ͷίΞ෦෼ͷ։ൃ γϦίϯόϨʔΛ๚໰ͨ͠Γɺถࠃਓͱ࢓ࣄΛ ܦݧ 6

̌ੈل͕ऴΘΔͷͰಠཱ ΧϦϑΥϧχΞͷ੨͍ۭΛΈͨ ͋·ΓձࣾʹೃછΊͳ͍ਓͩͬͨ ωοτͷ࣌୅ʹͳͬͨ 7 IUUQCMPHMFYVFTDPKQIUNM͔Β

&:0⒏DF ೥ʹಠཱ ։ൃ 8FC 3VCZPO3BJMT J1IPOF ڭҭ ͓٬༷ͷ໰୊Λղܾ͢Δ*5ڭҭ 3VCZPO3BJMT
J1IPOF 8 3FBDUKT

&:0⒏DF։ൃ 8FC 9 w ΞδΞϦʔάΞΠεϗοέʔ wIUUQXXXBMIPDLZKQ wνʔϜɾબखͷ੒੷ूܭ w1FSMಠࣗϑϨʔϜϫʔΫ wΞϩϋύʔΫ wIUUQQBSLBMPIB
TUSFFUDPN w4/4 w+BWB4FBTBS wωοτγϣοϓ wIUUQXXXCPSPDPKQ w3BJMTK2VFSZ w34QFD$VDVNCFS w๖͑τʔΫ ੠༏ͱ4LZQF Ͱ͓࿩ wIUUQXXXNPFUBMLKQ w੠༏ͱͷձ࿩༧໿༧໿ w3BJMTK2VFSZ w34QFD3FRVFTU

&:0⒏DF։ൃ J1IPOF 10 ֆຊΞϓϦ J1IPOFJ1BE 5XFFUͳ͏ ແྉ ڭ͑ࢠ͕࡞ͬͨΞϓϦ

ࣥච 11

ߨԋ 12 RubyKaigi2008 Ruby World Conference 2013 Ruby Business Users
Conference 2014, 2015

࠷ۙͷ࢓ࣄ 13 ໿ສߦͷK2VFSZϕʔεͷ41"Λ 3FBDUKT΁Ҡߦ IUUQZVVNJIBUFOBCMPHDPNFOUSZ

+BWB4DSJQUੈքͷ Πϝʔδ

Ծઆ ࠷৽ͷ+BWB4DSJQUͷੈք͸Ұൠతͳ ιϑτ΢ΣΞɾΤϯδχΞʹ͸ɺ͋ ·Γ஌ΒΕͯͳ͍ͷͰ͸ʁ 15

8FCΞϓϦ։ൃͷੈքɾੲ 16 04 GSBNFXPSL "QQMJDBUJPO %BUB#BTF MBOHVBHF +BWB "41 1FSM
)5.- $44 +BWB4DSJQU (SBQIJDT σβΠφʔ ϓϩάϥϚʔ

17 04 GSBNFXPSL "QQMJDBUJPO %BUB#BTF MBOHVBHF +BWB $ 3VCZ 1)1
)5.- $44 +BWB4DSJQU (SBQIJDT σβΠφʔ ϓϩάϥϚʔ ϑϩϯτΤϯυΤϯδχΞ 8FCΞϓϦ։ൃͷੈքɾࠓ /PEFKT K2VFSZ "OHVMB 3FBDU

ࢲͷ஌͍ͬͯΔ ݴޠίϛϡχςΟͷڑ཭ 18 ࢀՃऀͷฏۉ೥ྸ +BWB 3VCZ ݸਓతͳΠϝʔδͰ͢ +BWB4DSJQU 4XJGU J04

+BWB4DSJQUͷ ྺ࢙

+BWB4DSJQUͷྺ࢙ 20 41" "KBY ҉ࠇظ 1995 2005 2010 2015 JavaScript஀ੜ
ECMAScript1 Gmail , Google Maps Google V8 CoffeeScript Node.js TypeScript ECMAScript6 Prototype.js jQuery Backbone.js Ember.js AngularJS React.js

ॳΊͯ঎༻8FCϒϥ΢βʔΛ࡞ͬͨ /FUTDBQFࣾͷ#SFOEBO&JDI͕ɺ ೥ʹ։ൃ͠ಉࣾͷϒϥ΢βʔʹ૊Έࠐ Μͩ େ͍ʹ஫໨͞Εɺͦͷޙ.JDSPTPGUͳͲͷϥΠόϧ اۀ΋ϒϥ΢βʔʹ+BWB4DSJQUʹ࣮૷ͨ͠ +BWBʙͱ͍͏໊લ͕෇͍͍ͯΔ͕+BWBݴޠͱ͸·ͬ ͨ͘ແԑɺ౰࣌+BWB͕஫໨͞Ε͍ͯͨͷͰϚʔέο ςΟϯάతʹ෇͚ΒΕͨ 21
+4ͷྺ࢙ɿ஀ੜ

֤ࣾͷϒϥ΢βʔͰ࢓༷͕ҧͬͨΓɺόά͕ ଟ͘ɺظ଴͞Εͨ΄Ͳʹ͸࢖ΘΕͳ͔ͬͨɻ ओʹΞϥʔτͷදࣔ΍ɺ΢Οϯυ΢ͷίϯτ ϩʔϧͳͲ؆୯ͳࣄʹ࢖ΘΕ͍ͯͨɻ 22 +4ͷྺ࢙ɿ҉ࠇظ

೥͜Ζ͔Βɺ(NBJM΍(PPHMF.BQͷΑ͏ ʹɺ+BWB4DSJQUΛ࢖͏ࣄͰ8FCΞϓϦͷ࢖͍ উखΛඈ༂తʹߴΊͨΞϓϦ͕ొ৔͠ɺ࠶౓ +BWB4DSJQUʹ஫໨͕ू·ΔΑ͏ʹͳͬͨɻ "KBY +BWB4DSJQU΋Ұਓલͷϓϩάϥϛϯάݴޠͱ͠ ͯͷ஍ҐΛཱ֬ͨ͠ 23 +4ͷྺ࢙ɿΧϜόοΫ

/PEFKTɿαʔόʔαΠυͷ+BWB4DSJQU؀ڥ ඇಉظ*0 ߴ଎ ඇৗʹߴ͍εέʔϥϏϦςΟʔ 24 +4ͷྺ࢙ɿݱࡏ େൃల

25 IUUQTXXXRVPSBDPN8IBUDPNQBOJFTBSFVTJOH/PEFKTJOQSPEVDUJPOΑΓ +4ͷྺ࢙ɿݱࡏ େൃల

41" 4JOHMF1BHF"QQMJDBUJPO ɿ6*ΛΫϥΠ ΞϯταΠυͷ+BWB4DSJQUͰશͯߦ͏ελΠϧ ͷ8FCΞϓϦ 3FBDU/BUJWFɿ+4 3FBDUKT Λ࢖ͬͨεϚϑΥ ΞϓϦ։ൃ؀ڥ &MFDUSPOɿ/PEFKT
$ISPOJVN $ISPNFͷΤ ϯδϯ Λ࢖͍ϚϧνϓϥοτϑΥʔϜͳ(6*πʔ ϧΛ࡞ΕΔϕʔε 26 +4ͷྺ࢙ɿݱࡏ େൃల

&4 &4 +BWB4DSJQUͷ৽͍͠࢓༷ &$."4DSJQU ͷ೥൛ ैདྷ&4ͱݺ͹Ε͍ͯͨ΋ͷ ͪͳΈʹݱࡏͷ+4͸&4 Ϋϥε΍਺ʑͷ৽͍͠จ๏͕ಋೖ͞Ε ॻ͖΍͕͢͞େ෯ʹ޲্ͨ͠ 28

&4 &4 ݱ࣌఺Ͱ͸ϒϥ΢βʔͷαϙʔτ͸׬શ Ͱ͸ͳ͍ ಛʹεϚϑΥͷϒϥ΢βʔ͸μϝ ݱࡏ͸&4͔Β&4ʹม׵͢Δπʔϧ ୅ ද#BCFM ౳Ͱม׵͠ར༻͞Ε͍ͯΔ 29
IUUQTLBOHBYHJUIVCJPDPNQBUUBCMFFTΑΓ

30 &4 &4 var PI = 3.141592 function square(x) {
return x * x; } function tax(n, rate) { if (rate == undefined) rate = 0.08; return Math.floor(n * rate); } const PI = 3.141592 square = (x) => x * x tax = (n, rate = 0.08) => Math.floor(n * rate) &4 &4

31 &4 &4 Jyanken = (function() { function Jyanken(hand) {
this.hand = hand; } jyanken.prototype.poi = function() { return this.hand = Math.floor(Math.random() * 3); }; jyanken.prototype.judge = function(your) { if (this.hand === your.hand) { return "Ҿ͖෼͚"; } else if ( ..লུ.. ) { return "উͪ"; } else { return "ෛ͚"; } }; return Jyanken; })(); class Jyanken { constructor(hand) { this.hand = hand } poi() { this.hand = Math.floor(Math.random() * 3) } judge(your) { if (this.hand === your.hand) { return "Ҿ͖෼͚" } else if ( ..লུ.. ) { return "উͪ" } else { return "ෛ͚" } } } &4 &4

32 &4 &4 +BWB4DSJQU"MUFSOBUJWFT $P⒎F4DSJQU ΋͏๨Ε·͠ΐ͏ 5ZQF4DSJQU ܕ͕޷͖ͳํ͸࢖͍·͠ΐ͏ 7JTVBM4UVEJP 8FC4UPSN
#BCFM ͳͲ͕ରԠ

41" 4JOHMF1BHF"QQMJDBUJPO

ݹ͖ྑ͖8FCΞϓϦ 34 controller model view HTML (css, image) request HTML
Server Browser

"KBYγϯϓϧ 35 controller model view HTML (css, image) request HTML
Server Browser JS request HTML

"KBYෳࡶ 36 controller model view HTML (css, image) request HTML
Server Browser JS request HTML state, data

41" 37 controller model request Server Browser JS controller model
view HTML css, image JSON iOS / Android request JSON $MJFOUTJEF.7$ͱݺ͹ΕΔࣄ΋͋Δ

41" ϝϦοτ αʔόʔͱ+4ͷॲཧͷ੾Γ෼͚͕ ໌֬ ൓Ԡͷૣ͍6*69ΛఏڙͰ͖Δ αʔόʔଆ͔Β͸εϚϑΥͱಉ༷ ʹѻ͑Δ 38

41" σϝϦοτ ݕࡧΤϯδϯରࡦ͕ඞཁ ݹ͍ϒϥ΢βʔ͸αϙʔτग़དྷͳ͍ ։ൃऀͷֶशίετ͕૿͑Δ 39

40 ຖ೥ͷΑ͏ʹφ΢ΠͷϥΠϒϥ ϦʔɾϑϨʔϜ͕ొ৔͍ͯͨ͠ 41"༻ϥΠϒϥϦʔɾϑϨʔϜϫʔΫ

41"༻ϥΠϒϥϦʔɾϑϨʔϜϫʔΫ #BDLCPOFKT .$ͷϕʔεͷΈఏڙ 41

41"༻ϥΠϒϥϦʔɾϑϨʔϜϫʔΫ "OHVMBS+4 ϑϧελοΫ ૒ํ޲όΠϯσΟϯά Ұ࣌ظ͸41"ͷຊ໋ͱݴΘΕ͍ͯͨ όʔδϣϯ̎͸ඇޓ׵ 42

41"༻ϥΠϒϥϦʔɾϑϨʔϜϫʔΫ &NCFSKT ϑϧελοΫ 3VCZPO3BJMTքͰ͸༗໊ 43

3FBDUKT

&:0⒏DF 3FBDUKT γϯϓϧͳϓϩάϥϛϯάϞσϧͱੑೳ Λཱ྆ ϝϯςφϯεੑ͕ߴ͍ίʔυ͕ॻ͚Δ 'BDFCPPL͕࣮ࡍʹ࢖͍ͬͯΔ࣮੷ 45

&:0⒏DF 3FBDUKT γϯϓϧͳϓϩάϥϛϯάϞσϧͱੑೳΛ ཱ྆ K2VFSZϖʔδͷͲͷ෦෼ΛͲ͏มߋ͢Δ ͱ͍͏ϓϩάϥϜΛॻ͔ͳ͍ͱ͍͚ͳ͍ 3FBDUαʔόʔαΠυͷWJFXͷΑ͏ʹϓ ϩάϥϜ͸ϖʔδશମΛඳը͢ΔίʔυΛ ॻ͚ͩ͘ 46

&:0⒏DF 3FBDUKT 7JSUVBM%0. 3FBDUKTͷද͕ࣔߴ଎ԽͰ͖Δٕज़ ϝϞϦʔ্ʹͷมߋલޙͷ%0.Λ࣋ͪɺ มߋ͕͋ͬͨ෦෼Λݕग़͠ɺຊ౰ʹมߋ͕ ඞཁͳ෦෼ͷΈΛը໘ʹ൓ө͢Δ 47

3FBDUKT 48 IUUQUFSPQBJOGPCMPHDIBOHFBOEJUTEFUFDUJPOJOKBWBTDSJQUGSBNFXPSLTIUNM ΑΓ 7JSUVBM%0. ϒϥ΢βʔ ը໘ +4 ϝϞϦʔ

&:0⒏DF 3FBDUKT ϝϯςφϯεੑ͕ߴ͍ίʔυ͕ॻ͚Δ ίϯϙʔωϯτࢦ޲ +4ͷதʹ)5.-Λॻ͘+49Λ࠾༻ 49

3FBDUKT 50

3FBDUKT 51

52 3FBDUKT ??

3FBDUKTσϞ ίʔυɿIUUQTHJUIVCDPNZVVNJSFBDU@KZBOLFO

3FBDUKT ίϯϙʔωϯτ $PNQPOFOUΛܧঝͨ͠Ϋϥε ϑϧػೳ ؔ਺ දࣔͷΈͷίϯϙʔωϯτ 54

3FBDUKTϕετϓϥΫςΟε 55 ίϯϙʔωϯτ਌ ίϯϙʔωϯτࢠ ίϯϙʔωϯτଙ σʔλ QSPQT Πϕϯτ TUBUF

&:0⒏DF 3FBDUKT ஫ҙɿSFBDUJWFQSPHSBNNJOHͱ͸ແ ؔ܎ 56

΋͏K2VFSZ͸ཁΒͳ͘ͳΔͷ͔ʁ /0 ؆୯ͳศརػೳͷΑ͏ͳ΋ͷ͸ K2VFSZͷΑ͏ͳ΋ͷ͕ศར 57 3FBDUKT

΋͏K2VFSZ͸ཁΒͳ͘ͳΔͷ͔ʁ ͋Δ෦෼Ͱ͸:FT 41"Ͱ͸ࠓޙ͸࢖ΘΕͳ͍ +4ͷ%0.ૢ࡞"1*ͷ௥Ճ $44Ξχϝʔγϣϯ &4 58 3FBDUKT

&:0⒏DF 3FBDUKT ৘ใݯ ຊՈIUUQTGBDFCPPLHJUIVCJPSFBDU ͱͯ΋ྑ͍ʂ ωοτ্ʹ೔ຊޠ༁΋͋Δ͕ݹ͍ͷͰɺ֓೦ͷཧ ղʹ࢖͍ɺͦͷޙ͸ຊՈΛ࢖͏ +4FSJOGPIUUQKTFSJOGPBCPVU ࠷৽ͷ+4৘ใ ೔ຊޠ
59

3FBDUKT༻ͷެ։ίϯϙʔωϯτ ॆ࣮ͭͭ͋͠Δ 60 3FBDUKT IUUQSFBDUDPNQPOFOUTDPN

ར༻্ͷ஫ҙ఺ K2VFSZܥͷϥΠϒϥϦʔͱ͸૬ੑ ͕ྑ͘ͳ͍ࣄ͕ଟ͍ Ξχϝʔγϣϯ͕ۤख όʔδϣϯΞοϓͰ"1*͕มΘΔ ࣄ͕͋ΔˠςετΛॻ͜͏ʂ 61 3FBDUKT IUUQTGBDFCPPLHJUIVCJPSFBDUUJQTVTFSFBDUXJUIPUIFSMJCSBSJFTIUNM

ϑϩϯτΤϯυͰ΋ςετ͸ॏཁ 62 3FBDUKT

3FEVY 'MVY 3FBDUKT͸දࣔͷΈͷϥΠϒϥϦʔ ͳΒ͹.PEFM$POUSPMMFS͸ʁ 64

'MVY .7$͸εέʔϧ͠ͳ͍ɻͳΒ͹'MVYͩ CZ'BDFCPPL 65 IUUQTXXXJOGPRDPNOFXTGBDFCPPLNWDqVYΑΓ

66 'MVY IUUQTHJUIVCDPNGBDFCPPLqVYΑΓ ྲྀΕ͕Ұํ޲

͔͠͠'BDFCPPL͸׬ શͳ'MVY࣮૷ΛϦϦʔ ε͠ͳ͔ͬͨ 67 'MVY IUUQTHJUIVCDPNLSJBTPGUSFBDUTUBSUFSLJUJTTVFT ΑΓ

3FEVY 1SFEJDUBCMFTUBUFDPOUBJOFSGPS +BWB4DSJQUBQQT 5ISFF1SJODJQMFT 4JOHMFTPVSDFPGUSVUI 4UBUFJTSFBEPOMZ .VUBUJPOTBSFXSJUUFOBTQVSF GVODUJPOT 68

3FEVY 'MVYͷ࣮૷Ͱ͸ͳ͍ 'MVYʹΠϯεύΠΞ͞Ε͍ͯΔ ࠓͷͱ͜Ζϙϐϡϥʔͳ'MVYܥϑϨʔ ϜϫʔΫ 3FBDUKTઐ༻Ͱ͸ͳ͍ 69

3FEVY 70 Actions ActionCreators Store View React.js Reduces state (data)
event, … dispatch update state͸࢖Θͳ͍

3FEVY 71

3FEVYͷίʔυ ίʔυɿIUUQTHJUIVCDPNZVVNJSFBDU@KZBOLFO CSBODISFEVY

3FEVY "DUJPOT"DUJPO$SFBUPS 3FEVDFST "DUJPOΛड͚ͯ࣍ͷঢ়ଶΛฦ͢ 4UPSF TUBUFঢ়ଶͷอ࣋ 73

3FEVY $POOFDU 3FBDUͱͷͭͳ͗ TUBUFΛQSPQTͰ౉͢ "DUJPO EJTQBUDI ΛQSPQTͰ౉͢ .JEEMFXBSF SFEVYͷ֦ு"1*௨৴ɺϩάɾɾɾ 74

3FEVYσΟϨΫτϦʔ BDUJPOTBDUJPO BDUJPO$SFBUPS DPNQPOFOUT3FBDUίϯϙʔωϯτ DPOUBJOFST3FEVYʹܨ͕Δίϯϙʔ ωϯτ SFEVDFSTSFEVDFS TUPSFTUPSF NJEEMFXBSFఆٛ 75

3FEVYࢲݟ ྑ͍఺ 3FBDU͔Β.PEFM$POUSPMMFSཁૉ͕ͳ ͘ͳΔ ॻ͖ํ͕౷Ұ͞ΕΔͷͰɺେن໛ɾେ ਓ਺ͷ։ൃ޲͖ʁ ίϯύΫτͳ࡞Γ 3FBDUͱ͸ૄ݁߹ 76

3FEVYࢲݟ ෆຬͳ఺ ΊΜͲ͏ "1*ݺͼग़͕͠εϚʔτͰͳ͍ ຊ౰ʹܾఆଧ͔ʁ 77

Ϟμϯ+4։ൃ؀ڥ

Ϟμϯ+4։ൃ؀ڥ 79

Ϟμϯ+4։ൃ؀ڥ DTT KTΛҰͭͷϑΝΠϧʹ·ͱΊͨ Γɺѹॖͨ͠Γ &4 5ZQF4DSJQUΛ&4ʹม׵͢Δ 4BTTΛ$44ʹม׵͢Δ +BWB4DSJQUʹϞδϡʔϧΛఏڙ /PEFKTͷϥΠϒϥϦʔΛ8FCͰ࢖͑ ΔΑ͏ʹ͢Δ
80

Ϟμϯ+4։ൃ؀ڥ ͨ͘͞Μ͋Γ͗͢ɺԿΛ࢖͑͹ྑ͍ ͷ͔෼͔Βͳ͍ʁʁ φ΢ͳπʔϧ͕සൟʹมΘΔʂ ಥવͷ։ൃఀ଺?? 81

ม׵ɹɹɹɹ ౷߹։ൃπʔϧ ϥΠϒϥϦʔ λεΫ؅ཧ Ϟμϯ+4։ൃ؀ڥ 82 ݴޠ ೥݄ݱࡏ νΣοΫ

OPEFKT (PPHMFͷ։ൃͨ͠ߴ଎+BWB4DSJQUΤ ϯδϯ7Λ֩ʹ࡞ΒΕͨ+4ίϚϯυ ϚϧνϓϥοτϑΥʔϜ ඇಉظ*0 +4πʔϧ͸ɺ+4Ͱॻ͔Ε͍ͯͯ OPEFKTͰಈ͘ 83

OQN OPEFKT༻ϥΠϒϥϦʔ؅ཧπʔϧ OPEFKT༻ϥΠϒϥϦʔͷϦϙδτ Ϧʔ ґଘϥΠϒϥϦʔͷόʔδϣϯͷௐ ఀΛߦͬͯ͘ΕΔ ͦͷଞɾɾɾ 84

OQN 85 http://www.modulecounts.com ʙ

8FCQBDL ݱࡏ ೥݄ ྲྀߦͷ։ൃπʔϧ ֤ॲཧ͸MPBEFSͱݺ͹ΕΔϞδϡʔ ϧ͕ߦ͏ ϑΝΠϧͷґଘؔ܎ɺ࡞ۀΛهड़ Ұൠతͳ࡞ۀ͸؆୯ʹͰ͖Δ .BD 8JOEPXT
-JOVYΛαϙʔτ 86

&4-JOU +4 &4 &4 ͷจ๏νΣοΫ πʔϧ ಈ࡞ͤ͞Δલʹɺจ๏Τϥʔɺະఆٛ ͳͲ͕൑Γɺ։ൃͷੜ࢈ੑ͕͕͋Δ +4Λ࢖͏ʹ͸΄΅ඞਢͳπʔϧ ಠࣗνΣοΫϧʔϧͷ௥Ճ΋༰қ
87

σϞͷ։ൃ؀ڥͷߏஙखॱ 88 $ mkdir frontend $ cd frontend $ mkdir
-p src/js src/css $ brew install node $ npm init -y $ npm install --save react react-dom $ npm install --save isomorphic-fetch $ npm install --save material-design-lite $ npm install —-save-dev babel-loader babel-preset-es2015 babel-preset-react $ npm install —-save-dev eslint eslint-loader eslint-plugin-react babel $ npm install —-save-dev css-loader style-loader $ npm install -g webpack

σϞͷ։ൃ؀ڥͷઃఆ 89 module.exports = { entry: { "app": "./src/js/index.js", },
output: { path: '../public/js', filename: "[name].js" }, module: { preLoaders: [{ test: /\.js$/, exclude: /node_modules/, loader: "eslint-loader" }], loaders: [{ test: /\.css$/, loader: "style!css" }, { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader' }] }, resolve: { extensions: ['', '.js', '.css'] }, eslint: { configFile: './.eslintrc' } }; XFCQBDLDPOpHKT

8FCҎ֎Ͱͷ +BWB4DSJQUར༻

3FBDU/BUJWF +4 3FBDUͰεϚϑΥΞϓϦΛߏங ͢ΔͨΊͷϑϨʔϜϫʔΫ J04 "OESPJEʜରԠ σόΠε (14 Χϝϥʜ ΋ར༻Ͱ͖Δ
IUNMͷເΑ΋͏Ұ౓ʁ 91

92 3FBDU/BUJWF ίʔυɿIUUQTHJUIVCDPNZVVNJSFBDU@KZBOLFO CSBODISFBDUOBUJWF σϞ

&MFDUSPO ϚϧνϓϥοτϑΥʔϜͷ(6*ΞϓϦΛ ࡞ΔͨΊͷϑϨʔϜϫʔΫ 8JOEPXT .BD -JOVY /PEFKT $ISPNJVNϕʔε ΋ͱ΋ͱ"UPNΤσΟλʔͷҰ෦ͩͬͨ ࣮ࡍʹ࢖ΘΕ͍ͯΔ
93

94 &MFDUSPO

95 &MFDUSPO ίʔυɿIUUQTHJUIVCDPNZVVNJSFBDU@KZBOLFO CSBODIFMFDUSPO σϞ

3FBDUKT͍͍Ͷʂ ΋ͬͱ+BWB4DSJQUͷࣄΛ஌Ζ͏Α 96 ·ͱΊ ίʔυɿIUUQTHJUIVCDPNZVVNJSFBDU@KZBOLFO

͓஌Βͤ &:0⒏DF͸ۙʑ3FBDUKTͷ ڭҭΛ։࢝͠·͢ʂ 97

React.jsの紹介

React.jsの紹介

More Decks by 裕美 吉田

Other Decks in Technology

Featured

Transcript

More Decks by 裕美吉田