Angular Schematicsを利用した アプリ量産体制

Startup Angular #5での発表資料です
https://voicy.connpass.com/event/269162/

Transcript

1. Angular SchematicsΛར༻ͨ͠
 ΞϓϦྔ࢈ମ੍ גࣜձࣾTwoGate औక໾CTO Ԟຊ൏
2. 2 ࣗݾ঺հ Ԟຊ
   ൏
   w גࣜձࣾ5XP(BUFɹڞಉ૑ۀऀ
   औక໾$50
   w ܦྺ
   w ௕໺ߴઐ
   ˠ
   ๛ڮٕज़Պֶେֶग़਎
   w 5XP(BUF
   ૑ۀ
   ։ൃຊ෦௕
   w ೥݄ΑΓ
3. ࣄۀ಺༰
   ɾ৽نࣄۀྖҬͷϞόΠϧΞϓϦ΍8FCΞϓϦͷ։ൃ͕ಘҙͳձࣾ
   ɾσβΠϯ͔ΒΠϯϑϥ·ͰҰؾ௨؏Ͱ։ൃ 3 ձࣾ֓ཁ https://twogate.com/ ઃཱ
   ɾ೥݄ઃཱʢظ໨ʣ
   ɾνʔϜͱͯ͠͸೥໨
   ɾ໊த໊ͷߴઐੜͰ૑ۀɹ
   ݱࡏɺϑϧλΠϜ໊ن໛ʹ
4. 4 5XP(BUFͷٕज़ελοΫ αʔόαΠυ ϑϩϯτΤϯυ ։ൃ؀ڥ Πϯϑϥ
5. 5XP(BUFͷϓϩμΫτ
6. 6 /PDPEF
   
   -PX
   DPEFιϦϡʔγϣϯ ϞόΠϧΦʔμʔ (ΞϓϦ) ΦϯϥΠϯΨνϟ (Web) ެࣜΞϓϦ (ΞϓϦˍ̬eb) Nocode Low code
7. 7 σδλϧίϯςϯπ഑৴ιϦϡʔγϣϯ Ի੠ίϯςϯπΞϓϦ ϘΠείʔϧ഑৴ NFTൃߦ Coming soon…
8. Angular SchematicsΛར༻ͨ͠
 Low codeΞϓϦྔ࢈ମ੍
9. w λϨϯτ΍ΞʔςΟετ޲͚ͷαΠτΞϓϦ
   w ෳ਺ͷΞʔςΟετͱಉډͨ͠αΠτ͸޷·Εʹ͍͘
   w ݸผαΠτ
   
   ݸผΞϓϦͷχʔζ͕ߴ͍
   w େ෺΄Ͳࡉ͔͍ݸผཁٻʹରԠ͕ඞཁͳέʔε͕͋Δ
   w ্هΛຬͨͭͭ͠খνʔϜͰ։ൃɾอकΛ͍ͯ͘͠ʹ͸ɺ޻෉͕ඞཁ 23 എܠ
10. w αΠτ͝ͱʹڞ௨෦෼ͱݸผ෦෼Λ࡞੒Ͱ͖ΔΑ͏ͳϓϩδΣΫτߏ੒Λ࣮ݱ͍ͨ͠
    w ํ๏
    w "
    ݩͷίʔυΛGPSLͯ͠ݸผίʔυʹ͢Δ
    w #
    ςϯϓϨʔτԽͯ͠ݸผίʔυʹ͢Δ
    w $
    ϥΠϒϥϦԽͯ͠෦෼తʹݸผίʔυʹ͢Δ
    w %
    ϊʔίʔυԽͯ͠ڞ௨ίʔυʹ͢Δ 24 ΞʔΩςΫνϟ
11. w αΠτ͝ͱʹڞ௨෦෼ͱݸผ෦෼Λ࡞੒Ͱ͖ΔΑ͏ͳϓϩδΣΫτߏ੒Λ࣮ݱ͍ͨ͠
    w ํ๏
    w "
    ݩͷίʔυΛGPSLͯ͠ݸผίʔυʹ͢Δ
    w #
    ςϯϓϨʔτԽͯ͠ݸผίʔυʹ͢Δ
    w $
    ϥΠϒϥϦԽͯ͠෦෼తʹݸผίʔυʹ͢Δ
    w %
    ϊʔίʔυԽͯ͠ڞ௨ίʔυʹ͢Δ 25 ΞʔΩςΫνϟ
12. 26 "OHVMBS
    4DIFNBUJDT
13. w "OHVMBSϥΠϒϥϦ޲͚ͷίʔυδΣωϨʔλ
    w OH
    BEE
    
    OH
    HFOFSBUF
    
    OH
    VQEBUF࣌ʹ૸ΔεΫϦϓτ
    w ύοέʔδΛ௥Ճͨ͠ͱ͖ɺ/H.PEVMFͳͲʹఆٛΛೖΕͯ͘ΕΔ΍ͭ
    w ϥΠϒϥϦͷΞοϓσʔτͰΠϯλʔϑΣʔε͕มΘͬͨͱ͖ʹɺࣗಈஔ׵ͯ͠ ͘ΕΔ΍ͭ 27 "OHVMBS
    4DIFNBUJDT https://angular.jp/guide/schematics
14. w ॳظঢ়ଶͷςϯϓϨʔτϑΝΠϧ܈
    w OH
    BEE͢ΔͱࣗಈͰ௥Ճ͞ΕΔ
    w ͦͷଞϑΝΠϧ഑ஔ΍มߋͷͨΊͷεΫϦϓτ΋ ࣮૷Մೳ
    w ςϯϓϨʔτΤϯδϯ΋༻ҙ͞Ε͓ͯΓɺม਺λ άΛຒΊΔͱϓϩδΣΫτݻ༗ͷ஋ʹ߹Θͤͯࣗ ಈઃఆͰ͖Δ 28 OH
    BEE༻ςϯϓϨʔτ
15. w ৽ػೳ௥Ճ΍վमޙʹ͸ɺ֤ϓϩδΣΫτͷίΞϥΠϒϥϦͷΞοϓσʔτ͕ඞཁ
    w طʹಈ͍͍ͯΔίʔυͰ͸ɺίʔυ͝ͱʹՃ޻͞Ε͍ͯΔ෦෼͕ੜͯ͘͡Δ
    w ࠩ෼ύονͷద༻͕ඞཁ
    w ͜ΕΛղܾ͢Δ࢓૊Έ΋4DIFNBUJDTͰ͸ߟྀ͞Ε͍ͯΔʢ༏लʣ 29 OH
    VQEBUF޲͚TDIFNBUJDT
16. 30 OH
    VQEBUF޲͚TDIFNBUJDT w Ξοϓσʔτલޙͷόʔδϣϯ͔Βɺඞཁͳ ύονεΫϦϓτ͕࣮ߦ͞ΕΔ
17. 31 ࢖͍ํΠϝʔδ Angular Project ng new awesome-gacha-site w ۭͬΆͷ"OHVMBSϓϩδΣΫτΛ࡞੒
18. 32 ࢖͍ํΠϝʔδ Angular Project Angular Library ίΞػೳ ng add @twogate/slashkit-plus w ίΞػೳͷೖͬͨ"OHVMBS
    -JCSBSZΛ௥Ճ
    w 4DIFNBUJDTʹΑΓपลઃఆ͕શͯࣗಈηοτΞοϓ
    w 'JSFCBTF
    1SPKFDU࡞੒ʴ؀ڥม਺ઃఆ
    w ඪ४$44ςʔϚϑΝΠϧઃஔ
    w (JU-BC
    $*ఆٛϑΝΠϧઃஔ CSS Config Assets ͔͜͜ΒɺαΠτݻ༗ͷΞηοτ΍ઃఆΛม͑Δ͚ͩɻ
19. 33 ࢖͍ํΠϝʔδ Angular Project git push … w (JU-BC
    
    (JU-BC
    $*ͰࣗಈϏϧυˍϦϦʔε
    w ࣾ಺Ͱ͸Ұ࿈ͷྲྀΕΛσβΠφʔͳͲඇΤϯδχΞ͕Ϧ Ϧʔε·ͰͰ͖Δঢ়ଶʹ git push … Deploy
20. 34 ࢖͍ํΠϝʔδ Ұ੪Ξοϓσʔτ w (JU-BC
    $*ͷఆظ࣮ߦͰɺOH
    VQEBUFΛ(JU-BC಺ͷϦϙδτϦʹద༻͢ΔεΫϦϓτΛ࣮ ૷ɻ
    w όʔδϣϯ͕࠷৽Ͱͳ͔ͬͨΒɺ.FSHF
    3FRVFTUΛࣗಈ࡞੒ɻ
21. w ݱࡏσϞςφϯτ΋߹ΘͤΔͱɺϦϙδτϦ΄Ͳͷن໛ʹ
    w ݸผχʔζʹ΋Ԡ͑ΒΕͭͭɺӡ༻ίετ΋ͦΕͳΓʹ௿͘ରԠͰ͖͍ͯΔ
    w طଘͷςφϯτ͕଍͔ͤͰΞοϓσʔτͰ͖ͳ͔ͬͨέʔε͸΄΅ແ͠
    w ҰํͰɺͦ͜·ͰΧελϚΠζཁ๬͕ͳ͍έʔε΋͋ΔͷͰɺڞ༗ϓϥοτϑΥʔ Ϝ൛΋༻ҙ͢Δ͜ͱΛݕ౼͍ͯ͠Δɻ 35 ӡ༻ͯ͠Έͯ
22. w "OHVMBS
    4DIFNBUJDTΛ׆༻ͨ͠-PX
    $PEFαΠτྔ࢈ମ੍
    w $*΋׆༻ͨ͠΄΅ࣗಈͰͷӡ༻ମ੍
    w 8F
    BSF
    IJSJOH
    w ΤϯλϝྖҬ΁શྗͰϓϩμΫτΛ։ൃ͍ͨ͠ɺ
    w "OHVMBSΤϯδχΞΛืू͍ͯ͠·͢ 36 ·ͱΊ