{"id":27021,"date":"2025-04-09T10:34:13","date_gmt":"2025-04-09T03:34:13","guid":{"rendered":"https:\/\/hitek.com.vn\/?p=27021"},"modified":"2025-04-09T10:34:13","modified_gmt":"2025-04-09T03:34:13","slug":"front-end-web-development","status":"publish","type":"post","link":"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/","title":{"rendered":"\ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\uac00 \uc2e4\uc81c\ub85c \ud68c\uc0ac\uc5d0\uc11c \ud558\ub294 \uc77c\uc740?"},"content":{"rendered":"<p>\ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\ub294 \uc6f9\uacfc \uc571\uc758 &#8216;\uc5bc\uad74&#8217;\uc744 \ub9cc\ub4dc\ub294 \uc0ac\ub78c\ub4e4\uc774\ub2e4. \uc0ac\uc6a9\uc790\uac00 \uc9c1\uc811 \ubcf4\uace0 \ud074\ub9ad\ud558\ub294 \uc778\ud130\ud398\uc774\uc2a4\ub97c \uad6c\ud604\ud558\uba70, \ub514\uc790\uc778\uacfc \uae30\ub2a5\uc744 \ud604\uc2e4\ub85c \uc62e\uae30\ub294 \uc5ed\ud560\uc744 \ud55c\ub2e4. \uadf8\ub807\ub2e4\uba74 \uc2e4\uc81c\ub85c \ud68c\uc0ac\uc5d0\uc11c \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\ub294 \uc5b4\ub5a4 \uc77c\uc744 \ud560\uae4c? \uc774 \uae00\uc5d0\uc11c\ub294 \ud604\uc5c5\uc5d0\uc11c\uc758 \uc5c5\ubb34 \ub0b4\uc6a9, \ud544\uc694\ud55c \uae30\uc220, \uadf8\ub9ac\uace0 \uc131\uc7a5\ud558\ub294 \uac1c\ubc1c\uc790\uac00 \ub418\uae30 \uc704\ud55c \ud301\uae4c\uc9c0 \uc54c\uc544\ubcf8\ub2e4.<\/p>\n<hr \/>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_80 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title ez-toc-toggle\" style=\"cursor:pointer\">Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"\ubaa9\ucc28 \ud1a0\uae00\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#1_%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C_%EA%B0%9C%EB%B0%9C%EC%9E%90%EC%9D%98_%ED%95%B5%EC%8B%AC_%EC%97%85%EB%AC%B4\" >1. \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\uc758 \ud575\uc2ec \uc5c5\ubb34<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#1_%EC%9B%B9%EC%95%B1_%EC%9D%B8%ED%84%B0%ED%8E%98%EC%9D%B4%EC%8A%A4_%EA%B0%9C%EB%B0%9C\" >(1) \uc6f9\/\uc571 \uc778\ud130\ud398\uc774\uc2a4 \uac1c\ubc1c<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#2_API_%EC%97%B0%EB%8F%99_%EB%B0%B1%EC%97%94%EB%93%9C%EC%99%80_%ED%98%91%EC%97%85\" >(2) API \uc5f0\ub3d9 (\ubc31\uc5d4\ub4dc\uc640 \ud611\uc5c5)<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#3_%EC%84%B1%EB%8A%A5_%EC%B5%9C%EC%A0%81%ED%99%94\" >(3) \uc131\ub2a5 \ucd5c\uc801\ud654<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#4_%EB%B2%84%EA%B7%B8_%EC%88%98%EC%A0%95_%EC%9C%A0%EC%A7%80%EB%B3%B4%EC%88%98\" >(4) \ubc84\uadf8 \uc218\uc815 &amp; \uc720\uc9c0\ubcf4\uc218<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#2_%ED%9A%8C%EC%82%AC%EB%A7%88%EB%8B%A4_%EB%8B%A4%EB%A5%B8_%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C_%EA%B0%9C%EB%B0%9C%EC%9E%90%EC%9D%98_%EC%97%AD%ED%95%A0\" >2. \ud68c\uc0ac\ub9c8\ub2e4 \ub2e4\ub978 \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\uc758 \uc5ed\ud560<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#1_%EC%8A%A4%ED%83%80%ED%8A%B8%EC%97%85\" >(1) \uc2a4\ud0c0\ud2b8\uc5c5<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#2_%EC%A4%91%EA%B2%AC%C2%B7%EB%8C%80%EA%B8%B0%EC%97%85\" >(2) \uc911\uacac\u00b7\ub300\uae30\uc5c5<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#3_%EC%99%B8%EA%B5%AD%EA%B3%84%C2%B7%EA%B8%80%EB%A1%9C%EB%B2%8C_%EA%B8%B0%EC%97%85\" >(3) \uc678\uad6d\uacc4\u00b7\uae00\ub85c\ubc8c \uae30\uc5c5<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#3_%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C_%EA%B0%9C%EB%B0%9C%EC%9E%90%EC%97%90%EA%B2%8C_%ED%95%84%EC%9A%94%ED%95%9C_%EA%B8%B0%EC%88%A0_%EC%8A%A4%ED%83%9D_2024_%EA%B8%B0%EC%A4%80\" >3. \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\uc5d0\uac8c \ud544\uc694\ud55c \uae30\uc220 \uc2a4\ud0dd (2024 \uae30\uc900)<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#%ED%95%84%EC%88%98_%EA%B8%B0%EC%88%A0\" >\ud544\uc218 \uae30\uc220<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#%EC%9A%B0%EB%8C%80_%EA%B8%B0%EC%88%A0\" >\uc6b0\ub300 \uae30\uc220<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#4_%ED%95%98%EB%A3%A8_%EC%9D%BC%EA%B3%BC%EB%A1%9C_%EB%B3%B4%EB%8A%94_%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C_%EA%B0%9C%EB%B0%9C%EC%9E%90%EC%9D%98_%EC%82%B6\" >4. \ud558\ub8e8 \uc77c\uacfc\ub85c \ubcf4\ub294 \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\uc758 \uc0b6<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#5_%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C_%EA%B0%9C%EB%B0%9C%EC%9E%90%EB%A1%9C_%EC%84%B1%EC%9E%A5%ED%95%98%EA%B8%B0_%EC%9C%84%ED%95%9C_%EC%A1%B0%EC%96%B8\" >5. \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\ub85c \uc131\uc7a5\ud558\uae30 \uc704\ud55c \uc870\uc5b8<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-15\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#1_%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8_%EA%B2%BD%ED%97%98_%EC%8C%93%EA%B8%B0\" >(1) \ud504\ub85c\uc81d\ud2b8 \uacbd\ud5d8 \uc313\uae30<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-16\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#2_%EB%84%A4%ED%8A%B8%EC%9B%8C%ED%82%B9_%EC%BB%A4%EB%AE%A4%EB%8B%88%ED%8B%B0_%ED%99%9C%EB%8F%99\" >(2) \ub124\ud2b8\uc6cc\ud0b9 &amp; \ucee4\ubba4\ub2c8\ud2f0 \ud65c\ub3d9<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-17\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#3_%ED%8A%B8%EB%A0%8C%EB%93%9C_%EB%94%B0%EB%9D%BC%EC%9E%A1%EA%B8%B0\" >(3) \ud2b8\ub80c\ub4dc \ub530\ub77c\uc7a1\uae30<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-18\" href=\"https:\/\/hitek.com.vn\/ko\/blog-ko\/front-end-web-development\/#%EB%A7%88%EC%B9%98%EB%A9%B0_%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C_%EA%B0%9C%EB%B0%9C%EC%9E%90%EB%8A%94_%EB%8B%A8%EC%88%9C%ED%95%9C_%EC%BD%94%EB%8D%94%EA%B0%80_%EC%95%84%EB%8B%88%EB%8B%A4\" >\ub9c8\uce58\uba70: \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\ub294 \ub2e8\uc21c\ud55c \ucf54\ub354\uac00 \uc544\ub2c8\ub2e4<\/a><\/li><\/ul><\/nav><\/div>\n<h2 id=\"1-\"><span class=\"ez-toc-section\" id=\"1_%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C_%EA%B0%9C%EB%B0%9C%EC%9E%90%EC%9D%98_%ED%95%B5%EC%8B%AC_%EC%97%85%EB%AC%B4\"><\/span>1. \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\uc758 \ud575\uc2ec \uc5c5\ubb34<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\ub294 \ub2e8\uc21c\ud788 \ucf54\ub4dc\ub97c \uc791\uc131\ud558\ub294 \uac83\uc744 \ub118\uc5b4, <strong>\uc0ac\uc6a9\uc790 \uacbd\ud5d8(UX)<\/strong>\uacfc <strong>\uc131\ub2a5 \ucd5c\uc801\ud654<\/strong>\uae4c\uc9c0 \uace0\ub824\ud574\uc57c \ud55c\ub2e4. \uc8fc\uc694 \uc5c5\ubb34\ub294 \ub2e4\uc74c\uacfc \uac19\ub2e4.<\/p>\n<h3 id=\"-1-\"><span class=\"ez-toc-section\" id=\"1_%EC%9B%B9%EC%95%B1_%EC%9D%B8%ED%84%B0%ED%8E%98%EC%9D%B4%EC%8A%A4_%EA%B0%9C%EB%B0%9C\"><\/span><strong>(1) \uc6f9\/\uc571 \uc778\ud130\ud398\uc774\uc2a4 \uac1c\ubc1c<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li><strong>UI \uad6c\ud604<\/strong>: \ub514\uc790\uc774\ub108\uac00 \uc81c\uacf5\ud55c <a href=\"https:\/\/www.figma.com\/\" target=\"_blank\" rel=\"noopener\">Figma<\/a> \ub610\ub294 <a href=\"https:\/\/www.adobe.com\/kr\/products\/xd.html\" target=\"_blank\" rel=\"noopener\">Adobe XD<\/a> \ub514\uc790\uc778\uc744 HTML, CSS, JavaScript(\ub610\ub294 React, Vue, Angular \ub4f1)\ub85c \uad6c\ud604\ud55c\ub2e4.<\/li>\n<li><strong>\ubc18\uc751\ud615 \ub514\uc790\uc778<\/strong>: \ubaa8\ubc14\uc77c, \ud0dc\ube14\ub9bf, \ub370\uc2a4\ud06c\ud0d1 \ub4f1 \ub2e4\uc591\ud55c \uae30\uae30\uc5d0\uc11c \ucd5c\uc801\ud654\ub41c \ud654\uba74\uc744 \uc81c\uacf5\ud55c\ub2e4.<\/li>\n<li><strong>\uc560\ub2c8\uba54\uc774\uc158 &amp; \uc778\ud130\ub799\uc158<\/strong>: \uc0ac\uc6a9\uc790 \ud074\ub9ad, \uc2a4\ud06c\ub864, hover \ud6a8\uacfc \ub4f1 \ub3d9\uc801\uc778 \uc694\uc18c\ub97c \ucd94\uac00\ud55c\ub2e4.<\/li>\n<\/ul>\n<h3 id=\"-2-api-\"><span class=\"ez-toc-section\" id=\"2_API_%EC%97%B0%EB%8F%99_%EB%B0%B1%EC%97%94%EB%93%9C%EC%99%80_%ED%98%91%EC%97%85\"><\/span><strong>(2) API \uc5f0\ub3d9 (\ubc31\uc5d4\ub4dc\uc640 \ud611\uc5c5)<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li><strong>RESTful API \ub610\ub294 GraphQL<\/strong>\uc744 \uc774\uc6a9\ud574 \uc11c\ubc84\uc5d0\uc11c \ub370\uc774\ud130\ub97c \ubc1b\uc544\uc640 \ud654\uba74\uc5d0 \ud45c\uc2dc\ud55c\ub2e4.<\/li>\n<li><strong>JWT \uc778\uc99d<\/strong>, OAuth \ub85c\uadf8\uc778 \uc5f0\ub3d9 \ub4f1 \uc0ac\uc6a9\uc790 \uc778\uc99d \uae30\ub2a5\uc744 \uad6c\ud604\ud55c\ub2e4.<\/li>\n<\/ul>\n<h3 id=\"-3-\"><span class=\"ez-toc-section\" id=\"3_%EC%84%B1%EB%8A%A5_%EC%B5%9C%EC%A0%81%ED%99%94\"><\/span><strong>(3) \uc131\ub2a5 \ucd5c\uc801\ud654<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li><strong>\ub85c\ub529 \uc18d\ub3c4 \uac1c\uc120<\/strong>: \uc774\ubbf8\uc9c0 \ucd5c\uc801\ud654, \ucf54\ub4dc \uc2a4\ud50c\ub9ac\ud305, \uce90\uc2f1 \uc804\ub7b5 \uc801\uc6a9<\/li>\n<li><strong>\ub80c\ub354\ub9c1 \ucd5c\uc801\ud654<\/strong>: Virtual DOM(React), Lazy Loading \uc801\uc6a9<\/li>\n<li><strong>\uc811\uadfc\uc131(A11Y) \uace0\ub824<\/strong>: \uc2a4\ud06c\ub9b0 \ub9ac\ub354 \ud638\ud658, \ud0a4\ubcf4\ub4dc \ub124\ube44\uac8c\uc774\uc158 \uc9c0\uc6d0<\/li>\n<\/ul>\n<h3 id=\"-4-\"><span class=\"ez-toc-section\" id=\"4_%EB%B2%84%EA%B7%B8_%EC%88%98%EC%A0%95_%EC%9C%A0%EC%A7%80%EB%B3%B4%EC%88%98\"><\/span><strong>(4) \ubc84\uadf8 \uc218\uc815 &amp; \uc720\uc9c0\ubcf4\uc218<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li>\ud06c\ub85c\uc2a4 \ube0c\ub77c\uc6b0\uc9d5 \uc774\uc288(IE, Safari, Chrome \ud638\ud658\uc131) \ud574\uacb0<\/li>\n<li>QA \ud300\uc774\ub098 \uc0ac\uc6a9\uc790\ub85c\ubd80\ud130 \ubcf4\uace0\ub41c \ubc84\uadf8\ub97c \uc218\uc815<\/li>\n<\/ul>\n<table>\n<thead>\n<tr>\n<th>\uc8fc\uc694 \uc5c5\ubb34<\/th>\n<th>\uc0ac\uc6a9 \uae30\uc220 \uc608\uc2dc<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td>UI \uac1c\ubc1c<\/td>\n<td>HTML, CSS, JavaScript, React<\/td>\n<\/tr>\n<tr>\n<td>API \uc5f0\ub3d9<\/td>\n<td>Axios, Fetch, GraphQL<\/td>\n<\/tr>\n<tr>\n<td>\uc131\ub2a5 \ucd5c\uc801\ud654<\/td>\n<td>Lighthouse, Webpack<\/td>\n<\/tr>\n<tr>\n<td>\ud14c\uc2a4\ud2b8<\/td>\n<td>Jest, Cypress<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<hr \/>\n<h2 id=\"2-\"><span class=\"ez-toc-section\" id=\"2_%ED%9A%8C%EC%82%AC%EB%A7%88%EB%8B%A4_%EB%8B%A4%EB%A5%B8_%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C_%EA%B0%9C%EB%B0%9C%EC%9E%90%EC%9D%98_%EC%97%AD%ED%95%A0\"><\/span>2. \ud68c\uc0ac\ub9c8\ub2e4 \ub2e4\ub978 \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\uc758 \uc5ed\ud560<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\uc758 \uc5c5\ubb34\ub294 \ud68c\uc0ac\uc758 \uaddc\ubaa8\uc640 \uc0b0\uc5c5\uc5d0 \ub530\ub77c \ub2ec\ub77c\uc9c4\ub2e4.<\/p>\n<h3 id=\"-1-\"><span class=\"ez-toc-section\" id=\"1_%EC%8A%A4%ED%83%80%ED%8A%B8%EC%97%85\"><\/span><strong>(1) \uc2a4\ud0c0\ud2b8\uc5c5<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li><strong>\ud480\uc2a4\ud0dd\uc5d0 \uac00\uae4c\uc6b4 \uc5c5\ubb34<\/strong>: \ud504\ub860\ud2b8\uc5d4\ub4dc + \uac04\ub2e8\ud55c \ubc31\uc5d4\ub4dc(Express, Firebase)<\/li>\n<li><strong>\ube60\ub978 \ud504\ub85c\ud1a0\ud0c0\uc774\ud551<\/strong>: MVP(\ucd5c\uc18c \uae30\ub2a5 \uc81c\ud488)\ub97c \ube60\ub974\uac8c \ucd9c\uc2dc<\/li>\n<li><strong>\ub514\uc790\uc778 \uc2dc\uc2a4\ud15c \uad6c\ucd95<\/strong>: \uc7ac\uc0ac\uc6a9 \uac00\ub2a5\ud55c UI \ucef4\ud3ec\ub10c\ud2b8 \uac1c\ubc1c<\/li>\n<\/ul>\n<h3 id=\"-2-\"><span class=\"ez-toc-section\" id=\"2_%EC%A4%91%EA%B2%AC%C2%B7%EB%8C%80%EA%B8%B0%EC%97%85\"><\/span><strong>(2) \uc911\uacac\u00b7\ub300\uae30\uc5c5<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li><strong>\uc804\ubb38\ud654\ub41c \uc5c5\ubb34<\/strong>: \ud504\ub860\ud2b8\uc5d4\ub4dc\ub9cc \uc9d1\uc911 (\uc131\ub2a5 \ucd5c\uc801\ud654, A\/B \ud14c\uc2a4\ud2b8)<\/li>\n<li><strong>\ub300\uaddc\ubaa8 \ud611\uc5c5<\/strong>: \ubc31\uc5d4\ub4dc, \ub514\uc790\uc778, \uae30\ud68d \ud300\uacfc \uccb4\uacc4\uc801\uc778 \uc18c\ud1b5<\/li>\n<li><strong>\ub808\uac70\uc2dc \ucf54\ub4dc \uad00\ub9ac<\/strong>: \uc624\ub798\ub41c \uc2dc\uc2a4\ud15c\uc758 \ud504\ub860\ud2b8\uc5d4\ub4dc \ud604\ub300\ud654 (\uc608: jQuery \u2192 React \ub9c8\uc774\uadf8\ub808\uc774\uc158)<\/li>\n<\/ul>\n<h3 id=\"-3-\"><span class=\"ez-toc-section\" id=\"3_%EC%99%B8%EA%B5%AD%EA%B3%84%C2%B7%EA%B8%80%EB%A1%9C%EB%B2%8C_%EA%B8%B0%EC%97%85\"><\/span><strong>(3) \uc678\uad6d\uacc4\u00b7\uae00\ub85c\ubc8c \uae30\uc5c5<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li><strong>\ucd5c\uc2e0 \uae30\uc220 \uc2a4\ud0dd<\/strong>: Next.js, TypeScript, WebAssembly \ub4f1<\/li>\n<li><strong>\uad6d\uc81c\ud654(i18n)<\/strong>: \ub2e4\uad6d\uc5b4 \uc9c0\uc6d0 \uc6f9 \uac1c\ubc1c<\/li>\n<\/ul>\n<hr \/>\n<h2 id=\"3-2024-\"><span class=\"ez-toc-section\" id=\"3_%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C_%EA%B0%9C%EB%B0%9C%EC%9E%90%EC%97%90%EA%B2%8C_%ED%95%84%EC%9A%94%ED%95%9C_%EA%B8%B0%EC%88%A0_%EC%8A%A4%ED%83%9D_2024_%EA%B8%B0%EC%A4%80\"><\/span>3. \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\uc5d0\uac8c \ud544\uc694\ud55c \uae30\uc220 \uc2a4\ud0dd (2024 \uae30\uc900)<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\uc694\uc998 \ud68c\uc0ac\uc5d0\uc11c \uc6d0\ud558\ub294 \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\uc758 \uae30\uc220\uc740 \uc810\uc810 \ub2e4\uc591\ud574\uc9c0\uace0 \uc788\ub2e4.<\/p>\n<h3 id=\"-\"><span class=\"ez-toc-section\" id=\"%ED%95%84%EC%88%98_%EA%B8%B0%EC%88%A0\"><\/span><strong>\ud544\uc218 \uae30\uc220<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li><strong>JavaScript (ES6+)<\/strong>: \ucd5c\uc2e0 \ubb38\ubc95(\ud654\uc0b4\ud45c \ud568\uc218, async\/await) \ud544\uc218<\/li>\n<li><strong>React\/Vue\/Angular<\/strong>: \uad6d\ub0b4\uc5d0\uc11c\ub294 React \uc810\uc720\uc728\uc774 \ub192\uc74c (<a href=\"https:\/\/stateofjs.com\/\" target=\"_blank\" rel=\"noopener\">State of JS 2023<\/a> \ucc38\uace0)<\/li>\n<li><strong>CSS-in-JS<\/strong>: Styled-components, Emotion<\/li>\n<li><strong>\uc0c1\ud0dc \uad00\ub9ac<\/strong>: Redux, Zustand, Context API<\/li>\n<\/ul>\n<h3 id=\"-\"><span class=\"ez-toc-section\" id=\"%EC%9A%B0%EB%8C%80_%EA%B8%B0%EC%88%A0\"><\/span><strong>\uc6b0\ub300 \uae30\uc220<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li><strong>TypeScript<\/strong>: \uc815\uc801 \ud0c0\uc785 \uccb4\ud06c\ub85c \ubc84\uadf8 \uc608\ubc29<\/li>\n<li><strong>Next.js\/Nuxt.js<\/strong>: SSR(\uc11c\ubc84 \uc0ac\uc774\ub4dc \ub80c\ub354\ub9c1) \uc9c0\uc6d0<\/li>\n<li><strong>\ud14c\uc2a4\ud305<\/strong>: Jest(\ub2e8\uc704 \ud14c\uc2a4\ud2b8), Cypress(E2E \ud14c\uc2a4\ud2b8)<\/li>\n<li><strong>CI\/CD<\/strong>: GitHub Actions, Docker<\/li>\n<\/ul>\n<blockquote><p>\ud83d\udca1 <strong>Tip<\/strong>: \uc694\uc998\uc740 &#8220;\ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790 = \ucf54\ub529\ub9cc \uc798\ud558\uba74 \ub41c\ub2e4&#8221;\uac00 \uc544\ub2c8\ub2e4. <strong>\ub514\uc790\uc778 \uac10\uac01<\/strong>, <strong>\ubc31\uc5d4\ub4dc \uc774\ud574\ub3c4<\/strong>, <strong>\ubb38\uc81c \ud574\uacb0 \ub2a5\ub825<\/strong>\uae4c\uc9c0 \uc885\ud569\uc801\uc778 \uc5ed\ub7c9\uc774 \ud544\uc694\ud558\ub2e4.<\/p><\/blockquote>\n<hr \/>\n<h2 id=\"4-\"><span class=\"ez-toc-section\" id=\"4_%ED%95%98%EB%A3%A8_%EC%9D%BC%EA%B3%BC%EB%A1%9C_%EB%B3%B4%EB%8A%94_%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C_%EA%B0%9C%EB%B0%9C%EC%9E%90%EC%9D%98_%EC%82%B6\"><\/span>4. \ud558\ub8e8 \uc77c\uacfc\ub85c \ubcf4\ub294 \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\uc758 \uc0b6<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\uc2e4\uc81c\ub85c \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\uc758 \ud558\ub8e8\ub294 \uc5b4\ub5bb\uac8c \ud758\ub7ec\uac08\uae4c?<\/p>\n<ul>\n<li><strong>10:00 AM<\/strong>: \uc2a4\ud06c\ub7fc \ubbf8\ud305 (\uc5b4\uc81c \ud55c \uc77c, \uc624\ub298 \ud560 \uc77c \uacf5\uc720)<\/li>\n<li><strong>11:00 AM<\/strong>: \ub514\uc790\uc778 \ud300\uacfc \ud53c\ub4dc\ubc31 (Figma\uc5d0\uc11c \ubcc0\uacbd\ub41c \ubd80\ubd84 \ud655\uc778)<\/li>\n<li><strong>1:00 PM<\/strong>: \uc810\uc2ec + \ud734\uc2dd<\/li>\n<li><strong>2:00 PM<\/strong>: \uc2e0\uaddc \uae30\ub2a5 \uac1c\ubc1c (React \ucef4\ud3ec\ub10c\ud2b8 \uc791\uc131)<\/li>\n<li><strong>4:00 PM<\/strong>: \ubc31\uc5d4\ub4dc \uac1c\ubc1c\uc790\uc640 API \uba85\uc138 \ub17c\uc758 (Swagger \ud655\uc778)<\/li>\n<li><strong>6:00 PM<\/strong>: \ucf54\ub4dc \ub9ac\ubdf0 (GitHub Pull Request \uac80\ud1a0)<\/li>\n<li><strong>7:00 PM<\/strong>: \ud1f4\uadfc or \uc57c\uadfc (\ubc30\ud3ec\uc77c\uc774\ub77c\uba74&#8230;)<\/li>\n<\/ul>\n<hr \/>\n<h2 id=\"5-\"><span class=\"ez-toc-section\" id=\"5_%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C_%EA%B0%9C%EB%B0%9C%EC%9E%90%EB%A1%9C_%EC%84%B1%EC%9E%A5%ED%95%98%EA%B8%B0_%EC%9C%84%ED%95%9C_%EC%A1%B0%EC%96%B8\"><\/span>5. \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\ub85c \uc131\uc7a5\ud558\uae30 \uc704\ud55c \uc870\uc5b8<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<h3 id=\"-1-\"><span class=\"ez-toc-section\" id=\"1_%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8_%EA%B2%BD%ED%97%98_%EC%8C%93%EA%B8%B0\"><\/span><strong>(1) \ud504\ub85c\uc81d\ud2b8 \uacbd\ud5d8 \uc313\uae30<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li>\ud1a0\uc774 \ud504\ub85c\uc81d\ud2b8\ubcf4\ub2e4 <strong>\uc2e4\ubb34\uc5d0 \uac00\uae4c\uc6b4 \uc6f9 \uc571<\/strong>\uc744 \ub9cc\ub4e4\uc5b4\ubcf4\uc790 (\uc608: \ucee4\uba38\uc2a4 \uc0ac\uc774\ud2b8 \ud074\ub860)<\/li>\n<li><strong>\uc624\ud508\uc18c\uc2a4 \uae30\uc5ec<\/strong>: <a href=\"https:\/\/github.com\/\" target=\"_blank\" rel=\"noopener\">GitHub<\/a>\uc5d0\uc11c \uc778\uae30 \uc788\ub294 \ub77c\uc774\ube0c\ub7ec\ub9ac\uc5d0 PR \ubcf4\ub0b4\uae30<\/li>\n<\/ul>\n<h3 id=\"-2-\"><span class=\"ez-toc-section\" id=\"2_%EB%84%A4%ED%8A%B8%EC%9B%8C%ED%82%B9_%EC%BB%A4%EB%AE%A4%EB%8B%88%ED%8B%B0_%ED%99%9C%EB%8F%99\"><\/span><strong>(2) \ub124\ud2b8\uc6cc\ud0b9 &amp; \ucee4\ubba4\ub2c8\ud2f0 \ud65c\ub3d9<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li><strong>\uac1c\ubc1c \ucee4\ubba4\ub2c8\ud2f0<\/strong> (<a href=\"https:\/\/feconf.kr\/\" target=\"_blank\" rel=\"noopener\">FEConf<\/a>, <a href=\"https:\/\/okky.kr\/\" target=\"_blank\" rel=\"noopener\">OKKY<\/a>)\uc5d0\uc11c \uc815\ubcf4 \uacf5\uc720<\/li>\n<li><strong>\uae30\uc220 \ube14\ub85c\uadf8<\/strong> \uc6b4\uc601 (\uac1c\uc778 \ud559\uc2b5 \ub0b4\uc6a9 \uc815\ub9ac \u2192 \uc774\ub825\uc11c\uc5d0 \uac15\uc810)<\/li>\n<\/ul>\n<h3 id=\"-3-\"><span class=\"ez-toc-section\" id=\"3_%ED%8A%B8%EB%A0%8C%EB%93%9C_%EB%94%B0%EB%9D%BC%EC%9E%A1%EA%B8%B0\"><\/span><strong>(3) \ud2b8\ub80c\ub4dc \ub530\ub77c\uc7a1\uae30<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<ul>\n<li>\ub9e4\ub144 \ubc14\ub00c\ub294 \uc6f9 \uae30\uc220 (<strong>Web3, WASM, PWA<\/strong>) \uad00\uc2ec \uac16\uae30<\/li>\n<li><a href=\"https:\/\/developer.mozilla.org\/\" target=\"_blank\" rel=\"noopener\">MDN Web Docs<\/a>\ub85c \uacf5\uc2dd \ubb38\uc11c \uc77d\ub294 \uc2b5\uad00 \ub4e4\uc774\uae30<\/li>\n<\/ul>\n<hr \/>\n<h2 id=\"-\"><span class=\"ez-toc-section\" id=\"%EB%A7%88%EC%B9%98%EB%A9%B0_%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C_%EA%B0%9C%EB%B0%9C%EC%9E%90%EB%8A%94_%EB%8B%A8%EC%88%9C%ED%95%9C_%EC%BD%94%EB%8D%94%EA%B0%80_%EC%95%84%EB%8B%88%EB%8B%A4\"><\/span>\ub9c8\uce58\uba70: \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\ub294 \ub2e8\uc21c\ud55c \ucf54\ub354\uac00 \uc544\ub2c8\ub2e4<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\ub294 <strong>\uae30\uc220\ub825 + \ucee4\ubba4\ub2c8\ucf00\uc774\uc158 + \ub514\uc790\uc778 \uac10\uac01<\/strong>\uc774 \ubaa8\ub450 \ud544\uc694\ud55c \uc9c1\uc885\uc774\ub2e4. \ucf54\ub4dc\ub9cc \uc798 \uc9e0\ub2e4\uace0 \uc88b\uc740 \uac1c\ubc1c\uc790\uac00 \ub418\ub294 \uc2dc\ub300\ub294 \uc9c0\ub0ac\ub2e4. <strong>\uc0ac\uc6a9\uc790\ub97c \uc0dd\uac01\ud558\ub294 \uac1c\ubc1c\uc790<\/strong>, <strong>\ud611\uc5c5\uc744 \uc798\ud558\ub294 \uac1c\ubc1c\uc790<\/strong>\uac00 \uc9c4\uc9dc \uacbd\uc7c1\ub825\uc744 \uac16\ucd98\ub2e4.<\/p>\n<blockquote><p><strong>&#8220;\uc88b\uc740 \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\ub294 \uc0ac\uc6a9\uc790\uac00 \ubaa8\ub974\uac8c \ud3b8\ub9ac\ud568\uc744 \uc81c\uacf5\ud55c\ub2e4.&#8221;<\/strong><\/p><\/blockquote>\n<p>\uc5ec\ub7ec\ubd84\ub3c4 \uc0ac\uc6a9\uc790 \uc911\uc2ec\uc758 \uac1c\ubc1c\uc790\ub85c \uc131\uc7a5\ud558\uae30 \uc704\ud574 \uc624\ub298\ubd80\ud130 \ud55c \uac78\uc74c \ub0b4\ub51b\uc5b4 \ubcf4\ub294 \uac74 \uc5b4\ub5a8\uae4c?<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\ub294 \uc6f9\uacfc \uc571\uc758 &#8216;\uc5bc\uad74&#8217;\uc744 \ub9cc\ub4dc\ub294 \uc0ac\ub78c\ub4e4\uc774\ub2e4. \uc0ac\uc6a9\uc790\uac00 \uc9c1\uc811 \ubcf4\uace0 \ud074\ub9ad\ud558\ub294 \uc778\ud130\ud398\uc774\uc2a4\ub97c \uad6c\ud604\ud558\uba70, \ub514\uc790\uc778\uacfc \uae30\ub2a5\uc744 \ud604\uc2e4\ub85c \uc62e\uae30\ub294 \uc5ed\ud560\uc744 \ud55c\ub2e4. \uadf8\ub807\ub2e4\uba74 \uc2e4\uc81c\ub85c \ud68c\uc0ac\uc5d0\uc11c \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\ub294 \uc5b4\ub5a4 \uc77c\uc744 \ud560\uae4c? \uc774 \uae00\uc5d0\uc11c\ub294 \ud604\uc5c5\uc5d0\uc11c\uc758 \uc5c5\ubb34 \ub0b4\uc6a9, \ud544\uc694\ud55c \uae30\uc220, \uadf8\ub9ac\uace0 \uc131\uc7a5\ud558\ub294 \uac1c\ubc1c\uc790\uac00 \ub418\uae30 \uc704\ud55c \ud301\uae4c\uc9c0 \uc54c\uc544\ubcf8\ub2e4. 1. \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\uc758 \ud575\uc2ec \uc5c5\ubb34 \ud504\ub860\ud2b8\uc5d4\ub4dc \uac1c\ubc1c\uc790\ub294 \ub2e8\uc21c\ud788 \ucf54\ub4dc\ub97c \uc791\uc131\ud558\ub294 \uac83\uc744 \ub118\uc5b4, \uc0ac\uc6a9\uc790 \uacbd\ud5d8(UX)\uacfc [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":27022,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"default","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[70],"tags":[],"class_list":["post-27021","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog-ko"],"_links":{"self":[{"href":"https:\/\/hitek.com.vn\/ko\/wp-json\/wp\/v2\/posts\/27021","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hitek.com.vn\/ko\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/hitek.com.vn\/ko\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/hitek.com.vn\/ko\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/hitek.com.vn\/ko\/wp-json\/wp\/v2\/comments?post=27021"}],"version-history":[{"count":2,"href":"https:\/\/hitek.com.vn\/ko\/wp-json\/wp\/v2\/posts\/27021\/revisions"}],"predecessor-version":[{"id":27027,"href":"https:\/\/hitek.com.vn\/ko\/wp-json\/wp\/v2\/posts\/27021\/revisions\/27027"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/hitek.com.vn\/ko\/wp-json\/wp\/v2\/media\/27022"}],"wp:attachment":[{"href":"https:\/\/hitek.com.vn\/ko\/wp-json\/wp\/v2\/media?parent=27021"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/hitek.com.vn\/ko\/wp-json\/wp\/v2\/categories?post=27021"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/hitek.com.vn\/ko\/wp-json\/wp\/v2\/tags?post=27021"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}