Slide 1

Slide 1 text

େن໛։ൃʹଧͪউͭͨΊͷ
 ϚϧνύϥμΠϜ +VO OHKBQBO !PLVOPLFOUBSP

Slide 2

Slide 2 text

୭ w Ԟ໺ݡଠ࿠!PLVOPLFOUBSP w גࣜձࣾϐΫηϧάϦ ο υ w OHKBQBO

Slide 3

Slide 3 text

$PEF(SJE ϑϩϯτΤϯυʹؔΘΔਓʑͷΨΠυ ֹ݄ԁʢ੫ࠐԁʣ
 ΫϨδοτΧʔυɺ1BZ1BMͰͷ͓ࢧ෷͍ͷ৔߹͸೔ؒͷແྉߪಡظؒ

Slide 4

Slide 4 text

ࣥච IUUQTCPPLJNQSFTTDPKQCPPLT

Slide 5

Slide 5 text

͋Β͢͡

Slide 6

Slide 6 text

͜͜·Ͱͷ͋Β͢͡ IUUQTTQFBLFSEFDLDPNPLVOPLFOUBSP

Slide 7

Slide 7 text

ݱࡏͷঢ়گ w ૯ߦ਺໿ ߦ ʢۭߦɺ ςε τίʔ υؚΉʣ w ૯ϑΝΠϧ਺ ϑΝΠϧ ʢςε τؚΉʣ w ։ൃମ੍ w ϑϩϯ τΤϯ υ ɾ ΤϯδχΞਓ

Slide 8

Slide 8 text

೔ʑɺ ໰୊͕෾ग़ w ઃܭ͸Ͳ͏͢Δ͔ w ίʔ υͷॏෳ͕සൟʹੜ·ΕΔ໰୊͸Ͳ͏͢Δ͔ w ͦͯ͠Կ౓΋มΘΔ࢓༷ॻʜ

Slide 9

Slide 9 text

໰୊ղܾͷࠔ೉͞ w ͋ΒΏΔঢ়گΛ৐Γӽ͑Δਖ਼ղ͸ɺ ͻͱͭͰ͸ͳ͍ w ਖ਼ղ͕ݟ͔ͭΒͳ͍͜ͱ͢Β͋Δ w ίʔ υΛॻ࣌ؒ͘Α Γɺ ܾஅʹඅ΍͕࣌ؒ͢ଟ͍೔΋͋Δ w ܾஅ͕ɺ ൒೥ޙͷޙչΛট͘ ͜ͱ΋͋Δ

Slide 10

Slide 10 text

Ҿ͖ग़͠Λଟ࣋ͭ͘ wʮલʹಡΜͩ͋ͷຊͰ͸ʙʯ wʮ͋ͷਓ͕࿩͍ͯͨ͠ͷ͸ʙʯ wʮ࠷ۙ؍ͨΧϯϑΝϨϯεͩͱʙʯ

Slide 11

Slide 11 text

ϓϩάϥϛϯά ɾ ύϥμΠϜ

Slide 12

Slide 12 text

w ϓϩάϥ ϛϯάʹ͓͚Δ఩ֶͷ֓೦ɺ ղऍΛҙຯ͢Δ w खଓ͖ܕϓϩάϥ ϛϯά w ΦϒδΣΫ τࢦ޲ϓϩάϥ ϛϯά w ؔ਺ܕϓϩάϥ ϛϯά ϓϩάϥϛϯά ɾ ύϥμΠϜ

Slide 13

Slide 13 text

w ࣌୅ͷਐߦ w ٕज़ͷਐาɺ ٕज़త੍໿͔Βͷղ์ w ੓࣏తͳࣄ৘ w աڈͷผݴޠͷ൓লͱվળ ͳͥݴޠ͸ෳ਺͋Δͷ͔

Slide 14

Slide 14 text

w +BWB4DSJQU w खଓ͖ܕɺ ΦϒδΣΫ τࢦ޲ͳͲ w 5ZQF4DSJQU w ؔ਺ܕɺ δΣωϦ οΫͳͲ ͋ͳͨͷಘҙͱ͢Δݴޠ͸ ʁ

Slide 15

Slide 15 text

w ύϥμΠϜ͸࣍ʑ ͱฤΈग़͞ΕΔ w ࣗ෼ͷۀ຿্ѻ͍ͬͯΔݴޠͷΈ͔͠৮͍ͬͯͳ͍ͱɺ 
 ৽͍͠ύϥμΠϜʹ৮ΕΔػձ͕ͳ͍ w ੵۃతʹଞͷύϥμΠϜʹ৮ΕͯΈΔ w ໰୊ղܾͷҾ͖ग़͠Λ޿͛Δ ෆ׳ΕͳύϥμΠϜʹ৮ΕΔ

Slide 16

Slide 16 text

ϚϧνύϥμΠϜΛऔΓೖΕ࣮ͨྫ

Slide 17

Slide 17 text

w ֮͑ͨύϥμΠϜΛҋӢʹೖΕͳ͍ w खஈͷ໨తԽ͸ආ͚Δ w ΤϯδχΞͷࣗݾຬ଍ʹͯ͠͸ͳΒͳ͍ w ࠓճ͸ϚϧνύϥμΠϜʹ͢΂͖ͱड़΂͍ͨΘ͚Ͱ͸ͳ͍ w ໰୊ղܾʹ޲͚ͨൃ૝Λॊೈʹ͢ΔͨΊͷΤΫααΠζͰ͋Δͱଊ͑Δ w έʔεόΠέʔεͰͷۛຯ͕ඞཁ ஫ҙ

Slide 18

Slide 18 text

w ܖ໿ʹΑΔઃܭɺ %FTJHOCZ$POUSBDU %C$ͱ΋ w ͋Δϝ ιο υΛݺͿͱ͖ɺ ݺͿଆͰอূ͢΂͖ෆม৚݅ɺ ࣄલ৚͕݅ຬͨ͞ΕΔ w Ͱ͋Ε͹ w ͦͷϝ ιο υͷऴྃ࣌ʹอূ͢΂͖ෆม৚݅ɺ ࣄޙ৚͕݅ຬͨ͞ΕΔ w ࣮૷ͷޡΓͳͷ͔ɺ ϝ ιο υΛ࢖͏ଆͷޡΓ͔ΛϋοΩ Ϧͤ͞Δ ܖ໿ϓϩάϥϛϯά

Slide 19

Slide 19 text

w console.assert() + unassert΍JOWBSJBOU͕Φεεϝ
 `npm i invariant` w ಋೖ؆୯ w ܖ໿ϓϩάϥ ϛϯάͷ׬શ࠶ݱ͸Ͱ͖ͳ͍͕
 ʮ࣮૷ͷޡΓͳͷ͔ɺ ϝ ιο υΛ࢖͏ଆͷޡΓ͔ΛϋοΩ Ϧͤ͞Δʯ 
 Λڗड͢ΔͨΊͷΞϓϩʔν w +BWB4DSJQU։ൃʹ͓͍ͯ͸๷ޚతϓϩάϥ ϛϯάɺ ૣظϦλʔϯͳͲ΋
 ஌ࣝͱͯ͠༗༻ "OHVMBSͳΒ͹

Slide 20

Slide 20 text

w ԣஅతؔ৺ࣄ ʢΞεϖΫ τʣ Λڞ௨Խ࣮ͯ͠ߦ͢ΔͨΊͷϓϩάϥ ϛϯάख๏ w ༗໊ͳྫͱͯ͠͸ϩάग़ྗ w ͋ΒΏΔϞδϡʔϧɺ ͋ΒΏΔϝ ιο υͰϩάͷग़ྗ͸༗༻ w ͨͩ͠ɺ ͦΕΒ͢΂ͯʹϩάग़ྗ༻ͷίʔ υ͕ॻ͔Ε͍ͯͨΒ
 ຊ౰ʹॏཁͳॲཧΛࣔ͢ίʔ υ͕ຒ΋Εͯ͠· ͏ w ෭࣍తͳॲཧԣஅతؔ৺ࣄΛ෼཭͠ຒ΋Εͳ͍Α ͏ʹ͢Δख๏ ΞεϖΫ τࢦ޲ϓϩάϥϛϯά

Slide 21

Slide 21 text

w "OHVMBS։ൃऀʹ͸͓ͳ͡Έɺ %FDPSBUPSΛ࢖͏ w Ϋϥε໊΍ϝ ιο υ໊ͷ্ʹ%FDPSBUPSͱͯ͠෼཭ͨؔ͠਺Λهड़ wʮϩάΛग़ྗͤΑʯ ͱ͍͏ॲཧ͸%FDPSBUPS಺෦ʹӅṭͭͭ͠ϩάग़ྗΛୡ੒ w %FDPSBUPSॲཧ಺Ͱ͸
 1SPYZύλʔϯ (P' ΍Ϧ ϑ ϨΫγϣϯ ɾ ϓϩάϥ ϛϯάͳͲͷख๏͕༗༻ w ௐࢠʹ৐ͬͯ΍Γ͗͢Δͱͨͩͷ೉ಡԽ "OHVMBSͳΒ͹

Slide 22

Slide 22 text

࣮Ҋ݅Ͱͷྫ @KukerComponent() @Component({ selector: 'app-foo-bar', templateUrl: './component.html', styleUrls: ['./component.scss'], }) export class FooBarComponent { // ... } IUUQTHJUIVCDPNLSBTJNJSLVLFS

Slide 23

Slide 23 text

w ෭࡞༻Λ༻͍ͣʹҾ਺ ʢೖྗʣ ͱ໭Γ஋ ʢग़ྗʣ Λ΋ͬͨؔ਺Λ
 ͍ͭ͘΋૊Έ߹ΘͤΔ͜ͱͰॲཧΛ࣮ݱ͢Δख๏ w +BWB4DSJQU͸ɺ ୈҰڃؔ਺Λѻ͑ΔͷͰ࠶ݱ͠΍͍͢ w ؔ਺Λ͍ͭ͘΋૊Έ߹ΘͤΔͱ͍͏఺Ͱ͸3Y+4Ͱ΋͓ͳ͡Έ w ͪͳΈʹ3Y+4͸ϦΞΫςΟ ϒϓϩάϥ ϛϯάɺ એݴܕϓϩάϥ ϛϯά
 ͳͲͷύϥμΠϜͷ࣮ݱͰ͋Γɺ ؔ਺ܕϓϩάϥ ϛϯάͰ͸ͳ͍ ؔ਺ܕϓϩάϥϛϯά

Slide 24

Slide 24 text

w ܕΛύϥϝʔλͱͯ͠ѻ͏ ͜ͱͰɺ ಛఆͷܕʹґଘ͠ͳ͍࣮૷͕ՄೳʹͳΔ
 ϓϩάϥ ϛϯάख๏ w 5ZQF4DSJQUʹ͓͍ͯ͸Array΍PromiseͳΒ͹ຖ೔࢖͍ͬͯΔ͸ͣ δΣωϦ οΫ ɾ ϓϩάϥϛϯά

Slide 25

Slide 25 text

w 0QUJPO΍&JUIFSͱ͍ͬͨؔ਺ܕݴޠ )BTLFMM 4DBMBͳͲ ͷٕज़Λഈआ w 0QUJPOͱ͸ ʮ஋͕͋Δ͔ແ͍͔Λද͢ܕʯ w &JUIFSͱ͸ ʮͭͷ͏ ͪͲͪΒ͔Λද͢ܕʯ ؔ਺ܕ ɾ δΣωϦ οΫΛ૊Έ߹Θͤͯ

Slide 26

Slide 26 text

w ௐࢠʹ৐͍͖ͬͯͳΓ ʮϞφ υ΍Δͧʔʯ ͱ͔ݴ͍ग़ͤ͹େମҾ͔ΕΔ w ؔ਺ܕݴޠ͕ԿΛࠀ෰͢΂͘0QUJPO΍&JUIFSΛ࣮૷͍ͯ͠Δͷ͔Λཧղ͢Δ w ྫ͑͹getOrElse()ͷߟ͑ํͳͲ͸ೲಘ͞Ε΍͘͢ಋೖ͠΍͍͢ ։ൃνʔϜͷཧղΛಘΔ

Slide 28

Slide 28 text

ϑϩϯ τΤϯ υ ɾ ΤϯδχΞͷ
 ଞݴޠͱͷ෇͖߹͍ํ

Slide 29

Slide 29 text

wʮϑϩϯ τΤϯ υ ɾ ΤϯδχΞ͔ͩΒ+BWB4DSJQU 5ZQF4DSJQUֶ͹ͳ͘ ͪΌʜʯ wʮ)5.-΋$44΋΍Βͳ͍ͱʜʯ w ΋ͪΖΜͦΕ͸େࣄ w ҰํͰɺ ΤϯδχΞͱͯ͠ͷࢹ໺Λ޿͛Δ͜ͱ΋େࣄ ϑϩϯ τΤϯ υ ɾ ΤϯδχΞͱ ͯ͠

Slide 30

Slide 30 text

wʮ͜ͷݴޠͰ͸+4Ͱى͜ Γ͕ͪͳ໰୊Λ͜͏΍ͬͯղܾͯ͠Δͷ͔ʯ w ˠ+4Ͱ΋ࣅͨΑ ͏ͳΞϓϩʔνͰղܾ͍ͯ͠ΔϥΠ ϒϥ Ϧ͕͋Δ ʂ wʮ࠷৽ͷݴޠʹ͋ͬͨ˓˓ߏจɺ +4ʹ΋ཉ͍͠ͳʔʯ w ˠ5$ͷϓϩϙʔβϧʹ΋͏ग़ͯΔ ʂ w ͱ͍ͬͨɺ +BWB4DSJQUք۾ΩϟονΞοϓʹ͓͚ΔΞϯςφͷຊ਺͕૿͑
 ൃݟ΍௥੻͕༰қʹͳΓɺ ڻ͔ͳ͘ ͯࡁΉ ଞݴޠֶशͷར఺

Slide 31

Slide 31 text

w ΩϟονΞοϓ΁ͷযΓɺ ྲྀߦϥΠ ϒϥ Ϧ΁ͷܯռɺ ϑ ϨʔϜϫʔΫϓϩϨεͷউഊʜ w ͜Ε͸ࠣࡉͳ͜ͱ w ߄ͯΔ͜ͱ͸ͳ͍ w ຊ࣭తͳղܾखஈ͸Կͳͷ͔Λߟ͑Δ w ྺ࢙ʹֶͿ w ύϥμΠϜʹֶͿ ߄ͯͳ͍ͨΊʹ

Slide 32

Slide 32 text

5IBOLZPV