¡Ú ÀÌ Ã¥¿¡¼ ´Ù·ç´Â ³»¿ë ¡Ú
¸ð¹ÙÀÏ ÇÏÀ̺긮µå ¾ÆÅ°ÅØÃ³¿¡ ´ëÇÑ ÀÌÇØ
Ionic ÅÛÇø´À» Ȱ¿ëÇÑ ÇÁ·ÎÁ§Æ® ¼³Ä¡¿Í ÀÛ¾÷ ¹æ¹ý
Ionic ÄÄÆ÷³ÍÆ®, µ¥ÄÚ·¹ÀÌÅÍ, ¼ºñ½º¸¦ ¿¬µ¿ÇØ º¹ÀâÇÑ ¾ÖÇø®ÄÉÀ̼ÇÀ» ºü¸£°Ô °³¹ßÇÏ´Â ¹æ¹ý
SCSS¸¦ Ȱ¿ëÇÑ Ionic ¾Û°ú ÄÄÆ÷³ÍÆ®¿¡ Å׸¶¸¦ ¼³Á¤ÇÏ´Â ¹æ¹ý
Ä«¸Þ¶ó, ¾Ë¸², ¹èÅ͸® µî°ú °°Àº ÀåÄ¡ ±â´ÉÀ» »ç¿ëÇϱâ À§ÇÑ Ionic Native Ȱ¿ë ¹æ¹ý
Ionic ¹× Uber API¸¦ Ȱ¿ëÇÑ ÇÁ·Î´ö¼Ç ·¹º§ÀÇ Uber ž½Â ¿¹¾à ¾Û Á¦ÀÛ
Ionic 1 ¾ÛÀ» Ionic 2 ¶Ç´Â Ioni...
´õº¸±â
¡Ú ÀÌ Ã¥¿¡¼ ´Ù·ç´Â ³»¿ë ¡Ú
¸ð¹ÙÀÏ ÇÏÀ̺긮µå ¾ÆÅ°ÅØÃ³¿¡ ´ëÇÑ ÀÌÇØ
Ionic ÅÛÇø´À» Ȱ¿ëÇÑ ÇÁ·ÎÁ§Æ® ¼³Ä¡¿Í ÀÛ¾÷ ¹æ¹ý
Ionic ÄÄÆ÷³ÍÆ®, µ¥ÄÚ·¹ÀÌÅÍ, ¼ºñ½º¸¦ ¿¬µ¿ÇØ º¹ÀâÇÑ ¾ÖÇø®ÄÉÀ̼ÇÀ» ºü¸£°Ô °³¹ßÇÏ´Â ¹æ¹ý
SCSS¸¦ Ȱ¿ëÇÑ Ionic ¾Û°ú ÄÄÆ÷³ÍÆ®¿¡ Å׸¶¸¦ ¼³Á¤ÇÏ´Â ¹æ¹ý
Ä«¸Þ¶ó, ¾Ë¸², ¹èÅ͸® µî°ú °°Àº ÀåÄ¡ ±â´ÉÀ» »ç¿ëÇϱâ À§ÇÑ Ionic Native Ȱ¿ë ¹æ¹ý
Ionic ¹× Uber API¸¦ Ȱ¿ëÇÑ ÇÁ·Î´ö¼Ç ·¹º§ÀÇ Uber ž½Â ¿¹¾à ¾Û Á¦ÀÛ
Ionic 1 ¾ÛÀ» Ionic 2 ¶Ç´Â Ionic 3·Î ¸¶À̱׷¹À̼ÇÇÏ´Â ¹æ¹ý
Á¦ÀÛÇÑ ¾Û¿¡ À¯´Ö Å×½ºÆ®, ¿£µå-Åõ-¿£µå Å×½ºÆ®, ÀåÄ¡ Å×½ºÆ®ÇÏ´Â ¹æ¹ý
ÈÄ¼Ó ¹öÀüÀ» ÀúÀå, °ü¸®ÇÒ ¼ö ÀÖ´Â Ionic ¾Û ¹èÆ÷ ¹æ¹ý
¡Ú ÀÌ Ã¥ÀÇ ´ë»ó µ¶ÀÚ ¡Ú
IonicÀ» ÀÌ¿ëÇØ ¸ð¹ÙÀÏ ÇÏÀ̺긮µå ¾ÖÇø®ÄÉÀÌ¼Ç Á¦ÀÛ ¹æ¹ýÀ» ¹è¿ì·Á´Â »ç¶÷À» ´ë»óÀ¸·Î ÇÑ´Ù. ¶ÇÇÑ Ionic ¾ÛÀ» Á¦ÀÛÇϰųª REST API¿Í ÅëÇÕÇϰí, Ionic Native¸¦ »ç¿ëÇØ Ä«¸Þ¶ó, ºí·çÅõ½º¿Í °°Àº ÀåÄ¡ ±â´ÉÀ» Á» ´õ ÀÚ¼¼È÷ ¹è¿ì·Á´Â µ¶ÀÚ¿¡°Ô ÀÌ»óÀûÀÌ´Ù.
¡Ú ÀÌ Ã¥ÀÇ ±¸¼º ¡Ú
1Àå, ¡®Angular?ÀÔ¹®¡¯¿¡¼´Â ¿ÏÀüÈ÷ »õ·Î¿öÁø AngluarÀÇ ÈûÀ» ¼Ò°³ÇÑ´Ù. Angular¸¦ ÀÌÇØÇϱâ À§ÇØ TypeScriptÀÇ ±âÃÊ¿Í °³³äÀ» ´Ù·é´Ù. Angular ¸ðµâ, ÄÄÆ÷³ÍÆ®, ¼ºñ½º¿¡ ´ëÇØ »ìÆìº¸°í Angluar¸¦ ÀÌ¿ëÇÑ ¾Û Á¦ÀÛÀ¸·Î ¸¶¹«¸®ÇÑ´Ù.
2Àå, ¡®Ionic¿¡ ¿À½Å °ÍÀ» ȯ¿µÇÕ´Ï´Ù¡¯¿¡¼´Â Cordova¶ó´Â ¸ð¹ÙÀÏ ÇÏÀ̺긮µå ÇÁ·¹ÀÓ¿öÅ©¿¡ ´ëÇØ ¼³¸íÇÑ´Ù. À̸¦ ¹ÙÅÁÀ¸·Î ÀüüÀûÀ¸·Î IonicÀÌ ¾î¶»°Ô ¸ð¹ÙÀÏ ÇÏÀ̺긮µå ¾ÖÇø®ÄÉÀÌ¼Ç °³¹ß¿¡ ÀûÇÕÇÑÁö º¸¿©ÁØ´Ù. IonicÀ» »ç¿ëÇØ ¾ÖÇø®ÄÉÀ̼ÇÀ» °³¹ßÇÏ´Â µ¥ ÇÊ¿äÇÑ ¼ÒÇÁÆ®¿þ¾îµµ »ìÆìº»´Ù.
3Àå, ¡®Ionic ÄÄÆ÷³ÍÆ®¿Í ³»ºñ°ÔÀ̼ǡ¯¿¡¼´Â Header¿¡¼ºÎÅÍ Navbar±îÁö IonicÀÇ ´Ù¾çÇÑ ÄÄÆ÷³ÍÆ®¸¦ ¾È³»ÇÑ´Ù. ¶ÇÇÑ Ionic ÇÁ·¹ÀÓ¿öÅ©¸¦ Ȱ¿ëÇØ ¿©·¯ ÆäÀÌÁö¸¦ Ž»öÇÏ´Â ¹æ¹ýÀ» ¾Ë¾Æº»´Ù.
4Àå, ¡®Ionic µ¥ÄÚ·¹ÀÌÅÍ¿Í ¼ºñ½º¡¯¿¡¼´Â ´Ù¾çÇÑ ES6 Ŭ·¡½º¸¦ ÃʱâÈÇÏ´Â µ¥ »ç¿ëÇÏ´Â µ¥ÄÚ·¹ÀÌÅÍ(decorator)¿¡ ´ëÇØ ¾Ë¾Æº»´Ù. Ç÷§Æû ¼ºñ½º¿Í Config ¼ºñ½º, IonicÀ» Á» ´õ ±íÀÌ ÀÌÇØÇϱâ À§ÇØ ¿©·¯ °¡Áö ÄÄÆ÷³ÍÆ®µµ »ìÆìº»´Ù.
5Àå, ¡®Ionic°ú SCSS¡¯¿¡¼´Â ³»ÀåµÈ SCSS ±â´ÉÀ» Ȱ¿ëÇØ Ionic ¾ÛÀÇ Å׸¶¸¦ ¼³Á¤ÇÏ´Â ¹æ¹ýÀ» ´Ù·é´Ù.
6Àå, ¡®Ionic Native¡¯¿¡¼´Â Ionic Native¸¦ Ȱ¿ëÇØ Ä«¸Þ¶ó, ¹èÅ͸® µî°ú °°Àº ÀåÄ¡ ±â´É°ú Ionic ¾ÛÀ» ¿¬°áÇÏ´Â ¹æ¹ýÀ» º¸¿©ÁØ´Ù.
7Àå, ¡®Riderr ¾Û Á¦ÀÛÇϱ⡯¿¡¼´Â Áö±Ý±îÁö ¾òÀº Áö½ÄÀ» Ȱ¿ëÇØ Device API ¹× REST API¿Í Åë½ÅÇÏ´Â ¿£µå Åõ ¿£µå ¾ÖÇø®ÄÉÀÌ¼Ç ±¸¼º ¹æ¹ýÀ» ´Ù·é´Ù. Ã¥¿¡¼ ¸¸µé ¾ÛÀº Uber APIÀÇ ÇÁ·ÐÆ®¿£µå ¾ÛÀÌ µÉ °ÍÀÌ¸ç »ç¿ëÀÚ´Â ÀÌ ¾ÛÀ» »ç¿ëÇØ Uber ride¸¦ ¿¹¾àÇÒ ¼ö ÀÖ´Ù.
8Àå, ¡®Ionic 2 ¸¶À̱׷¹ÀÌ¼Ç °¡À̵塯 ¿¡¼´Â Ionic ÇÁ·¹ÀÓ¿öÅ© v1¿¡¼ Á¦ÀÛÇÑ Ionic ¾ÛÀ» Ionic 2·Î ¸¶À̱׷¹À̼ÇÇÏ´Â ¹æ¹ýÀ» ¾Ë¾Æº¸°í µ¿ÀÏÇÑ ¹æ½ÄÀ» Àû¿ëÇØ Ionic 3·Î ¸¶À̱׷¹À̼ÇÇÏ´Â µ¥ ÁßÁ¡À» µÐ´Ù.
9Àå, ¡®Ionic 2 ¾Û Å×½ºÆ®Çϱ⡯ ¿¡¼´Â Ionic ¾ÛÀ» Å×½ºÆ®ÇÏ´Â ´Ù¾çÇÑ ¹æ¹ýÀ» »ìÆìº»´Ù. À¯´Ö Å×½ºÆÃ, ¿£µåÅõ¿£µå Å×½ºÆ®, ¸ùŰ Å×½ºÆ®, AWS Device FarmÀ» Ȱ¿ëÇÑ ÀåÄ¡ Å×½ºÆ®¸¦ Á¦°øÇÑ´Ù.
10Àå, ¡®Ionic ¾Û ¹èÆ÷Çϱ⡯¿¡¼´Â Ionic CLI¿Í PhoneGap Build¸¦ »ç¿ëÇØ Cordova ¹× IonicÀ¸·Î Á¦ÀÛÇÑ ¾ÖÇø®ÄÉÀ̼ÇÀÇ ¼³Ä¡ ÇÁ·Î±×·¥ »ý¼º¿¡ ÁßÁ¡À» µÐ´Ù.
11 Àå, ¡®Ionic 3¡¯¿¡¼´Â Angular 4¿Í Ionic 3 ¾÷±×·¹À̵忡 ´ëÇÑ ³»¿ëÀ» ´Ù·é´Ù. Ionic 3ÀÇ ¸î °¡Áö »õ·Î¿î ±â´ÉÀ» ¾È³»ÇÑ´Ù.
¡Ú ¿Å±äÀÌÀÇ ¸» ¡Ú
ÀÌ Ã¥Àº IonicÀ» Ȱ¿ëÇØ À¥ ±â¹Ý ±â¼úÀ» Ȱ¿ëÇÑ ÇÏÀ̺긮µå ¾Û °³¹ßÀ» ½ÃÀÛÇÏ·Á´Â °³¹ßÀÚ¿¡°Ô µµ¿òÀÌ µÇ´Â ³»¿ëÀ» ´ã°í ÀÖ´Ù. IonicÀÇ ±â¹ÝÀÌ µÇ´Â Angular¿¡ ´ëÇÑ ±âº» ³»¿ë°ú °³¹ß ȯ°æÀ» ¼³Á¤ÇÏ´Â °úÁ¤ºÎÅÍ ½ÃÀÛÇϱ⠶§¹®¿¡ IonicÀ» óÀ½ Á¢ÇÏ´Â °³¹ßÀÚµµ Ȱ¿ëÇÒ ¼ö ÀÖ´Ù.
1Àå¿¡¼´Â IonicÀÇ ±â¹Ý ±â¼úÀÎ AngularÀÇ ±âº»À» ÇнÀÇÏ¸é¼ À̾îÁö´Â ³»¿ë¿¡ ´ëºñÇÒ ¼ö ÀÖµµ·Ï ÇÑ´Ù. 2Àå¿¡¼´Â Ionic ¾Û °³¹ß¿¡ ÇÊ¿äÇÑ °³¹ß ȯ°æ ¼³Á¤À» ÁøÇàÇÏ¸é¼ ÇÏÀ̺긮µå ¾Û °³¹ß¿¡ ÇÊ¿äÇÑ »çÇ×À» ÁغñÇÑ´Ù. óÀ½ µÎ ÀåÀº ±âº»ÀûÀÎ ³»¿ëÀ» ´Ù·çÁö¸¸ ¸Å¿ì Áß¿äÇÑ ´Ü°è´Ù. 3ÀåºÎÅÍ 6Àå±îÁö´Â IonicÀ» Ȱ¿ëÇØ ÇÏÀ̺긮µå ¾Û °³¹ßÀ» ÇÏ´Â µ¥ »ç¿ëµÇ´Â ÄÄÆ÷³ÍÆ®, ³»ºñ°ÔÀ̼Ç, µ¥ÄÚ·¹ÀÌÅÍ¿Í ¼ºñ½º, SCSS, Ionic Native µî¿¡ ´ëÇØ ÇнÀÇÑ´Ù. À̾îÁö´Â 7Àå¿¡¼´Â 3Àå¿¡¼ 6Àå±îÁö ¹è¿î ³»¿ë°ú UberAPI, Google MapAPI¸¦ Ȱ¿ëÇÑ ¶óÀÌ´õ ¾Û(¿ì¹ö ¿¹¾à ¾Û)À» Á¦ÀÛÇÏ´Â °úÁ¤À» ÁøÇàÇÑ´Ù. À̸¦ ¹ÙÅÁÀ¸·Î Ã¥¿¡¼ ÇнÀÇÑ ³»¿ëÀ» ¾Û °³¹ß¿¡ Àû¿ëÇÏ´Â ¹æ¹ýÀ» ÀÍÈú ¼ö ÀÖ´Ù. 8Àå¿¡¼´Â Ionic 1À» Ȱ¿ëÇØ °³¹ßµÈ ¾ÛÀ» Ionic 2·Î ¸¶À̱׷¹À̼ÇÇÏ´Â ¹æ¹ýÀ» ÇнÀÇÑ´Ù. Ionic 1°ú Ionic 2ÀÇ Â÷ÀÌÁ¡°ú °¢ ½Ã½ºÅÛÀÌ ¾î¶»°Ô ´ëÀÀµÇ´ÂÁö »ìÆìº¼ ¼ö ÀÖ´Ù. 9Àå¿¡¼´Â IonicÀ» Ȱ¿ëÇØ °³¹ßÇÑ ¾ÛÀ» Å×½ºÆ®ÇÏ´Â °úÁ¤À» ¼Ò°³ÇÑ´Ù. À¯´Ö Å×½ºÆ®, ¿£µå Åõ ¿£µå Å×½ºÆ®, ¸ùŰ Å×½ºÆ®, µð¹ÙÀ̽º ÆÊ µî ¾Û °³¹ß ½Ã Ȱ¿ëÇÒ ¼ö ÀÖ´Â ´Ù¾çÇÑ Å×½ºÆ® ¹æ¹ýÀ» ¼Ò°³ÇÏ°í ¿¹Á¦¸¦ ¹ÙÅÁÀ¸·Î Å×½ºÆ® »ý¼º°ú Àû¿ë ¹æ¹ýÀ» ¹è¿î´Ù. 10Àå¿¡¼´Â ¾Û Ãâ½Ã ¹æ¹ýÀ» ÇнÀÇÑ´Ù. ¾Èµå·ÎÀ̵å¿Í iOS ¸¶ÄÏ¿¡ ¾ÛÀ» Ãâ½ÃÇϱâ À§ÇÑ Áغñ¿Í °¢ Ç÷§ÆûÀÇ ¼³Ä¡ ÆÄÀÏ(apk, ipa) »ý¼º¹ý ±×¸®°í À̸¦ »çÀÌ´× Å°(signing key)¿Í ÆÐŰ¡ÇÏ´Â ¹æ¹ýÀ» ¾Ë¾Æº»´Ù. 13Àå¿¡¼´Â IonicÀÇ ÃֽйöÀüÀÎ Ionic 3¿¡ ´ëÇÑ ¼Ò°³, Ionic 2¿Í Ionic 3ÀÇ Â÷ÀÌÁ¡ ±×¸®°í Ionic 3¿¡¼ ¾÷µ¥ÀÌÆ®µÈ ³»¿ëÀ» »ìÆìº»´Ù. À̸¦ ¹ÙÅÁÀ¸·Î Ã¥¿¡¼ ´Ù·çÁö ¸øÇÑ ÃֽйöÀü¿¡ ´ëÀÀÇÏ´Â ¹æ¹ý±îÁö »ìÆìº¼ ¼ö ÀÖ´Ù.
IonicÀ» Ȱ¿ëÇÑ ÇÏÀ̺긮µå ¾Û °³¹ßÀ» ½ÃÀÛÇÒ ¶§ ÇÊ¿äÇÑ ³»¿ëÀ» Àü¹ÝÀûÀ¸·Î ´Ù·ç±â ¶§¹®¿¡ ¹è¿ï ºÎºÐÀÌ ¸¹´Ù. ƯÈ÷ ¿ÜºÎ Ç÷¯±×ÀÎ ¹× API¸¦ Ȱ¿ëÇØ ¾ÛÀ» °³¹ßÇÏ´Â 7Àå¿¡¼ ¾î·Á¿òÀ» °ÞÀ» ¼ö ÀÖ´Ù. ÀúÀÚ°¡ Âü°íÇÑ À¥ ÆäÀÌÁö¿Í Äڵ带 Çϳª¾¿ »ìÆìº¸¸é ¾ÛÀ» ³¡±îÁö ¿Ï¼ºÇÒ ¼ö ÀÖÀ» °ÍÀÌ´Ù.
¹ø¿ªÀ» ÁøÇàÇÏ¸ç ¹®À帶´Ù ÀúÀÚÀÇ Àǵµ¸¦ ¾Ë·Á°í ¸¹Àº ³ë·ÂÀ» ±â¿ï¿´Áö¸¸, Á¦´ë·Î ÆÄ¾ÇÇÏÁö ¸øÇÑ ³»¿ëÀÌ ÀÖÀ» ¼ö ÀÖ´Ù. À߸øµÈ ³»¿ëÀ̳ª Ã¥¿¡ °ü·ÃµÈ ÀǰßÀº ¼ÒÁßÈ÷ ¿©°Ü Á¤È®ÇÑ ³»¿ëÀ» ÀüÇÏ´Â µ¥ ÁÁÀº ÀÚ·á·Î Âü°íÇϰڴÙ.
´Ý±â