1. TypeScriptãšã¯
TypeScriptãšã¯ãMicrosoftãéçºãããªãŒãã³ãœãŒã¹ã§å ¬éãããŠããããã°ã©ãã³ã°èšèªã§ããJavaScriptã®ã¹ãŒããŒã»ããïŒäžäœäºæïŒãšããæ§è³ªãæã¡ãJavaScriptã®æ©èœã«å ããŠãåã·ã¹ãã ãES6以äžã®ææ°ã®JavaScriptæ©èœããµããŒãããŠããŸãã
TypeScriptã¯ã倧èŠæš¡éçºãå¹çåããç®çã§èšèšãããŸãããåå®å šãšããç¹æ§ãæã€ããããã°ãæ©æã«çºèŠãããããšãã£ã¿ãIDEäžã§ã®ã³ãŒãè£å®ãåŸãããŸãã
ãŸããJavaScriptãšã»ãŒåãææ³ãæã€ãããJavaScriptãããå³å¯ãªåãã§ãã¯ãšããŒã«ãµããŒããå¯èœã§ãããªãããJavaScriptã®æã€èªç±åºŠãšæè»æ§ãä¿æããŠããŸãã
1.1 TypeScriptã®åºæ¬çãªç¹æ§
TypeScriptã§ã¯ãéçåãã§ãã¯ãå¯èœã§ããåãå©çšããããšã§ãéçºäžã«ãšã©ãŒãçŽ æ©ãçºèŠããããšãã§ããŸããããã¯ããã«ãæã«åãšã©ãŒãæ€åºãããããã©ã³ã¿ã€ã ãšã©ãŒãæžããå©ããšãªããŸãã
ã¯ã©ã¹ããžã§ããªã¯ã¹ãã€ã³ã¿ãŒãã§ãŒã¹ãªã©ãããå ç¢ãªãªããžã§ã¯ãæåã®ããã°ã©ãã³ã°ããµããŒãããŠããŸããããã«ããã倧èŠæš¡ãªéçºãããŒã ã§ã®éçºã容æã«ãªããŸãã
ãŸããES6以äžã®ææ°ã®JavaScriptã®ææ³ãæ©èœãå®å šã«ãµããŒãããŠãããããå¹ççã§çŸä»£çãªã³ãŒãã£ã³ã°ã¹ã¿ã€ã«ãå°å ¥ããããšãå¯èœã§ãã
1.2 TypeScriptãšJavaScriptã®éã
TypeScriptãšJavaScriptã®æ倧ã®éãã¯ããéçåä»ããã®ååšã§ããJavaScriptã¯åçåèšèªã§ãããå€æ°ã®åã宣èšæã«å®çŸ©ããå¿ èŠã¯ãããŸãããäžæ¹ãTypeScriptã§ã¯ãå€æ°ã®åãæ瀺çã«å®£èšããããšãã§ããŸãã
ãŸããTypeScriptã¯JavaScriptã®ã¹ãŒããŒã»ãããšããæ§æ Œãæã¡ãJavaScriptã®å šãŠã®æ©èœããµããŒãããŠããŸããããã«ãããJavaScriptã®ã³ãŒãã¯ãã®ãŸãŸTypeScriptãšããŠåäœããŸãã
ãªããžã§ã¯ãæåããã°ã©ãã³ã°ã®ãµããŒãã匷åãããŠãããã¯ã©ã¹ãšã€ã³ã¿ãŒãã§ãŒã¹ãå®å šã«ãµããŒãããŠããŸããããã«ããã倧èŠæš¡ãªéçºã«ãããã³ãŒãã®æŽçãšåå©çšã容æã«ãªããŸãã
1.3 TypeScriptã®æŽå²ãšèæ¯
TypeScriptã¯ãMicrosoftã«ãã£ãŠ2012幎ã«çºè¡šãããŸããããã®ç®çã¯ãJavaScriptã®æã€åé¡ã解決ãã倧èŠæš¡ã¢ããªã±ãŒã·ã§ã³ã®éçºã容æã«ããããšã§ããã
TypeScriptã®éçºã¯ãJavaScriptãæã€åã·ã¹ãã ã®æ¬ åŠãã倧èŠæš¡éçºã«å¿ èŠãªããŒã«ã®ãµããŒãã匷åããããšãç®æããŠå§ãŸããŸãããããã«ãããJavaScriptã®æ¬ ç¹ãè£å®ãã€ã€ããã®åŒ·åãªãšã³ã·ã¹ãã ãèªç±åºŠãä¿æããããšã«æåããŸããã
TypeScriptã®æ®åã¯ãäž»ã«ããã³ããšã³ãã®JavaScriptãã¬ãŒã ã¯ãŒã¯ã§ã®æ¡çšã«ãã£ãŠå éããŸãããç¹ã«Angularã®éçºããŒã ãTypeScriptãæ¡çšããããšã§ããã®ååšãããåºãç¥ãããããã«ãªããŸããã
1.4 TypeScriptã®æ®åç¶æ³
TypeScriptã¯ããã®çºè¡šä»¥æ¥ããã¬ã³ãããªãŒãããJavaScriptãã¬ãŒã ã¯ãŒã¯ã«æ¡çšãããJavaScriptéçºè ã®äžã§åºãåãå ¥ããããŠããŸãã
ç¹ã«ã人æ°ã®JavaScriptãã¬ãŒã ã¯ãŒã¯ã§ããAngularãVue.jsãReactãªã©ãTypeScriptã®ãµããŒããå ¬åŒã«çºè¡šããçµæãšããŠTypeScriptãçšããéçºããŸããŸãæ®åããŠããŸãã
çŸåšã§ã¯ãJavaScriptã®å€§èŠæš¡éçºã«ãããŠã¯TypeScriptãæ¡çšããã®ãäžè¬çãšãªãããã®å°äœã¯åŒãç¶ã確ç«ãã€ã€ãããŸãã
2. TypeScriptã®å©ç¹
TypeScriptãéçºè ãã¡ã«éžã°ããçç±ã¯ããã®å€å²ã«æž¡ã匷åãªç¹æ§ãšè¯å¥œãªéçºç°å¢ã«ãããã®ã§ãã以äžããã®äž»èŠãªå©ç¹ã«ã€ããŠè§£èª¬ããŸãã
TypeScriptã®å©ç¹ã¯ããã€ããããŸããã以äžã®åã€ãäž»èŠãªå©ç¹ãšããŠæããŸãã
ããããã®ç¹æ§ã¯ãJavaScriptãããå®å šã§ãå¹ççãªèšèªã«é²åãããããã®æ段ãšãªããã®ã§ãã
2.1 åå®å šæ§
TypeScriptã®æãéèŠãªç¹æ§ã®äžã€ãåå®å šæ§ã§ãã
åå®å šæ§ãšã¯ãã³ã³ãã€ã«æã«åã®äžè²«æ§ããã§ãã¯ããããšã§ãã©ã³ã¿ã€ã ãšã©ãŒãäžæ£ãªã¡ã¢ãªã¢ã¯ã»ã¹ãé²ãæ©èœã®ããšã§ããJavaScriptããã€ãããã¯ã«åã決å®ããã®ã«å¯ŸããTypeScriptã¯éçåä»ããæäŸããŸãã
ãã®çµæãTypeScriptã«ã¯ãäºããšã©ãŒã®çºçå¯èœæ§ãæžãããã³ãŒãã®å質ãåäžãããå¹æããããŸãã
2.2 æ¢åã®JavaScriptãšã®èŠªåæ§
ãŸããTypeScriptã¯JavaScriptã®ã¹ãŒããŒã»ããã§ãããããæ¢åã®JavaScriptã³ãŒããå€æŽããã«ãã®ãŸãŸTypeScriptãšããŠäœ¿ãããšãå¯èœã§ãã
ããã¯ãæ¢åã®JavaScriptãšã®é«ãäºææ§ã瀺ããŠãããJavaScriptéçºè ãéåæãªã移è¡ããæå©ããšãªããŸãã
ã€ãŸããJavaScriptã®ã³ãŒãããŒã¹ãTypeScriptã«åãæ¿ããéã®ããŒãã«ãäœãããããšãã§ããŸãã
2.3 å®çŸ©ãã¡ã€ã«ãšã©ã€ãã©ãªãµããŒã
TypeScriptã®ããäžã€ã®å€§ããªå©ç¹ã¯ãé«åºŠãªå®çŸ©ãã¡ã€ã«ãšã©ã€ãã©ãªãµããŒããæã£ãŠããããšã§ãã
æ¢åã®JavaScriptã©ã€ãã©ãªãTypeScriptã§å©çšããéã«ã¯ããåå®çŸ©ãã¡ã€ã«ããçšããŠã©ã€ãã©ãªã®APIãå©çšããŸããããã¯ãTypeScriptã®éçåæ€æ»æ©èœã掻ããããã®éèŠãªã¹ãããã§ãããããJavaScriptã©ã€ãã©ãªããã¬ãŒã ã¯ãŒã¯ãå®å šã«å©çšã§ããŸãã
ãã®ããã«ãTypeScriptã¯å€§èŠæš¡ãªãããžã§ã¯ããå€æ°ã®ã©ã€ãã©ãªã䜿çšããéã«æå¹ãªèšèªãšãããŸãã
2.4 ããŒã«ãšãšãã£ã¿ã®ãµããŒã
TypeScriptã¯ãäžæµã®ããŒã«ãšãšãã£ã¿ã®ãµããŒããæããŠããŠããããTypeScriptã®äººæ°ã«å€§ãã«è²¢ç®ããŠããŸãã
äŸãã°ãMicrosoftã®Visual Studio Codeã§ã¯ãTypeScriptæ©èœããã«ãã€ã³ãããŠããã匷åãªåãã§ãã«ãŒãšã€ã³ããªã»ã³ã¹ïŒã³ãŒãè£å®ïŒãæäŸããŸãã
ããã«ãããTypeScriptã§ã®éçºã¯JavaScript以äžã«ã¹ã ãŒãºãã€å¹ççã«è¡ãããšãå¯èœãšãªããŸãã
3. TypeScriptãã¬ãŒã ã¯ãŒã¯ã®çŽ¹ä»
TypeScriptãã¬ãŒã ã¯ãŒã¯ãšã¯ãTypeScriptèšèªã®æã€åŒ·åãªåã·ã¹ãã ãçãããªãããéçºãã¹ã ãŒãºã«è¡ãããã®ããŒã«ãã©ã€ãã©ãªã®éåäœã§ãã以äžã«ãä»å¹Žäžã«åºãŠãã泚ç®ã®ãã¬ãŒã ã¯ãŒã¯ãããã¯ã¢ããããŸãã
ãã®ç« ã§ã¯ãTypeScriptãã¬ãŒã ã¯ãŒã¯ãšããŠéèŠæ§ãå¢ããŠããŠããAngular, React with TypeScript, Vue.js with TypeScript, Nest.jsãã玹ä»ããŸãã
åãã¬ãŒã ã¯ãŒã¯ã¯ç¹è²ãå©çšã·ãŒã³ã«éãããããŸãã®ã§ãèªèº«ã®ãããžã§ã¯ãã«ã©ããåããæ¯èŒæ€èšããŠã¿ãŠãã ããã
3.1 Angular
Angularã¯å€§èŠæš¡ãªãããžã§ã¯ãã«é©ããŠãããå šé¢çã«TypeScriptããµããŒãããŠããŸããã¢ãžã¥ãŒã«ããŒã¹ã®æ§é ã§ãã³ãŒãã®åå©çšæ§ãšãã¹ãã®å®¹ææ§ãåäžãããŠããŸãã
Angularã¯èªåè£å®ãããã²ãŒã·ã§ã³ãããã³ãªãã¡ã¯ã¿ãªã³ã°ãå¯èœã«ããéçåä»ããæäŸããŸããããã«ãããéçºè ã¯ã³ãŒãã®å質ã確ä¿ããªããå¹ççã«ã³ãŒããæžãããšãã§ããŸãã
ãŸããéçºé床ãå éããããã®è±å¯ãªããŒã«ãä»å±ããŠããŸããç·ååãšé«ãçç£æ§ãé åã®ãã¬ãŒã ã¯ãŒã¯ãšèšããŸãã
3.2 React with TypeScript
React with TypeScriptã¯ãTypeScriptãšçµã¿åãããããšãã«ç䟡ãçºæ®ããŸããReactã¯UIã©ã€ãã©ãªã§ãããTypeScriptã®åã·ã¹ãã ãå ããããšã§å€§ããªå®å®æ§ãå®çŸããŸãã
TypeScriptã¯ãReactã§ã®éçºã«å€å€§ãªã¡ãªããããããããŸããç¹ã«å€§èŠæš¡ãªãããžã§ã¯ãã§ã¯ãã³ã³ããŒãã³ãã®äºæãã¬äœ¿çšãé²ãã ããéçºè éã§ã®ã³ãŒãç解ã®éããæå°éã«æããå©ãã«ãªããŸãã
é«éãªã¬ã³ããªã³ã°ãšã³ã³ããŒãã³ãããŒã¹ã®éçºã«å ããTypeScriptã®åå®å šæ§ãèåããããšã§ã匷åãªéçºäœéšãæäŸããŸãã
3.3 Vue.js with TypeScript
Vue.js with TypeScriptã¯ãVue.jsã®ãã¬ãã·ãã«ãªãªãã·ã§ã³ãšTypeScriptã®åŒ·åãªåå®å šæ§ãçµã¿åããããã¬ãŒã ã¯ãŒã¯ã§ããVue.jsã¯å ã JavaScriptã®ãã¬ãŒã ã¯ãŒã¯ã§ãããTypeScriptãšã®äºææ§ã匷åãããŠããŸãã
éçºè ã¯Vue.jsã®APIãæ¡åŒµãã圢ã§TypeScriptã䜿çšããããšãã§ããããããããšã§ã³ãŒãã«éçåæ å ±ãæäŸããŸãã
ããã«ãããTypeScriptã¯Vue.jsã®ã³ã³ããŒãã³ãæ§é ãVue.jsç¹æã®APIåŒã³åºãã«å¯Ÿããè¯å¥œãªåãã§ãã¯ãšã³ãŒãè£å®ãæäŸããããšãã§ããŸãã
3.4 Nest.js
Nest.jsã¯ãå¹çãšã¹ã±ãŒã©ããªãã£ã«å¯ŸããèŠæ±ãé«ãŸããšã³ã¿ãŒãã©ã€ãºã¬ãã«ã®ã¢ããªã±ãŒã·ã§ã³åãã®TypeScriptãã¬ãŒã ã¯ãŒã¯ã§ãã
äž»ã«ãµãŒããŒãµã€ãã®éçºã«çšããããExpressãšçµã¿åãããŠäœ¿çšããããšãåºæ¥ãŸãã
å å®ããšå質ãæ±ãããŸã倧èŠæš¡ãªãããžã§ã¯ãã§ã®éçºäœéšãåªå ããå ŽåãNest.jsã¯åŒ·åãªéžæè¢ãšãªãã§ãããã
4. TypeScriptãã¬ãŒã ã¯ãŒã¯ã®éžæã¬ã€ã
ãã®ç¯ã§ã¯ãTypeScriptãã¬ãŒã ã¯ãŒã¯ã®éžæã«é¢ããã¬ã€ãã«ã€ããŠè§£èª¬ããŸãããã¬ãŒã ã¯ãŒã¯ãéžæããããã®è©äŸ¡åºæºãããŒãºã«åãããéžææ³ããã¬ãŒã ã¯ãŒã¯ã®æ¯èŒãšéžæã®ãã³ãããããŠæé©ãªãã¬ãŒã ã¯ãŒã¯ãéžã¶çç±ã«ã€ããŠè©³è¿°ããŸãããããã®æ å ±ãéããŠãããªããèªåã®ãããžã§ã¯ãã«é©ãããã¬ãŒã ã¯ãŒã¯ãèŠã€ããæå©ãã«ãªãã°å¹žãã§ãã
4.1 ãã¬ãŒã ã¯ãŒã¯ã®è©äŸ¡åºæº
ãŸãããã¬ãŒã ã¯ãŒã¯ãè©äŸ¡ããåºæºã«ã€ããŠèå¯ããŸãããã¬ãŒã ã¯ãŒã¯ã®éžæã¯å®¹æãªäœæ¥ã§ã¯ãªããããã©ãŒãã³ã¹ãåŠç¿ã³ã¹ããã³ãã¥ããã£ã®ãµããŒããªã©å€ãã®èŠçŽ ãèæ ®ããŠè¡ããªããã°ãªããŸããã
æ§èœã¯ãã¢ããªã±ãŒã·ã§ã³ãé«éã«åäœãããŠãŒã¶ãŒäœéšãæ倧åããããã«ã¯éèŠãªèŠçŽ ã§ãããŸãããã¬ãŒã ã¯ãŒã¯ã®åŠç¿æ²ç·ã¯æ¥ã§ããã°ããã»ã©ãããžã§ã¯ãã®éå§ãé ããçµæçã«éçºã®å¹çãäžããŸããããã«ãã³ãã¥ããã£ã®ãµããŒãã®ååšã¯ãåé¡ãçºçããéã®å¯Ÿå¿åã倧ããå·Šå³ããŸãã
ãããã®è©äŸ¡åºæºãå ã«èªèº«ã®ãããžã§ã¯ãã«æãé©ãããã¬ãŒã ã¯ãŒã¯ãéžã¶ããšãéèŠã§ãã
4.2 ãããžã§ã¯ãã®ããŒãºã«åããããã¬ãŒã ã¯ãŒã¯éžææ³
次ã«ããããžã§ã¯ãã®ããŒãºã«åããããã¬ãŒã ã¯ãŒã¯ã®éžææ³ã«ã€ããŠèª¬æããŸãããããžã§ã¯ããè¿œæ±ãã¹ãç®æšãæã€ã¹ãæ©èœãæ確ã«ç解ããäžã§ããã®ããŒãºã«æé©ãªãã¬ãŒã ã¯ãŒã¯ãéžãã§ãã ããã
äŸãã°ã泚éãã¹ãã¯ã¢ããªã±ãŒã·ã§ã³ã®ããã©ãŒãã³ã¹ãSEO察çã§ãããªãã°ãããããéèŠãããã¬ãŒã ã¯ãŒã¯ãéžæãã¹ãã§ããäžæ¹ã§ãã¯ã€ãã¯ãªéçºãæ±ããããå Žåã¯ãåŠç¿ã³ã¹ãã®äœããã¬ãŒã ã¯ãŒã¯ãéžã¶ããšãçæ³çã§ãã
ããŒãºã«åããããã¬ãŒã ã¯ãŒã¯ã®éžæã¯ããããžã§ã¯ãã®æåã«çŽçµããŸãã
4.3 ãã¬ãŒã ã¯ãŒã¯ã®æ¯èŒãšéžæã®ãã³ã
ãŸãã¯ãæ§ã ãªTypeScriptãã¬ãŒã ã¯ãŒã¯ãæ¯èŒããããããã®ç¹æ§ãææ¡ããããšã倧åã§ãã
äŸãã°ãAngularã¯å€§èŠæš¡éçºã«é©ãããã¬ãŒã ã¯ãŒã¯ã§ãTypeScriptã®ç¹æ§ãæ倧é掻çšã§ããŸããReactã¯å¿ èŠæå°éã®ãã¬ãŒã ã¯ãŒã¯ã§ãããèªç±ãªéçºã¹ã¿ã€ã«ã奜ã人ã«é©ããŠããŸãããã®ä»ã«ããé©æ°çãªæè¡ãæ¡çšããŠããVue.jsãæè¿åºçŸããSSGãµã€ããžã§ãã¬ãŒã¿ãŒã®Next.jsãªã©ãèªåã®ããŒãºã«åã£ããã®ãéžã³ãŸãããã
ããããã®ãã¬ãŒã ã¯ãŒã¯ãæäŸããæ©èœãæ§è³ªã瀟åºã®ç¶æ³ãªã©ãæ¯èŒæ€èšãããããžã§ã¯ãã«æãé©ãããã¬ãŒã ã¯ãŒã¯ãèŠã€ãããšè¯ãã§ãããã
4.4 ããªãã®ãããžã§ã¯ãã«æé©ãªãã¬ãŒã ã¯ãŒã¯ãéžã¶çç±
æåŸã«ããªãããªãèªèº«ã®ãããžã§ã¯ãã«æé©ãªãã¬ãŒã ã¯ãŒã¯ãéžã¶ã¹ããªã®ãããã®çç±ãè¿°ã¹ãŸããããã¯ãç¡é§ãªäœæ¥ãé¿ããå¹ççã«éçºãé²ããããã§ãã
ãã¬ãŒããªããããã®ãã¬ãŒã ã¯ãŒã¯éžæã¯ãäžé©åãªéžæãè¡ãããå Žåã«ã¯éäžã§å€§ããªåé¡ãçããå¯èœæ§ããããŸãããã®ãããéçºåæ段éã§ã®é©åãªãã¬ãŒã ã¯ãŒã¯éžæã¯ããããžã§ã¯ãã®è³ªã確ä¿ããããã«ã¯éçºãµã€ã¯ã«ãççž®ããããã«éåžžã«éèŠãªããã»ã¹ãšãªããŸãã
ãããã®æ å ±ãèžãŸããããªããèªèº«ã®ãããžã§ã¯ãã«æé©ãªãã¬ãŒã ã¯ãŒã¯ãéžæããéã®äžå©ãšãªãã°å¹žãã§ãã
5. TypeScriptãã¬ãŒã ã¯ãŒã¯ã䜿ã£ãŠéçºãå§ããããã®æºå
ä»ããå€ãã®éçºè ãTypeScriptãã¬ãŒã ã¯ãŒã¯ã䜿çšããŠãå å®ããéçºç°å¢ãç¯ãäžããŠããŸããããããªãããTypeScriptãã¬ãŒã ã¯ãŒã¯ãçšããŠéçºãå§ããã«ã¯ãããã€ãã®æºåãå¿ èŠã§ãããã®ç« ã§ã¯ãã®æºåã®æé ãé ãè¿œã£ãŠè§£èª¬ããŸãã
ãŸããæåã«è¡ãã¹ãã¯TypeScriptã®ç°å¢èšå®ã§ããããšãèŠããŠãããŠãã ããããã®æ¬¡ã«ãã¬ãŒã ã¯ãŒã¯ã®èšå®ãšã€ã³ã¹ããŒã«ã«ç§»ãããããžã§ã¯ããã³ãã¬ãŒãã®ã»ããã¢ãããçµãŠãæçµçã«éçºç°å¢ã®ãã§ãã¯ãè¡ããŸãã
ãããã®é åºãç解ããããããã®æé ãäžå¯§ã«è¡ãããšã§ãã¹ã ãŒãºã«éçºãå§ããããšãã§ããŸãã
5.1 TypeScriptã®ç°å¢èšå®
TypeScriptã®ç°å¢èšå®ãè¡ãæåã®ã¹ããããšããŠãTypeScriptã³ã³ãã€ã©ãã€ã³ã¹ããŒã«ããŸããäžè¬çã«ã¯npmïŒNode.jsã®ããã±ãŒãžãããŒãžã£ïŒãçšããŠã€ã³ã¹ããŒã«ãè¡ããŸãã
ãŸããVS Codeãªã©ã®ãšãã£ã¿ã§TypeScriptãéçºããå Žåã¯ãTypeScriptã®ãã©ã°ã€ã³ãã€ã³ã¹ããŒã«ããããšã§ãã³ãŒãè£å®ãã·ã³ã¿ãã¯ã¹ãã€ã©ã€ãæ©èœãå©çšããããšãã§ããŸãã
ãããã®åºæ¬çãªèšå®ãçµããããããTypeScriptã®ç°å¢èšå®ã¯ä»¥äžã§ããã€ãã«ã䜿çšãããã¬ãŒã ã¯ãŒã¯ã®èšå®ãšã€ã³ã¹ããŒã«ã«é²ã¿ãŸãã
5.2 ãã¬ãŒã ã¯ãŒã¯ã®èšå®ãšã€ã³ã¹ããŒã«
TypeScriptã§äœ¿çšãããã¬ãŒã ã¯ãŒã¯ã«ã¯ãå€çš®å€æ§ãªãã®ãååšããŸãããã®äžããé©åãªãã¬ãŒã ã¯ãŒã¯ãéžãã äžã§ãã€ã³ã¹ããŒã«ãé²ããŸãã
Angular, React, Vue.jsãšãã£ããã¬ãŒã ã¯ãŒã¯ã¯ãnpmãä»ããŠå®æã«ã€ã³ã¹ããŒã«ã§ããŸããnpmãããéžæãããã¬ãŒã ã¯ãŒã¯ã®ããã±ãŒãžãã€ã³ã¹ããŒã«ããŸãã
ãã¬ãŒã ã¯ãŒã¯ã®ã€ã³ã¹ããŒã«ãçµããã°ãç¹å®ã®ãã¬ãŒã ã¯ãŒã¯ã«åºæã®èšå®ãè¡ãããšãæ±ããããŸããããããã®èšå®æ¹æ³ã¯ãå ¬åŒããã¥ã¡ã³ããŒã·ã§ã³çãåèã«ãããšè¯ãã§ãããã
5.3 ãããžã§ã¯ããã³ãã¬ãŒãã®ã»ããã¢ãã
ãã¬ãŒã ã¯ãŒã¯ã®èšå®ãšã€ã³ã¹ããŒã«ãå®äºãããããããžã§ã¯ããã³ãã¬ãŒãã®ã»ããã¢ãããå§ããŸããããã«ãããéçºãã¹ã ãŒãºã«è¡ããç°å¢ãæŽããåæã«ãããžã§ã¯ãã®æ§æãç解ããããšãå¯èœã«ãªããŸãã
å€ãã®ãã¬ãŒã ã¯ãŒã¯ã§ã¯ãCLIããŒã«ãæäŸãããŠãããããã䜿ã£ãŠãããžã§ã¯ããã³ãã¬ãŒãã®ã»ããã¢ãããè¡ããšç°¡åã§ããããšãã°ãAngular CLIãVue CLIãããã«åœãããŸãã
ãããžã§ã¯ããã³ãã¬ãŒãã®ã»ããã¢ãããå®äºããããéçºç°å¢ã®æçµãã§ãã¯ã«é²ã¿ãŸãã
5.4 éçºç°å¢ã®æçµãã§ãã¯
æåŸã«ãéçºç°å¢ã®æçµãã§ãã¯ãè¡ããŸããèšå®ãã€ã³ã¹ããŒã«ãã»ããã¢ãããæ£ããè¡ãããŠãããã確èªããéèŠãªã¹ãããã§ãã
å ·äœçã«ã¯ãéçºãµãŒããç«ã¡äžããŠãWebãã©ãŠã¶äžã§ã¢ããªã±ãŒã·ã§ã³ãæ£åžžã«è¡šç€ºããããããŸããã³ã³ãœãŒã«ã«ãšã©ãŒã衚瀺ãããŠããªãããªã©ã確èªããŸãã
ããããåé¡ãªãé²è¡ããå Žåãéçºç°å¢ã®æºåã¯å®äºã§ããããã§TypeScriptãã¬ãŒã ã¯ãŒã¯ãå©çšããéçºãå§ããããšãã§ããŸãã
6. TypeScriptãã¬ãŒã ã¯ãŒã¯ã§ã®éçºæ¹æ³ãšãã¹ããã©ã¯ãã£ã¹
TypeScriptãã¬ãŒã ã¯ãŒã¯ã§ã¯ãåå©çšå¯èœãªã³ã³ããŒãã³ããäœæããŠã³ãŒãã®éè€ãé¿ããã¢ããªã±ãŒã·ã§ã³ã®ããã©ãŒãã³ã¹ãæé©åããããšã§å¹ççãªéçºãé²ããããšãå¯èœã§ãããã®ç¯ã§ã¯ããããã®éçºæ¹æ³ãšãã¹ããã©ã¯ãã£ã¹ã詳ããã玹ä»ããŸãã
6.1 ã³ã³ããŒãã³ãæåéçºã®åºæ¬
TypeScriptãã¬ãŒã ã¯ãŒã¯ã§ã¯ãã³ãŒãã®åå©çšæ§ãé«ããããã«ãã³ã³ããŒãã³ãæåã®éçºãéèŠãããŸããã³ã³ããŒãã³ãæåéçºã§ã¯ãUIã®äžéšãäžã€ã®ãã³ã³ããŒãã³ãããšããŠæœè±¡åããããããçµã¿åãããŠã¢ããªã±ãŒã·ã§ã³ãæ§ç¯ããŸãã
ã³ã³ããŒãã³ãã¯ãç¶æ ãšããžãã¯ãæã€ããšãã§ããåæ£éçºãè¡ãããããªããŸãããŸãããã¹ãããããã°ãã³ã³ããŒãã³ãåäœã§è¡ãããšãå¯èœã§ãå質ä¿èšŒã容æã«ãªããŸãã
ãã¬ãŒã ã¯ãŒã¯ãå©çšãããšãã³ã³ããŒãã³ãã©ã€ããµã€ã¯ã«ã管çããã€ãã³ããã³ãã©ãªã©ã®å®åçãªåŠçãäžè²«ããæ¹æ³ã§æžãããšãå¯èœã«ãªããŸããããããTypeScriptãã¬ãŒã ã¯ãŒã¯ã䜿çšãã倧ããªçç±ã®äžã€ã§ãã
6.2 ããã©ãŒãã³ã¹ãšæé©å
ã¢ããªã±ãŒã·ã§ã³ã®ããã©ãŒãã³ã¹ã¯ããŠãŒã¶äœéšã®è³ªãçŽæ¥æ±ºå®ããŸããTypeScriptãã¬ãŒã ã¯ãŒã¯ã§ã¯ãå¹ççãªã¬ã³ããªã³ã°ãšæŽæ°ãéèŠãããŸãããã®ããã®å€ãã®æé©åææ³ãæäŸãããŠããŸãã
äŸãã°ãä»®æ³DOMãçšããããšã§ãçŸåšã®è¡šç€ºç¶æ ãšæ°ããªç¶æ ã®å·®åãå¹ççã«èšç®ããå¿ èŠæå°éã®æŽæ°ããè¡ããªããŠæžãããã«ãªããŸãã
ãŸããéåæåŠçãé 延ããŒããªã©ã®ææ³ãçšããããšã§ãå¿ èŠãªãªãœãŒã¹ã®èªã¿èŸŒã¿ãå¹ççã«å®è¡ããããšãå¯èœã§ãã
6.3 ãã¹ããšãããã°
TypeScriptãã¬ãŒã ã¯ãŒã¯ã§ã¯ãèªååããããŠããããã¹ããçµ±åãã¹ããæšå¥šãããŸãããã¹ãã¯ã³ãŒãã®å質ãä¿èšŒãããã°ã®æ©æçºèŠãå¯èœã«ããŸãã
ç¹ã«ãã³ã³ããŒãã³ãæåã®éçºã§ã¯ãåã³ã³ããŒãã³ãããšã«ç¬ç«ããŠãã¹ããè¡ãããšãå¯èœãªããããã¹ãã®ç²åºŠã现ããããããããã°ã®ç¹å®ã容æã§ãã
ãããã°ã«ã€ããŠããéçºããŒã«ã®é²æ©ã«ããããã©ãŠã¶äžã§çŽæ¥ã³ãŒãã®åäœã確èªããªãããããã°ãè¡ãããšãäž»æµãšãªã£ãŠããŸãã
6.4 ãããã€ãšã¡ã³ããã³ã¹
ã¢ããªã±ãŒã·ã§ã³ã®ãããã€ã¯ãéçºãããœãããŠã§ã¢ãå®éã®ç°å¢ã«é åžããè¡çºãæããŸããTypeScriptãã¬ãŒã ã¯ãŒã¯ã§ã¯ãç¶ç¶çãªã€ã³ãã°ã¬ãŒã·ã§ã³(CI)ãšãããã€ã¡ã³ã(D)ã容æã«ããŸãã
ãŸããã¡ã³ããã³ã¹æ®µéã§ã¯ãã¡ãããéçºäžãããã¥ã¡ã³ããŒã·ã§ã³ã®ç¶æãšæŽæ°ãäžå¯æ¬ ã§ããããŒã«ã䜿çšããŠèªåçã«ããã¥ã¡ã³ããŒã·ã§ã³ãçæããã³ãŒããšåæãããããšãæšå¥šãããŸãã
ããã§çŽ¹ä»ããéçºæ¹æ³ãšãã¹ããã©ã¯ãã£ã¹ã¯ããªãŒãã³ãœãŒã¹ã³ãã¥ããã£ã倧æITäŒæ¥ã«ãã£ãŠé·å¹Žã«æž¡ãè©Šè¡é¯èª€ãããŠãããã®ã§ãTypeScriptãã¬ãŒã ã¯ãŒã¯ã®éçºãéããŠå®è·µããããšã§ãé«å質ãªãœãããŠã§ã¢éçºãå¯èœãšãªããŸãã