ãðªã¡ã³ã¿ãªã³ã°å®çžŸ.10ãæªçµéšããããªãŒã©ã³ã¹ã§å®åçµéšãç©ã¿ãèªç€ŸéçºäŒæ¥ïŒããã³ããšã³ãïŒã«è»¢è·æ±ºå®ïŒð
ãã®åºŠã¡ã³ãã£ãŒã®æ¹ãããæªçµéšâããªãŒã©ã³ã¹æ¡ä»¶ç²åŸâèªç€ŸéçºäŒæ¥ã«å°±è·æ±ºå®ãããæ¹ãåºãŸããïŒ
ããã§ãæ¬ãã©ã³ãåè¬ããŠã©ãã ã£ãã®ãççŽãªãæ°æã¡ãã€ã³ã¿ãã¥ãŒããŸããã
åè¬ãæ€èšãããŠããæ¹ã¯ãã²ã芧ãã ããïŒ
ç¥æŽ
- ååïŒããã¯ããŒã ïŒ
- T.Kãã
- 幎霢
- 27æ³
- æ§å¥
- ç·æ§
- å±
äœå°
- æ±äº¬
- ãããŸã§ã®è·æŽ
- æ°åã§å€§æå€è³ç³»äŒæ¥å ¥ç€ŸïŒããŒã±ãã£ã³ã°è·ïŒïŒ3幎匱å€å
- 3ã¶æã®ããã°ã©ãã³ã°åŠç¿æéãçµãŠãããªãŒã©ã³ã¹ãšã³ãžãã¢ïŒ2021幎1æãçŸåšãŸã§ç¶ç¶äž
- ã¹ã¿ãŒãã¢ããã®ããã³ããšã³ããšã³ãžãã¢ãšããŠå ¥ç€Ÿäºå®
- é«å以éã®åŠæŽ
- ç§ç«å€§åŠååŠéšå
- æ¬ãã©ã³ãå¥çŽãããŸã§ã®ããã°ã©ãã³ã°åŠç¿çµéš
- åŠçæ代ãã€ã³ã¿ãŒã³å ã§HTML, CSSã«è§ŠããçšåºŠ
- æ¬ãã©ã³ã®åè¬æé
- 7ã¶æéã§ããŒããã©ãªãªã¢ããªäœæ
ãªããšã³ãžãã¢ãç®æããŸãããïŒ
ââåè·ã§ãèªãã®æ¥åããœãããŠã§ã¢ã«ä»£æ¿ãããŠããæµãã«å±æ©æããã£ãããã§ãã
ããããèªç¶ã«ãœãããŠã§ã¢ãäœãåŽã«ãªããªããã°ãããªããšæãããã«ãªããããã°ã©ãã³ã°åŠç¿ã«èžã¿åããŸããã
æ°ãããµãŒãã¹ã®äžã§ããªãæ¬ãã©ã³ãåè¬ããŸãããïŒ
äŒè€ããã®MENTAã«æ¹ãããã®ã¯ãäŸ¡æ Œãå®ãããšã§ããããã以å€ã§ã¯ãNuxt, Firebaseãªã©ã®ææ°ãã¬ã³ããæŽãã§ãå¹ççã«ããã³ããšã³ããšã³ãžãã¢è»¢è·ãç®æããã«ãªãã¥ã©ã æ§æã ã£ãããšã倧ããã§ãããã®ãããªãµããŒãäœå¶ãç§ã®åžæãšãããããŠããŸããã
ãŸããMENTAäžã§æ°åã®ã¡ã³ã¿ãŒã®æ¹ãšãããšãããŠããŸããããã¡ãã»ãŒãžå¯Ÿå¿ïŒè¿ä¿¡ã¹ããŒããæç« ã®å
容ãªã©ïŒã§äººæè¯ãæããã®ãäŒè€ããã ã£ãã®ã§ãåè¬ããããšã決ããŸããã
å®éã«ãµããŒããåããŠã¿ãŠã©ãã§ãããïŒ
ççŽã«ãéåžžã«è¯ãã£ããšæã£ãŠããŸãã
é±1åããã¡ã³ã¿ãªã³ã°ã§ã¯ãããã°ã©ãã³ã°ã®è³ªå察å¿ã ãã§ãªããå匷æ³ã®çŽ¹ä»ãåŠç¿ããæè¡ã®éžå®ãµããŒããŸã§è«žã
ãã©ããŒé ããŸãããã¡ã³ã¿ãªã³ã°åŸã¯ããããšãæ確ã«ãªãã®ã§ãïŒé±éã®åŠç¿èšç»ãç«ãŠãããæãé£ãã£ãã§ãã
ãŸããåè¬ãéå§ãããšåŠç¿ç®¡çã®ã¹ãã¬ããã·ãŒããæž¡ããã
- åŠç¿é ç®
- åŠç¿ã¹ã±ãžã¥ãŒã«
- æè¡ã¬ãã«
- åèã«ãã¹ãææ
ãªã©ãææ¡ããããšãã§ããŸããäœãã©ã®ãããåŠç¿ããã°è»¢è·ã¬ãã«ã«éããã®ããèŠå®ããããã®ã§ãå¹ççã«åŠç¿ãé²ããããšãã§ããŸããã
åŠç¿äžã¯ãã©ã®ããã«ã«ãªãã¥ã©ã ãé²ããŠããŸãããïŒ
HTML, CSS, JS, Vue.js, Nuxt.js ãããã®å
容ã3ã¶æã§çµããŸããã
ãã®åŸã¯ããªãŒã©ã³ã¹ã®æ¡ä»¶ãããªãã€ã€ã
TypeScript, firebase, Amplifyãªã©ã®åŠç¿ãé²ããããŒã¿ã«ã§ã¯å幎çšåºŠã§å
šãŠã®ã«ãªãã¥ã©ã ãçµããŸããã
ã©ã®ãããªã¢ããªãäœæããŸãããïŒ
äžèš4ã€ã®ã¢ããªãäœæããŸããã
- ã¢ã«ãã ã¢ããª
- ECã¢ããª
- ã¢ãŒãã£ã¹ãæ€çŽ¢ã¢ããª
- Amplifyã®ã·ã§ããã³ã°ã«ãŒãã¢ããª
äžçªåãå ¥ããŠäœæããã®ãECã¢ããªã«ãªãã®ã§ããã¡ãã玹ä»ããŸãã
ã¢ããªã®æŠèŠ
Amazonãæš¡å£ããECã¢ããªïŒããããã©ã³å°éïŒ
ã¢ããªç»å
äœæèæ¯
åè·æ代ãäž»ã«ããããã©ã³ãæ±ãããŒã±ãã£ã³ã°è·ã§å€åããŠããŸããããŸããåçŽã«ããããã©ã³ã奜ããªã®ãçžãŸã£ãŠãããããã©ã³å°éã®ECã¢ããªãäœããããšæã£ãããšããã£ããã§ãã
æè¡æ§æïŒäœ¿çšèšèªã»ã¹ãã«ïŒ
- Nuxt.jsïŒSSR, vee-validate, vue-warehouse, vue-swal, slugifyïŒ
- Firebase (Auth, RealtimeDatabase, Functions,Storage)
工倫ããç¹
- Nuxt.jsã®SSRã¢ãŒãã§äœæãFirebase Functions, Hostingã§SSR Deployã
- ç¶æ 管çã«Vuexã䜿çšã
- vue-swalã§åé€ç¢ºèª
- vue-warehouseã§localã«ã«ãŒãã®ç¶æ ãä¿å
äž»ãªæ©èœ
- Loginã»SignUpæ©èœ
- 管çè ã»äžè¬ãŠãŒã¶ãŒæ©èœ
- ååç»é²æ©èœ
- ã«ãŒãè¿œå æ©èœ
- ååæ€çŽ¢æ©èœ
- ç»åã¢ããããŒãæ©èœ
äœææé
3ã¶æ
ã¢ããªãäœã£ãææ³
工倫ããããšã¯ãã¢ãã³ãªæè¡æ§æã«ããããšã§ããããªãŒã©ã³ã¹ã®æ¡ä»¶ã§çµéšããSSR Deployãçã蟌ããªã©ãå®åã§å¹ã£ãæè¡ãã¢ããŒã«ã§ããããã«æèããŸããã
ã¢ããªãäœæããŠã¿ãŠè¯ãã£ãããšã¯ãWebãµã€ãã®ããã©ãŒãã³ã¹ã®äžãæ¹ãçµéšã§ããããšã§ãããŸããåè·ã§ã¯ä»äºæECãµã€ããæ±ãããšãå€ãã£ãã®ã§ãããå®éã«ECã¢ããªãäœæããããšã§ããã°ã©ã ã®ä»çµã¿ããããã倧å€çºã«ãªããŸããã
倧å€ã ã£ãããšã¯ãç¶æ 管çã«Vuexã䜿çšããããšã§ããäž»ã«ããŒã¿ããŒã¹ã®ã¹ããŒãïŒããŒã¿ããŒã¹ã®æ§é ãè¡šçŸããèšèšå³ïŒç®¡çã倧å€ã§ããããããããããã«è§Šããããšã§ããŒã¿ããŒã¹ã®æ§é ã«ã€ããŠããæ·±ãç解ã§ããããã«ãªããŸããã
察å¿ããå 容
Webãšã³ãžãã¢å°±è·ãã©ã³ïŒé±1ã¡ã³ã¿ãªã³ã°ïŒ
æçµçµæ
èªç€ŸéçºäŒæ¥ïŒããã³ããšã³ãæ¡çšïŒã«è»¢è·æ±ºå®ããŸããïŒ
転è·æŽ»åã®è©³çŽ°ã»ææ³
åºæ¬çã«ã¯Wantedlyã転è·ãšãŒãžã§ã³ãïŒãªã¯ããã»ãã€ããïŒã掻çšããŠããŸããã
ã¡ã€ã³ã¯Wantedlyã䜿ããä»åå
å®ãããã£ãäŒæ¥ãWantedlyãããšã³ããªãŒãããšããã§ãã
ãšã³ããªãŒããã®ã¯æ°å瀟çšåºŠã§ããã
ãšã³ããªãŒã®åºæºãšããŠãäž»ã«äžèš4ç¹ãèŠãŠããŸããã
- 䜿çšèšèªãèªåã®åžæãšåã£ãŠãããïŒVue.js, Nuxt.jsïŒ
- äŒç€Ÿã®ãã§ãŒãºã倧åè³é調éïŒ1åå以äžïŒã¬ãã«ã«éããŠãããã©ãã
- ããã³ãç³»ã®æ±äººãã©ãã
- å€åå ãæ±äº¬ã§ãããã©ãã
æ¡çšåŽã«è©äŸ¡ãããç¹ãšããŠã¯ã
- æ¢ã«ããªãŒã©ã³ã¹ãšã³ãžãã¢ãšããŠå€åããŠãããå®åçµéšãããããš
- ã¢ãã³ãªæè¡ã§ããŒããã©ãªãªã¢ããªãäœããã£ããšããå®çžŸããã£ãããš
- ã¹ã¯ãŒã«ã掻çšããã«åŠç¿ãé²ãããããèªèµ°åãã¢ããŒã«ã§ããããš
ãããã®ç¹ãæãããããšæããŸãã
- å°±è·æŽ»åã®æé
- 1ã¶æå
- å
å®æ°
- 2瀟(èªç€ŸéçºäŒæ¥2)
- å
¥ç€Ÿã決å®ããäŒæ¥ã®è©³çŽ°
- ããã³ããšã³ãæ¡çš
- ããŒããŠã§ã¢ã¹ã¿ãŒãã¢ããäŒæ¥
ã¡ãã»ãŒãž
äŒè€ããã¯ãITäŒæ¥ã®çµå¶è ããã«ã¹ã¿ãã¯ãšã³ãžãã¢ãã¡ã³ã¿ãŒãšãã£ãããããªé¡ããã£ãŠããŸãããããªæ¹ã®ããšã§åŠç¿çµéšãç©ã¿ãå®åæ¡ä»¶ãããªãããããã®ã¬ãã«ã«éããããšãã§ããã°ãæªçµéšããã®è»¢è·ãæåããã¯ãã§ãã
èå³ãããæ¹ã¯ããã²Zoomçžè«ãã©ã³ã ãã§ãåããŠã¿ãŠãã ããã
ã€ã³ã¿ãã¥ãŒã¯ä»¥äžã«ãªããŸããT.KãããããããšãããããŸããïŒ
æ¬ãã©ã³ã«é¢å¿ãããæ¹ã¯ãæåã®ã¹ããããšããŠZoomçžè«ãã©ã³ã®åè¬ããªã¹ã¹ã¡ããŠããŸãã
- ããäŒæ¥ã«è¡ãããããã©ãã©ã®æè¡ãã©ã®ãããåŠç¿ããã°ãããåãããªã
- æªçµéšããWebãšã³ãžãã¢ã«è»¢è·ãããããã©ãã©ãããã°ãããã€ã¡ãŒãžã§ããªã
- ãªãªãžãã«ããŒããã©ãªãªãµã€ã/ã¢ããªãäœæãããïŒ
ãªã©ãªã©ããäžäººãã²ãšãã®ãæ©ã¿ã«åãããŠãã¢ãªã³ã°ããå
·äœçãªã¢ã¯ã·ã§ã³ãã©ã³ãæ瀺ãããŠããã ããŸãããŸããç¶ç¶ãã©ã³éžæã®çžè«ãåãä»ããŠãããŸãã
çŸåšåé¡ã»ãŒã«ãè¡ã£ãŠããããããèå³ãããæ¹ã¯ãæ°è»œã«ãç³ã蟌ã¿ãã ããïŒ
ðZoomçžè«ãã©ã³ã¯ãã¡ã
â»ãZoomçžè«ãã©ã³å¥çŽè
éå®ç¹å
žãZoomçžè«ãã©ã³å¥çŽè
ã«ã¯ãç¶ç¶ãã©ã³å¥çŽåŸã«å©çšã§ããã¹ãã«ãã§ãã¯ãå匷æ³Tipsçãããã¯ã¢ããããŠãæäŸããããŸãïŒè©³çŽ°ã¯Zoomçžè«å¥çŽåŸã«å
±æããããŸãã
ç¶ç¶ãã©ã³ã®ã玹ä»
- ãç¬åŠæ¯æŽãã©ã³ãæå®ã§èªèµ°ãã©ããŒð¥çéã§ã¢ããªãäœããããã«ãªãç¬åŠã«ãªãã¥ã©ã ïŒãã£ããã§è³ªåãæŸé¡ãã³ãã¥ããã£æåŸ ã 19,800åïŒæ
- ãWebå¶äœãã©ã³ãæ¡ä»¶ç²åŸãã©ããŒðæªçµéšããæè¡æå°ãæ¡ä»¶çŽåãŸã§å®å šãµããŒãïŒæ¡ä»¶ç²åŸåŸãç¶ç¶ãµããŒããããªãã®åžå ŽäŸ¡å€ãé«ããŸãã転è·ãçžè«å¯ðã 24980åïŒæ
- ãã¢ããªãªãªãŒã¹ãã©ã³ããªãªãžãã«ã¢ããªéçºã«ç¹åð±äŒç»ã»ä»æ§èšèšã»æè¡éžå®ããæè¡åŠç¿ãéçºãŸã§äžæ°é貫ãµããŒãããŸããé§ãåºãå人éçºè åãð»ã 29,800åïŒæ
- ãWebãšã³ãžãã¢å°±è·ãã©ã³ãã³ã¹ãæ匷ð¥ãªãªãžãã«ã¢ããªéçºã§ããŸãïŒå°çšã«ãªãã¥ã©ã ãå人ã¢ããªéçºã転è·ãŸã§ãµããŒãããŸããæ1ã¡ã³ã¿ãªã³ã°ã 29,800åïŒæ
- ãçéïŒWebãšã³ãžãã¢å°±è·ãã©ã³ãð¥1çªäººæ°ïŒð¥æªçµéšãããªãªãžãã«ã¢ããªéçºïŒè»¢è·ïŒæçã§ãã«ã¹ã¿ãã¯ãšã³ãžãã¢ç®æããŸãðãé±1ã¡ã³ã¿ãªã³ã°ã 49,800åïŒæ