Àû°íº¸´Ï ³Ê¹« ±â³×¿ä. ¼ºÁú±ÞÇÑ ºÐµéÀ» À§ÇØ ÇÑÁÙ ¿ä¾àÇÏÀÚ¸é "À¥¾îÇà °³¹ß¿¡ °ü½ÉÀÖ´Ù¸é VAADINÀ̶ó´Â ÇÁ·¹ÀÓ¿÷À» »ç¿ëÇغ̼¼¿ä"
ÇöÀç À¥¾îÇà °³¹ßÀº ÀÚ¹Ù°¡ °ÅÀÇ ´ë¼¼ÀΰŠ°°´Ù. Çö½ÃÁ¡¿¡¼ À¥¾îÇà °³¹ß ºÐ¾ß¿¡¼ µ¨ÆÄÀÌ´Â µµÀúÈ÷ ÀÚ¹ÙÀÇ Àû¼ö°¡ µÉ¼ö ¾ø°í ¾ÕÀ¸·Îµµ µ¨ÆÄÀÌ°¡ À¥¿¡¼ ¾î¶² ¸é¸ð¸¦ º¸ÀÏ °¡´É¼ºÀº Àü¹«ÇÑ °Í °°´Ù. ÀÌ´Â ÀÚ¹Ù °³¹ß ȯ°æÀÇ Æ¯¼ö¼º¿¡ ±âÀÎÇϴµ¥, ÀÚ¹Ù °ü·Ã ºÐ¾ß´Â °ÅÀÇ ´ëºÎºÐÀÌ ¿ÀÇ ¼Ò½º, Áï ¹«·á¶ó´Â Á¡ÀÌ´Ù. ÀÚ¹Ù ¾ð¾î ÀÚü, °³¹ß IDEÀÎ ÀÌŬ¸³½º, »ó´ç¼öÀÇ DB, ¾ÆÆÄÄ¡ À¥¼¹ö, ¸®´ª½º ¿À¿¡½º, °Å±â´Ù »ó´ç¼öÀÇ ÀÚ¹Ù À¥ °ü·Ã ¶óÀ̺귯¸®µéÀÌ ´ëºÎºÐ ¿ÀǼҽº´Ù. ºñ¿ëÀ̶ó´Â °æÁ¦ÀûÀÎ Ãø¸é¿¡¼ ÀÚ¹ÙÀÇ ÀÌ ¹«·á Á¤Ã¥Àº ¾öû³ ¸Å·ÂÀÌ ¾Æ´Ò ¼ö ¾ø´Ù. ÀÌ ¶§¹®¿¡ ¸¹Àº ¾÷üµéÀÌ À©µµ¿ì ¾îÇÃÀÌ ¾Æ´Ñ À¥¾îÇ÷Π¹Ù²Ù´Â °ÍÀÎÁöµµ ¸ð¸£°Ú´Ù.
±×·±µ¥ ³» »ý°¢¿¡´Â À©µµ¿ì ¾îÇðú À¥¾îÇÃÀº ±× ¼º°Ý»ó º°°³ÀÇ ¿ëµµ°¡ ÀÖ´Ù°í º¸´Âµ¥, ¿äÁò º¸¸é Áö³ªÄ¥ Á¤µµ·Î À¥¾îÇÿ¡ ¸ÅÁøÇÏ´Â ±¹³» °³¹ß ȯ°æÀº ³ª°°Àº À©µµ¿ì °³¹ßÀڵ鿡°Õ ¸Å¿ì ¾¹¾µÇÑ Çö»óÀÌ ¾Æ´Ò ¼ö ¾ø´Ù. µ¨ÆÄÀ̸¦ ÁÖÁ¾À¸·Î »ç¿ëÇÏ´Â À©µµ¿ì °³¹ßÀڷμ, À¥¾îÇà °³¹ß ¿äûÀÌ µé¾î¿À¸é ³ª´Â Âü ´çȲ½º·¯¿ï ¼ö ¹Û¿¡ ¾ø´Ù. ¿¹Àü¿¡ µ¨ÆÄÀÌ·Î CGI ¹æ½ÄÀ¸·Î À¥ ÇÁ·Î±×·¥À» ¸¸µé¾î º» ÀûÀÌ Àֱ⠶§¹®¿¡, À¥¾îÇÃÀ» ¸¸µé·Á¸é ¾ó¸¶³ª ¸¹Àº ³ë°¡´Ù ÄÚµùÀ» ÇØ¾ß ÇÏ´ÂÁö Àß ¾Ë°í Àֱ⠶§¹®ÀÌ´Ù. ÀÚ¹Ù¸¦ ¾²´ø, µ¨ÆÄÀ̸¦ ¾²´ø°£¿¡ À¥¼¹öÃøÀÇ ÄÚµùÀº º°·Î °ñ¸Ó¸® ¾ÆÇÁÁö ¾Ê´Ù. ¹°·Ð ¼¼¼ÇÀ̶ó´ø°¡ º¸¾È°°Àº ¾à°£ÀÇ À庮ÀÌ ÀÖ±ä ÇÏÁö¸¸...
À¥¾îÇà °³¹ßÀÇ ÃÖ´ë ³°üÀº HTML°ú ÀÚ¹Ù½ºÅ©¸³Æ®¶ó´Â °Å´ëÇÑ ³ë°¡´Ù »ðÁú À庮ÀÌ´Ù. HTML ÀÚü°¡ ÇÁ·Î±×·¥ Ä£ÈÀûÀÎ ¾ð¾îµµ ¾Æ´Ò »Ó´õ·¯, µ¨ÆÄÀÌ°°Àº ÄÄÆÄÀÏ·¯ ¾ð¾î¸¸ »ç¿ëÇغ» °³¹ßÀÚ¶ó¸é ÀÚ¹Ù½ºÅ©¸³Æ®ÀÇ ±âÀÌÇÒ Á¤µµ·Î Ȳ´çÇÑ ¹®¹ý(?)¿¡ ³î¶ó¿òÀ» ±ÝÄ¡ ¸øÇÒ °ÍÀÌ´Ù. ±×·±µ¥ À¥¿¡¼´Â ÀÌ ÀÚ¹Ù½ºÅ©¸³Æ®¸¦ µµÀúÈ÷ ¾È¾µ ¼ö°¡ ¾ø´Ù. ¾Æ¸¶ À¥¾îÇÿ¡¼ °¡Àå ¸¹ÀÌ »ç¿ëµÇ´Â ÀÚ¹Ù½ºÅ©¸³Æ® ¶óÀ̺귯¸®°¡ JQuery°¡ ¾Æ´Ñ°¡ ½Í´Ù. ÀÌ JQuery´Â AJAX È£ÃâÀ» ºñ±³Àû ½±°Ô ÇØÁִµ¥, Çö´ë À¥¾îÇÿ¡¼ ¾ÆÀÛ½º È£ÃâÀº ÇʼöºÒ°¡°áÇϱ⠶§¹®ÀÌ´Ù. µ¨ÆÄÀÌ °³¹ßÀÚ¶ó¸é ȸéÀ» 4µîºÐÇÏ¿© ¹öÆ°À» Ŭ¸¯Çϸé, ƯÁ¤ ºÎºÐ¸¸ ´Ù¸¥ ³»¿ëÀ¸·Î °»½ÅÇÏ´Â ±â´ÉÀ» ±¸ÇöÇÏ°íÀÚ ÇÒ ¶§, °áÄÚ ¸Ó¸®¸¦ ½Î¸È ÇÊ¿ä°¡ ¾øÀ» °ÍÀÌ´Ù. ±×Á¤µµ ±â´É ±¸ÇöÀº ²°ªÀÌÁö ¾Ê´Â°¡?
±×·¯³ª, À¥¿¡¼ ÀÌ·± ȸé ÀϺΠ°»½ÅÀº, Ç÷¡½Ã, ¾×ƼºÎ¿¢¼ö°°Àº Æí¹ýÀ» »ç¿ëÇÏÁö ¾Ê´Â ÇÑ, ¿øÄ¢ÀûÀ¸·Î´Â ºÒ°¡´ÉÇÏ´Ù. À¥¿¡¼ ÀÌ ÀÏºÎ È¸é °»½ÅÀ» °¡´ÉÇÏ°Ô ÇÏ´Â À¯ÀÏÇÑ ¹æ¹ýÀÌ AJAX È£ÃâÀ̱⠶§¹®¿¡ À̸¦ »ç¿ëÇÏÁö ¾ÊÀ» ¼ö°¡ ¾ø´Ù. ÇÏ¿©Æ° »ç¿ëÀÚ UI È¸é ¹èÄ¡¸¦ À§Çؼ div ű׳ª table ű׸¦ Áßø(nested) µµ¹èÇÏ°í, Áß°£¿¡ ¾ÆÀÛ½º È£ÃâÀ» À§Çؼ ÀÚ¹Ù½ºÅ©¸³Æ® Äڵ带 »ðÀÔÇÏ´Ùº¸¸é, JSP¸¦ ¾²´ø, PHP¸¦ ¾²´ø, ÇöÁ¸ÇÏ´Â ¾î¶² À¥½ºÅ©¸³Æ® ÅøÀ» ¾´µé, ¾öû³ ¾çÀÇ HTML ÄÚµå¿Í ÀÚ¹Ù½ºÅ©¸³Æ® Äڵ带 ÀÛ¼ºÇØ¾ß ÇÑ´Ù. À¥À¸·Î °Ô½ÃÆÇÀ» ¸¸µé¾îº» °³¹ßÀÚ¶ó¸é °Ô½Ã¹° ÀÔ·Â/¼öÁ¤ Æû ÀÛ¼ºÀÌ µ¨ÆÄÀÌ Æû¿¡ ºñÇÏ¸é ¾ó¸¶³ª ³ë°¡´Ù½º·¯¿îÁö Àß ¾Ë °ÍÀÌ´Ù.
À¥°³¹ß ¿ª»ç´Â »ó´çÈ÷ ¿À·¡µÇ¾ú¿¡µµ ºÒ±¸ÇÏ°í, ¿Ö ¾ÆÁ÷µµ ÀÌ·± ³ë°¡´Ù ÄÚµùÀ» Çؾ߸¸ À¥¾îÇÃÀ» ¸¸µé ¼ö ÀÖ´ÂÁö Âü ÀÌÇØ°¡ µÇÁö ¾Ê´Â´Ù. ´å³Ý ASP°¡ óÀ½ ³ª¿ÔÀ» ¶§, ³ª´Â ¾Èµ¨½º ÇìÀÌÁñ¹ö±×°¡ ¾öû³ õÀ缺À» ¹ßÈÖÇÏ¿© ½Ã¼¥ ÄÚµå·Î¸¸ ÀÛ¼ºÇÏ´Â À¥°³¹ßÅøÀ» ¸¸µé¾îÁÙÁÙ ¾Ë¾ÒÀ¸³ª, ¸·»ó º¸´Ï, °ú°Å ASP ½ºÅ©¸³Æ® ¿£Áøº¸´Ù Á»´õ Áøº¸¸¸ µÇ¾úÀ» »Ó ¿©ÀüÈ÷ HTML ºñ½ÁÇÑ Å±׸¦ ÀÏÀÏÈ÷ ÄÚµå·Î ÀÛ¼ºÇØ¾ß ÇÏ´Â °ÍÀº ¾î¿¼ö ¾ø¾ú´ø ¸ð¾çÀÌ´Ù. ´å³Ý ASP´Â ±×·¡µµ <input> <select>µîÀ» »ó´çºÎºÐ ÄÞÆ÷³ÍÆ®ÈÇؼ ³ë°¡´Ù¸¦ Á¶±Ý ÁÙ¿©ÁÖ±ä ÇßÁö¸¸, ¿©ÀüÈ÷ ½Ã¼¥ Äڵ常À¸·Î À¥¾îÇà °³¹ßÀº ºÒ°¡´ÉÇß´Ù. ¾Æ¸¶ Áö±Ý ¹öÀüÀÇ ´å³Ýµµ ¸¶Âù°¡ÁöÀΰŠ°°´Ù.
±¸±Û °³¹ßÀÚµé Áß¿¡ ³ª°°Àº »ý°¢À» °¡Áø »ç¶÷µéÀÌ GWT¶ó´Â °É ¸¸µé¾ú´Ù°í ÇÑ´Ù. ¸Å¹ø ³ÀâÇÑ HTML ÄÚµå¿Í ÀÚ¹Ù½ºÅ©¸³Æ® Äڵ带 ÀÛ¼ºÇϱ⠽Ⱦî¼, ÀÚ¹Ù·Î ÄÚµùÇϸé À̸¦ ÀÚ¹Ù½ºÅ©¸³Æ®¿Í HTML ÄÚµå·Î º¯È¯ÇÏ´Â ¿£ÁøÀÌ GTW¶ó°í ÇÑ´Ù. ÀÌ GWT¸¦ ÀÌ¿ëÇÏ¿© Á»´õ Àڹ٠ģÈÀûÀÎ À¥ÇÁ·¹ÀÓ¿÷À¸·Î ¹ßÀü½ÃŲ °ÍÀÌ VAADIN À̶ó°í ÇÑ´Ù. GWT¸¦ ÀÌ¿ëÇÏ´Â ÀÚ¹Ù À¥ ÇÁ·¹ÀÓ¿÷Àº ¸î°³ ´õ ÀÖÁö¸¸, ±¸±Û¸µÀ» Çغ¸´Ï °¡Àå ±¦ÂúÀº ³ðÀÌ ÀÌ VAADIN°°´Ù.
À̳ðÀ» ÀÌ¿ëÇÏ¿© °£´ÜÇÑ À¥ °Ô½ÃÆÇÀ» ¸¸µé¾î ºÃ´Ù. ±×·¨´õ´Ï 600 ¶óÀÎ Á¤µµÀÇ ¼ø¼ö ÀÚ¹ÙÄÚµå·Î, ½ÉÁö¾î SQL ¹® ÇѶóÀÎÁ¶Â÷ ¾øÀÌ, À¥°Ô½ÃÆÇÀ» ¸¸µé¾ú´Ù. ¹°·Ð ´ë´ÜÇÑ ±â´ÉÀÇ À¥°Ô½ÃÆÇÀ» ¸¸µéÀÚ¸é ÈξÀ´õ ¸¹Àº Äڵ差ÀÌ ÇÊ¿äÇÏ°ÚÁö¸¸, À¥°Ô½ÃÆÇÀ» ¸¸µé¶§ °¡Àå Áß¿äÇÑ ±â´ÉÀÌ, ·Î±×ÀÎÇߴ°¡ ¾ÈÇߴ°¡¿¡ µû¶ó¼ °Ô½Ã¹°¿¡ ´ëÇÑ Àбâ, »õ·ÎÀÛ¼º, »èÁ¦ µîÀÇ ±ÇÇÑÀ» ºÎ¿©ÇÏ´Â °ÍÀÌ´Ù(´Þ¸® ¸»ÇÏÀÚ¸é ÀÌ·± ±â´ÉÀ» ½ÇÇàÇÏ´Â ¹öÆ°µéÀÇ Á×ÀÌ°í »ì¸®±â¸¦ Á¹¶ó º¹ÀâÇÏ°Ô Ã³¸®ÇؾßÇÑ´Ù´Â °Í). ÀÌ·± ±â´ÉÀ» µ¨ÆÄÀÌ·Î ÇÑ´Ù¸é ¸Å¿ì °£´ÜÇÏÁö¸¸, À¥¿¡¼´Â ¾ÆÀÛ½º¸¦ ¾²°Å³ª ¾Æ´Ï¸é jsp¾È¿¡ if ű׸¦ µµ¹èÇϰųª, ¾Æ´Ï¸é jsp¿¡ ÀÚ¹ÙÄڵ带 »ðÀÔÇϰųª µîÀÇ ¹æ¹ýÀ» »ç¿ëÇØ¾ß Çϴµ¥, ¾î·µç°£¿¡ ÀÌ¹Ì ¾öû³ ¾çÀÇ HTML ÄÚµå·Î ÃæºÐÈ÷ º¹ÀâÇÑ, JSP³ª PHP¾È¿¡ ÂüÀ¸·Î ³ÊÀúºÐÇÑ Äڵ带 ¶Ç »ðÀÔÇØ¾ß ÇÑ´Ù.
¹ÙµòÀ¸·Î À¥°Ô½ÃÆÇÀ» ¸¸µé¾îº¸´Ï, ¹ÙµòÀº ÀÌ ±â´É ±¸Çö°ú È¸é ±¸¼º±îÁö ¿À·ÎÁö ¼ø¼ö ÀÚ¹ÙÄÚµå·Î¸¸, ´Ü ÇÑÁÙÀÇ HTML ÄÚµå, ´Ü ÇÑÁÙÀÇ ÀÚ¹ÙÅ©¸³Æ® ÄÚµå ¾øÀÌ °¡´ÉÇß´Ù. °á·ÐÀÎÁï ¹ÙµòÀº ÀÚ¹ÙÀ¥¾îÇà ºÐ¾ß¿¡¼ °ÅÀÇ µ¨ÆÄÀÌ°°Àº Á¸Àç¶õ °ÍÀÌ´Ù. À©µµ ½Ã´ë°¡ óÀ½ µµ·¡ÇßÀ» ‹š ºñÁÖ¾ó ¾¾·Î ¸¸µç Hello world »ùÇà Äڵ带 º¸°í "Çæ! ¾ÕÀ¸·Î À©µµ ÇÁ·Î±×·¥ ¸¸µé·Á¸é Àú·¸°Ô ³ë°¡´Ù½º·± ÄÚµùÀ» ÇØ¾ß Çϴ°¡?" °í¹Î½º·¯¿ü´Âµ¥, µ¨ÆÄÀ̶ó´Â ÅøÀ» ¸¸³ª°í º¸´Ï ±× °í¹ÎÀÌ ¸ðµÎ »ç¶óÁ³´ø, ±×·± ´À³¦À» ¹ÙµòÀ» »ç¿ëÇغ¸¸é¼ ´À²¼´Ù.
¹ÙµòÀ¸·Î À¥¾îÇÃÀ» ¸¸µé¸é °ÅÀÇ 90ÇÁ·Î ÀÌ»óÀ» ÀÚ¹ÙÄÚµå·Î¸¸ ÀÛ¼ºÇÑ´Ù. °£È¤ 10ÇÁ·Î Á¤µµ´Â ¿©ÀüÈ÷ HTML°ú ÀÚ¹Ù½ºÅ©¸³Æ®¸¦ »ç¿ëÇØ¾ß ÇÑ´Ù. ¿Ö³ÄÇϸé ÀÌ µÑÀº À¥ÀÇ ±Ù°£À̱⠶§¹®ÀÌ´Ù. ±×·¯³ª °Ô½ÃÆÇ, ÆǸŠÀç°í µîÀÇ ¾÷¹«¿ë À¥¾îÇÃÀ» ¸¸µç´Ù¸é HTML°ú ÀÚ¹Ù½ºÅ©¸³Æ®¸¦ ÀüÇô »ç¿ëÇÒ ÇÊ¿ä°¡ ¾ø´Ù. HTML°ú ÀÚ¹Ù½ºÅ©¸³Æ®¸¦ »ç¿ëÇØ¾ß ÇÏ´Â °æ¿ì´Â, ¹Ùµò¿¡¼ Á¦°øÇÏÁö ¾Ê´Â ´Ù¸¥ ±â´ÉÀ» ±¸ÇöÇϱâ À§Çؼ, ÀÚ¹Ù½ºÅ©¸³Æ®·Î ¸¸µç ±â¶ËÂù ¶óÀ̺귯¸®¸¦ °¡Á®¿Í¼ »ç¿ëÇؾßÇÒ ¶§´Ù. ¿¹¸¦ µé¸é ³×À̹ö ¸Ê API °°Àº °ÍÀÌ´Ù. À̸»ÀÎÁï ¹ÙµòÀº ±Ùº»ÀûÀ¸·Î »ó´çÈ÷ ÀÚ¹Ù½ºÅ©¸³Æ® Ä£ÈÀûÀÌÁö¸¸, ±× ³ë°¡´Ù½º·¯¿òÀ» °³¹ßÀÚ¿¡°Ô Àü°¡ÇÏÁö ¾Ê´Â´Ù´Â °ÍÀÌ´Ù.
¸¸ÀÏ ±ÍÇÏ°¡ À¥¾îÇÃÀ» ¸¸µé°í ½ÍÀºµ¥ ¾î¶² ´ë¾ÈÀ» ã°í ÀÖ´Ù¸é ¹ÙµòÀ» »ç¿ëÇØ º¸½Ã¶ó. Á¹¶ó ³ÀâÇÑ ½ºÇÁ¸µ MVCº¸´Ù´Â ÈξÀ ÆíÇÏ´Ù. ½ºÇÁ¸µ mvc·Î À¥¾îÇÃÀ» ¸¸µé·Á¸é ´ë·« ´ÙÀ½°ú °°Àº Áö½ÄÀÌ ÇÊ¿äÇÏ´Ù. ÀÚ¹Ù ±âº» ¹®¹ý + ½ºÇÁ¸µ MVC ÀÌÇØ, html, ÀÚ¹Ù½ºÅ©¸³Æ®(±âº»Àû ÀÚ¹Ù½ºÅ©¸³Æ® ¾ð¾î ÀÌÇØ¿Í ´õºÒ¾î JQuery, Angular.js »ç¿ë¹ý), sitemesh ȤÀº ¾ÆÆÄÄ¡ ŸÀÏ°°Àº ÅÛÇø®Æ® ¿£Áø »ç¿ë¹ý, CSS¹®¹ý, JSPÅÂ±× »ç¿ë¹ý µîµî.
¹ÙµòÀº À§¿Í °°Àº ³»¿ëÀ» ÀüÇô ¸ô¶óµµ À¥¾îÇÃÀ» ¸¸µé ¼ö ÀÖ´Ù. ¹°·Ð ¿µ¿øÈ÷ ÀÚ¹Ù½ºÅ©¸³Æ®¿Í HTMLÀ» ¿Ü¸éÇÒ ¼ö´Â ¾øÁö¸¸, ÀÌ µÎ Á¸ÀçÀÇ ³ë°¡´Ù½º·¯¿òÀº È®½ÇÈ÷ ¾öû³ª°Ô ÁÙ¿©ÁØ´Ù. ¾ÈŸ±õÁö¸¸ ¹ÙµòÀ» ¾µ·Á¸é ÀÚ¹Ù ¹®¹ýÀº ¾Ë¾Æ¾ß ÇÑ´Ù. µ¨ÆÄÀÌ·Î ¹Ùµò À¥¾îÇà ÀÛ¼ºÀº ºÒ°¡´ÉÇÏ´Ù°í ¹Ùµò ¸Å´º¾ó¿¡ ¸í½ÃµÇ¾î Àֱ⠶§¹®ÀÌ´Ù.
Âü°í·Î ÷ºÎÆÄÀÏÀº ³»°¡ ¹ø¿ªÇغ» ¹Ùµò Æ©Å丮¾óÀÌ´Ù. °ü½ÉÀÖÀ¸½Å ºÐÀº Çѹø Àо½Ã¶ó.
|