チームで取り組む Singe Page Application

y8 2017 spring Shibuya

Transcript

1. νʔϜͰऔΓ૊Ή

   4JOHMF1BHF"QQMJDBUJPO
   :TQSJOHJO4IJCVZB
   !PLBNVVV
   

   View Slide

2. ͋Β͢͡
   w αʔόʔαΠυ͔ΒϑϩϯτΤϯυͷੈք΁
   w ཱͪҐஔ͕มΘͬͨࣄʹΑͬͯؾ͍ͮͨࣄ
   w ϑϩϯτΤϯυ͸աࠅ͚ͩͲॏཁ
   w Ͳ͏΍ཱͬͯͪ޲͔͏΂͖͔ߟ͑·ͨ͠
   

   View Slide

3. "HFOEB
   w 41"ͷྲྀߦͱϞμϯͳϑϩϯτΤϯυ
   w 6*69σβΠφʔ͕ٻΊΒΕΔ
   w ϑϩϯτΤϯυͰਓࡐ͕ෆ଍
   w ղܾࡦΛߟ͑Δ
   

   View Slide

4. 4JOHMF1BHF"QQMJDBUJPO
   ͕ྲྀߦͨ͠എܠ
   

   View Slide

5. 8αʔϏε͕ϦονԽ
   w 'BDFCPPL͸ը໘ભҠͯ͠΋νϟοτ΢Οϯυ΢͸ด͡ͳ͍
   w 4PVOE$MPVE͸ը໘ભҠͯ͠΋࠶ੜதͷԻָ͸్੾Εͳ͍
   w 8FCΞϓϦ͕ωΠςΟϒΞϓϦฒΈͷ6*69Λཁٻ͞ΕΔΑ͏ʹͳ͖ͬͯͨ
   w จࣈ΍ը૾͚ͩͷදݱͰ͸෺଍Γͳ͘ͳ͍ͬͯΔ
   w ϦονͰ͋Δ͜ͱ͕ઈରͰ͸ͳ͍͕ɺϦονͳ6*69͕޷·ΕΔ܏޲͕͋Δ
   

   View Slide

6. Ϧονͳ6*Λࢧ͑Δٕज़
   w ߴ͍ཁٻʹԠ͑ΒΕΔٕज़͕ొ৔͖ͯͨ͠
   w ߴ଎ʹಈ࡞͢ΔԾ૝%0.͕஫໨ΛूΊͨ
   w 3FBDUKT͸τϥϯεύΠϧͯ͠࢖͏ඞཁ͕͋Δ
   w ར༻͢Δଆʹ։ൃ؀ڥΛߏங͢ΔεΩϧ͕ඞཁʹͳ͖ͬͯͨ
   w ϞμϯͳϑϩϯτΤϯυΤϯδχΞ͕ొ৔
   

   View Slide

7. ϞμϯͳϑϩϯτΤϯυ
   w &4΍5ZQF4DSJQUͳͲͰهड़͢ΔΑ͏ʹͳͬͨ
   w ίʔυΛ͖ͪΜͱϞδϡʔϧԽ͢ΔΑ͏ʹͳͬͨɻ
   w +BWBTDSJQUΛϏϧυͯ͠࢖͏Α͏ʹͳͬͨɻ
   w Ծ૝%0.͕౰ͨΓલʹͳ͖ͬͯͨ
   w ΋͏αʔόʔαΠυ͕ยखؒͰK2VFSZΛॻ࣌͘୅Ͱ͸ͳ͘ͳͬͨ
   

   View Slide

8. ͜͜·Ͱͷ·ͱΊ
   w 4JOHMF1BHF"QQMJDBUJPO͕ྲྀߦͨ͠
   w ͦΕʹ൐ٕͬͯज़తͳཁٻ͕ߴ·ͬͨ
   w ཁٻʹԠ͑ΔΤϯδχΞ͕ొ৔͖ͯͨ͠
   w ͨͩ͠ɺͦͷཁٻʹ͸6*69σβΠϯؚ͕·Ε͍ͯΔʜ
   w ΤϯδχΞΛҰਓޏ͚ͬͨͩͰ͸ཁٻΛશͯຬͨ͢ࣄ͕Ͱ͖ͳ͍
   

   View Slide

9. 6*69σβΠφʔ͕ٻΊΒΕΔ
   

   View Slide

10. 6*69σβΠφʔͱ͸
    w (PPHMFͷ.BUFSJBM%FTHJOͷΑ͏ͳ6*Λߟ͑Δਓ
    w Ϣʔβʔ͕ؾ࣋ͪྑ͍ϞʔγϣϯεϐʔυΛߟ͑ͨΓ
    w ΞχϝʔγϣϯʹҙຯΛ࣋ͨͤͨΓ
    w ΦϒδΣΫτͷग़ݱɾҠಈɾมܗʹܧଓੑΛ͏Μ͵Μ
    Λߟ͑ͨΓ
    w σβΠϯͱϓϩάϥϛϯάͷ྆ํͷಛੑ͕ඞཁ
    

    View Slide

11. 'MBTIFS
    w ੩తͳը໘Ͱຬ଍͠ͳ͍Ϣʔβʔ΁ͷରॲ͸'MBTIͷ໾ׂͩͬͨɻ
    w ͣͬͱલ͔Β6*69Λڧ͘ҙࣝͯ͠։ൃ͍ͯͨ͠
    w ΠϥετϨʔλʔΛૢΓ
    w ΞΫγϣϯεΫϦϓτͰϓϩάϥϛϯάΛ͠
    w λΠϜϥΠϯͰΞχϝʔγϣϯΛੜΈग़͢
    w 4JOHMF1BHF"QQMJDBUJPOʹ͸࠷ߴͷਓࡐ͔΋͠Εͳ͍͕
    w ωΠςΟϒΞϓϦͱ͔΍͍ͬͯΔͰ͠ΐ͏Ͷ
    

    View Slide

12. 8σβΠφʔ
    w 'MBTI͕͋Δ͜Ζ͸ओʹ੩తͳ8ը໘Λߟ͑Δਓͩͬͨ
    w 8σβΠφʔ΋6*69Λڧ͘ҙࣝ͢Δඞཁੑ͕Ͱ͖ͯͨ
    w σβΠφʔͳͷͰ6*69ͷྑ͠ѱ͕͠Θ͔Δ͕࣮૷ͷ࢓ํ͕Θ͔Βͳ͍
    w ࣮૷͕Ͱ͖ͳ͍ͱɺτϥΠΞϯυΤϥʔΛॏͶͯਪᏏ͢Δ͜ͱ͕ग़དྷͳ
    ͍
    w K2VFSZ࣌୅͸࣮૷Ͱ͖Δ8σβΠφʔ͕ͨ͘͞Μ͍ͨ
    w 4JOHMF1BHF"QQMJDBUJPO͕ྲྀߦ͠ɺٕज़తͳোน͕ߴ͘ͳͬͯ͠·ͬ
    ͨ
    

    View Slide

13. ٕज़తͳোน
    Կނ͔ಓ۩͕ൃ໌͞Εଓ͚Δʜ
    CPXFS OQN ZBSO HSVOU HVMQ CSPXTFSJGZ
    XFCQBDL SPMMVQ GVTFCPY $P⒎FF4DSJQU
    5ZQF4DSJQU 'MPX #BCFM #BDLCPOF
    ,OPDLPVU &NCFS "OHVMBS 7VFKT 3FBDUKT
    3JPUKT 3FEVY 3Y+4ʜ
    

    View Slide

14. ۙ೥ͷ8σβΠφʔͷ೰Έ
    w 8ͷϦονԽʹ൐͍ɺσβΠφʔ΋ษڧ͢Δࣄ͕૿͖͑ͯͨ
    w ͦΜͳ࠷தίʔυ͕ॻ͚ͳ͍σβΠφʔ͸౫ଡ͞ΕΔͱڴ͞ΕΔ
    w σβΠϯͷษڧΛ͍͕ͨ͠ϓϩάϥϜͷษڧ΋͠ͳ͚Ε͹͍͚ͳ
    ͍ʜ
    

    View Slide

15. ͜͜·Ͱͷ·ͱΊ
    w 4JOHMF1BHF"QQMJDBUJPO͕ྲྀߦͨ͠
    w ͦΕʹ൐ٕͬͯज़తͳཁٻ͕ߴ·ͬͨ
    w ཁٻʹԠ͑ΔΤϯδχΞͷ஍Ґ͕޲্ͨ͠
    w ͨͩ͠ɺͦͷཁٻʹ͸6*69σβΠϯؚ͕·Ε͍ͯΔʜ
    w ϓϩάϥϜ͕ಘҙͳσβΠφʔʹظ଴͕ߴ·Δ
    w ΩϟονΞοϓͤ͞Δͷ͸ίετ͕ߴ͍
    

    View Slide

16. ϑϩϯτΤϯυͰ
    ਓࡐ͕ෆ଍
    

    View Slide

17. ϑϩϯτΤϯυ͸๩͍͠
    w ৽͍ٕ͠ज़Λษڧ͠ଓ͚Δඞཁ͕͋Δ
    w ը໘ભҠΛߟ͑ͨΓ
    w αʔόʔαΠυͱ8FC"1*Λߟ͑ͨΓ
    w ϓϥϯφʔ΍σβΠφʔͱը໘ʹ͍ͭͯંিͨ͠Γ
    w ࣮૷Ҏ֎Ͱ͔ͳΓ࣌ؒΛফඅ͢Δ
    

    View Slide

18. ΋͏Ұਓޏ͍͍ͨ
    w ձࣾʹ͓ئ͍ͯ͠ٻਓΛ͔͚ͯ΋Β͏͕
    w Ϛον͢Δਓࡐ͕ݟ͔ͭΒͳ͍ͱͷฦ౴
    w )5.- $44 +BWB4DSJQUͩͬͨΒਓ͍Δ͚Ͳ
    w τϥϯεύΠϧͨ͠ΓϞδϡʔϧΛόϯυϧͨ͠
    ΓλεΫϥϯφʔͰ͍͍ײ͡ʹ͢Δਓ͸ݟ͔ͭΒ
    ͳ͍ʜ
    

    View Slide

19. ͜͜·Ͱͷ·ͱΊ
    w 4JOHMF1BHF"QQMJDBUJPO͕ྲྀߦͨ͠
    w ͦΕʹ൐ٕͬͯज़తͳཁٻ͕ߴ·ͬͨ
    w ཁٻʹԠ͑ΔΤϯδχΞͷ஍Ґ͕޲্ͨ͠
    w ͨͩ͠ɺͦͷཁٻʹ͸6*69σβΠϯؚ͕·Ε͍ͯΔʜ
    w σβΠφʔ΋ٕज़తͳཁٻ͕ߴ·ͬͨ
    w σβΠφʔʹϑϩϯτΤϯυք۾ͷ৘ใΛΩϟονΞοϓͤ͞Δͷ͸ίετ͕ߴ͍
    w 4JOHMF1BHF"QQMJDBUJPOʹରԠՄೳͳΤϯδχΞ͕ෆ଍͍ͯ͠Δ
    w ͦͷͨΊ࡞ۀ͕஗Ε͕ͪʹͳΔɻϑϩϯτΤϯυ͕։ൃͷϘτϧωοΫʹͳ͍ͬͯΔɻ
    

    View Slide

20. ղܾࡦΛߟ͑Δ
    

    View Slide

21. ໰୊఺
    w 6*69ʹ·Ͱਫ਼௨͍ͯ͠ΔϑϩϯτΤϯυΤ
    ϯδχΞ͕΄΅͍ͳ͍
    w ϑϩϯτΤϯυΤϯδχΞ͕ෆ଍͍ͯ͠Δ
    w 6*69͕ಘҙͳσβΠφʔ͸ϓϩάϥϛϯά
    ͕ۤख
    

    View Slide

22. ղܾࡦ
    w ίϯϙʔωϯτͰ੹຿Λ෼཭ͯ͠૬ޓิ׬͢Δ
    w σβΠφʔ͸σβΠϯΛɺΤϯδχΞ͸ΤϯδχΞϦϯάΛ
    w ίϯϙʔωϯτΛσβΠφʔʹ࡞੒ͯ͠΋Β͏
    w ΤϯδχΞ͸ίϯϙʔωϯτΛड͚औΓɺ8FCΞϓϦΛߏங͢Δ
    w ΤϯδχΞ͸ίϯϙʔωϯτΛߏங͢Δ؀ڥΛσβΠφʔʹఏڙ͢Δ
    

    View Slide

23. ͏·͍ͬͨ͘ͷ͔ʁ
    w 3FBDUKTͰ΍ͬͯΈ·ͨ͠ɻ
    w ͨͩ͠ɺσβΠφʔ͞ΜͰ͸ͳ͘ɺ)5.-ίʔμʔ͞Μʹ͓ئ͍͠·ͨ͠ɻ
    w 3FBDUKTࣗମ͸+BWB4DSJQUͷίʔυதʹ)5.-λάΛॻ͚ΔͷͰίʔ
    μʔ͞Μ͕֮͑Δࣄ͕গͳ͔ͬͨ
    w 4UBUFMFTTͳ3FBDU$PNQPOFOUΛ࡞ͬͯ΋Β͑ΔΑ͏ʹͳͬͨ
    w 6*69ΛͲ͏͢Δ໰୊͸ղܾͰ͖ͳ͔͕ͬͨʜ
    w ϑϩϯτΤϯυ͕ϘτϧωοΫͱͳΔ໰୊͸ղফͨ͠
    

    View Slide

24. ۩ମతʹ΍ͬͨࣄ
    w IUUQRJJUBDPNPLBNVVVJUFNT
    DDCGCBDEBCDFF
    w IUUQTPLBNVVVHJUIVCJPQSBDUJDFTUPSZCPPL
    w DSFBUFSFBDUBQQͱSFBDUTUPSZCPPL͕ଘࡏͨͨ͠
    Ί࣮ࡍʹίʔυΛॻ͖࢝ΊΔ·Ͱͷखॱ͕୹͔͘͢Μͩ
    

    View Slide

25. OQNJHDSFBUFSFBDUBQQHFUTUPSZCPPL
    DSFBUFSFBDUBQQIFMMPSFBDU
    DEIFMMPSFBDU
    HFUTUPSZCPPL
    OQNSVOTUPSZCPPL
    ؆୯
    

    View Slide

26. ·ͱΊ
    w 8FCͷϦονԽ͕ਐΉͨΊɺاۀ͸ϑϩϯτΤϯυͷઓಆྗ͕ߴ͍νʔϜ
    Λ཰͍Δඞཁ͕͋Δ
    w ϑϩϯτΤϯυ͸ΤϯδχΞͱσβΠφʔ͕ྗΛ߹ΘͤΔඞཁ͕͋Γ·͢ɻ
    w ͦΕͧΕ͕ྗΛൃشͰ͖ΔΑ͏ʹόοΫΞοϓ͢Δମ੍Λ੔͑·͠ΐ͏
    w 41"Λ࢝ΊΔલʹɺͲ͏΍Ε͹νʔϜ͕ڧ͘ͳΔ͔ɺ΋͏Ұ౓ߟ͑ͯ͸͍
    ͔͕Ͱ͠ΐ͏͔ɻ
    

    View Slide

27. ͝੩ௌ
    ͋Γ͕ͱ͏͍͟͝·ͨ͠
    

    View Slide