|
|
|
|
|
|
|
Ã¥³»¿ë |
|
³×ÀÌƼºê ¾ÛÀÇ »ç¿ë¼º°ú À¥ÀÇ Á¢±Ù¼ºÀÌ ÀûÀýÈ÷ Á¶ÇÕµÈ ÇÁ·Î±×·¹½Ãºê À¥ ¾Û(PWA)Àº Áö±Ý±îÁö »ç¿ëÇØ¿Ô´ø À¥°ú´Â ´Ù¸¥ »õ·Î¿î °æÇèÀ» Á¦°øÇÕ´Ï´Ù. ³×Æ®¿öÅ©°¡ ¾ø´Â ¿ÀÇÁ¶óÀÎ »óÅ¿¡¼ À¥ ¼ºñ½º¸¦ »ç¿ëÇÏ°í, ¹é±×¶ó¿îµå¿¡¼ µ¥ÀÌÅ͸¦ µ¿±âÈÇϰųª Ǫ½Ã ¸Þ½ÃÁö¸¦ Á¦°øÇÏ´Â µî ±âÁ¸ÀÇ À¥¿¡¼ ÇÒ ¼ö ¾ø¾ú´ø ÀϵéÀ» À¥ ±â¼ú¸¸À» »ç¿ëÇÏ¿© ±¸ÇöÇÒ ¼ö ÀÖ½À´Ï´Ù.
ÀÌ Ã¥¿¡¼´Â ÇÁ·Î±×·¹½Ãºê À¥ ¾ÛÀÇ ±âº»ÀûÀÎ °³³ä°ú ¼ºñ½º ¿öÄ¿, À¥ ¾Û ¸Å´ÏÆ佺Ʈ µîÀÇ ÁÖ¿ä ±¸¼º ¿ä¼Ò»Ó¸¸ ¾Æ´Ï¶ó ¿ÀÇÁ¶óÀΠij½Ì, ¹é±×¶ó¿îµå µ¿±âÈ, Ǫ½Ã ¾Ë¸²°ú °°Àº ´ëÇ¥ÀûÀÎ ±â´É¿¡ ´ëÇÑ °³³äÀ» ÇнÀÇÏ°í, ¹Ø¹Ù´ÚºÎÅÍ Á÷Á¢ ±¸ÇöÇغ¸¸ç ÀϹÝÀûÀÎ À¥ ¾ÛÀ» ÇÁ·Î±×·¹½Ãºê À¥ ¾ÛÀ¸·Î ¹ßÀü½ÃÄÑ ³ª°¡´Â ¹æÇâÀ» ½Ç½ÀÇغ¼ ¼ö ÀÖ½À´Ï´Ù |
|
¸ñÂ÷ |
|
¼¹®
ÀúÀÚ ¼Ò°³
º£Å¸ ¸®´õ ¸®ºä
Chapter 01 ½ÃÀÛÇϱâ
1.1 ÀÚ¹Ù½ºÅ©¸³Æ®¿Í À¥ ±â¼úÀÇ ¹ßÀü
1.2 ÇÁ·Î±×·¹½Ãºê À¥ ¾Û(PWA)À̶õ?
1.3 ³×ÀÌƼºê ¾Û vs À¥ ¾Û vs ÇÏÀ̺긮µå ¾Û vs ÇÁ·Î±×·¹½Ãºê À¥ ¾Û
Chapter 02 ½Ç½ÀÀ» À§ÇÑ °³¹ß ȯ°æ ÁغñÇϱâ
2.1 Node.js ¼³Ä¡Çϱâ
2.2 Visual Studio Code ¼³Ä¡Çϱâ
2.3 ½Ç½À ¼Ò½ºÄÚµå ÁغñÇϱâ
Chapter 03 ÇÁ·Î±×·¹½Ãºê À¥ ¾ÛÀÌ µÇ±â À§ÇÑ Áغñ
3.1 Paper ÆľÇÇϱâ
3.2 Paper¿¡ PWA ºÒ¾î³Ö±â
Chapter 04 PWAÀÇ ÇÙ½É, ¼ºñ½º ¿öÄ¿
4.1 ¼ºñ½º ¿öÄ¿¶õ?
4.2 ¼ºñ½º ¿öÄ¿ µî·ÏÇϱâ
4.3 ¼ºñ½º ¿öÄ¿ÀÇ ±â´É À̺¥Æ®
4.4 ¼ºñ½º ¿öÄ¿¿¡¼ ºê¶ó¿ìÀú ¿äû °¡·Îä±â
4.5 ¼ºñ½º ¿öÄ¿ÀÇ »ý¸íÁÖ±â
4.6 ¼ºñ½º ¿öÄ¿ÀÇ »óÅÂ
Chapter 05 ¿ÀÇÁ¶óÀÎÀ» À§ÇÑ Ä³½Ã ½ºÅ丮Áö
5.1 ij½Ã ½ºÅ丮Áö¶õ?
5.2 À¥ ÆäÀÌÁö ¸®¼Ò½º ij½ÌÇϱâ
5.3 ij½Ã¿¡¼ ÀÀ´äÇϱâ
5.4 ij½Ã °ü¸®Çϱâ
5.5 ´Ù¾çÇÑ Ä³½Ì Àü·«
5.6 ¿ÀÇÁ¶óÀÎ »óÅ ¾Ë¸®±â
Chapter 06 IndexedDB »ç¿ëÇϱâ
6.1 IndexedDB¶õ?
6.2 µ¥ÀÌÅͺ£À̽º »ý¼ºÇϱâ
6.3 °´Ã¼ ÀúÀå¼Ò (ObjectStore)
6.4 Æ®·£Àè¼Ç (Transaction)
6.5 Paper¿¡ Àû¿ëÇϱâ
Chapter 07 À¥ ¾Û ¸Å´ÏÆ佺Ʈ (Web App Manifest)
7.1 À¥ ¾Û ¸Å´ÏÆ佺Ʈ¶õ?
7.2 À¥ ¾Û ¸Å´ÏÆ佺Ʈ »ìÆ캸±â
7.3 Ȩ ȸ鿡 Paper ¼³Ä¡Çϱâ
Chapter 08 Sync, ¹é±×¶ó¿îµå µ¿±âÈ
8.1 ¹é±×¶ó¿îµå µ¿±âÈ »ìÆ캸±â
8.2 µ¿±âÈ ÀÛ¾÷À» À§ÇÑ ÀúÀå¼Ò ¸¸µé±â
8.3 ¹é±×¶ó¿îµå µ¿±âÈ ±â´É ±¸ÇöÇϱâ
8.4 ¹é±×¶ó¿îµå µ¿±âÈ °³¼±Çϱâ
Chapter 09 ¼ºñ½º ¿öÄ¿¿Í Ŭ¶óÀ̾ðÆ® °£ ¸Þ½ÃÁö ÁÖ°í¹Þ±â
9.1 PaperÀÇ ¹®Á¦ ÆľÇÇϱâ
9.2 ¼ºñ½º ¿öÄ¿¿¡¼ À¥ ÆäÀÌÁö·Î ¸Þ½ÃÁö º¸³»±â
9.3 À¥ ÆäÀÌÁö¿¡¼ ¼ºñ½º ¿öÄ¿·Î ¸Þ½ÃÁö º¸³»±â
9.4 ¸Þ½ÃÁö ä³ÎÀ» ÅëÇØ ¸Þ½ÃÁö ÁÖ°í¹Þ±â
Chapter 10 Push, »ç¿ëÀÚ¿¡°Ô ¾Ë¸² º¸³»±â
10.1 Ǫ½Ã¶õ?
10.2 À¥ Ǫ½Ã »ìÆ캸±â
10.3 ¾Ë¸² API (Notification API)
10.4 Ǫ½Ã ¾Ë¸² ÁغñÇϱâ
10.5 Ǫ½Ã ¾Ë¸² º¸³»±â
10.6 ¸¶¹«¸®Çϸç
Chapter 11 ºÎ·Ï
11.1 ES6 ÀÚ¹Ù½ºÅ©¸³Æ® ¸Àº¸±â
11.2 ¶óÀÌÆ®ÇϿ콺 (Lighthouse)
11.3 ¿öÅ©¹Ú½º (Workbox)
ã¾Æº¸±â |
|
|
|
ÀúÀÚ
|
|
À̱ÙÇõ
°íµîÇб³ ½ÃÀýºÎÅÍ Áö±Ý±îÁö À¥ °³¹ßÀÚ·Î ÀÏÇÏ°í ÀÖ´Ù. ¿ì¿¬È÷ Á¢ÇÑ À¥ °³¹ßÀ» ½ÃÀÛÀ¸·Î Èï¹Ì¸¦ ¾ò¾î ÇöÀç±îÁö À¥ ºÐ¾ß¿¡ ´ëÇÑ ´Ù¾çÇÑ ±â¼úÀ» ¹è¿ì°í È°¿ëÇÏ°íÀÚ ³ë·ÂÇÏ°í ÀÖÀ¸¸ç, Áö±Ýº¸´Ù ´õ ³ªÀº À¥À» Ãß±¸ÇÏ´Â °³¹ßÀÚ Áß ÇÑ ¸íÀÌ´Ù. ´Ù¸¥ »ç¶÷µé°ú Áö½ÄÀ» °øÀ¯ÇÏ´Â °ÍÀ» ÁÁ¾ÆÇÏ¿© °³ÀÎ ºí·Î±×(https://geundung.dev)¿Í ±êÇãºê(https://github.com/leegeunhyeok)¿¡ ´Ù¾çÇÑ ³»¿ëÀ» Á¾Á¾ ¿Ã¸®°í ÀÖ´Ù.
|
|
|
À̱ÙÇõ
|
|
|
|
|
|
|
|
Ãâ°í¾È³» |
|
|
Ãâ°í¶õ ÀÎÅÍÆÄÅ© ¹°·ùâ°í¿¡¼ µµ¼°¡ Æ÷ÀåµÇ¾î ³ª°¡´Â ½ÃÁ¡À» ¸»Çϸç, ½ÇÁ¦ °í°´´Ô²²¼ ¼ö·ÉÇϽô ½Ã°£Àº »óÇ°Áغñ¿Ï·áÇØ Ãâ°íÇÑ ³¯Â¥ + Åùè»ç ¹è¼ÛÀÏÀÔ´Ï´Ù. |
|
ÀÎÅÍÆÄÅ© µµ¼´Â ¸ðµç »óÇ°ÀÇ Àç°í°¡ ÃæÁ·ÇÒ ½Ã¿¡ ÀÏ°ý Ãâ°í¸¦ ÇÕ´Ï´Ù. |
|
ÀϺΠÀç°í¿¡ ´ëÇÑ Ãâ°í°¡ ÇÊ¿äÇÒ ½Ã¿¡´Â ´ã´çÀÚ¿¡°Ô Á÷Á¢ ¿¬¶ôÇϽðųª, °í°´¼¾ÅÍ(°í°´¼¾ÅÍ(1577-2555)·Î ¿¬¶ôÁֽñ⠹ٶø´Ï´Ù. |
|
¹è¼Ûºñ ¾È³» |
|
|
ÀÎÅÍÆÄÅ© µµ¼ ´ë·®±¸¸Å´Â ¹è¼Û·á°¡ ¹«·áÀÔ´Ï´Ù. |
|
´Ü, 1°³ÀÇ »óÇ°À» ´Ù¼öÀÇ ¹è¼ÛÁö·Î ÀÏ°ý ¹ß¼Û½Ã¿¡´Â 1°³ÀÇ ¹è¼ÛÁö´ç 2,000¿øÀÇ ¹è¼Ûºñ°¡ ºÎ°úµË´Ï´Ù. |
¾Ë¾ÆµÎ¼¼¿ä! |
|
|
°í°´´Ô²²¼ ÁÖ¹®ÇϽŠµµ¼¶óµµ µµ¸Å»ó ¹× ÃâÆÇ»ç »çÁ¤¿¡ µû¶ó Ç°Àý/ÀýÆÇ µîÀÇ »çÀ¯·Î Ãë¼ÒµÉ ¼ö ÀÖ½À´Ï´Ù. |
|
Åùè»ç ¹è¼ÛÀÏÀÎ ¼¿ï ¹× ¼öµµ±ÇÀº 1~2ÀÏ, Áö¹æÀº 2~3ÀÏ, µµ¼, »ê°£, ±ººÎ´ë´Â 3ÀÏ ÀÌ»óÀÇ ½Ã°£ÀÌ ¼Ò¿äµË´Ï´Ù.
(´Ü, Åä/ÀÏ¿äÀÏ Á¦¿Ü) |
|
|
|
|
ÀÎÅÍÆÄÅ©µµ¼´Â °í°´´ÔÀÇ ´Ü¼ø º¯½É¿¡ ÀÇÇÑ ±³È¯°ú ¹ÝÇ°¿¡ µå´Â ºñ¿ëÀº °í°´´ÔÀÌ ÁöºÒÄÉ µË´Ï´Ù.
´Ü, »óÇ°À̳ª ¼ºñ½º ÀÚüÀÇ ÇÏÀÚ·Î ÀÎÇÑ ±³È¯ ¹× ¹ÝÇ°Àº ¹«·á·Î ¹ÝÇ° µË´Ï´Ù.
±³È¯/¹ÝÇ°/º¸ÁõÁ¶°Ç ¹× Ç°Áúº¸Áõ ±âÁØÀº ¼ÒºñÀڱ⺻¹ý¿¡ µû¸¥ ¼ÒºñÀÚ ºÐÀï ÇØ°á ±âÁØ¿¡ µû¶ó ÇÇÇظ¦ º¸»ó ¹ÞÀ» ¼ö ÀÖ½À´Ï´Ù.
Á¤È®ÇÑ È¯ºÒ ¹æ¹ý ¹× ȯºÒÀÌ Áö¿¬µÉ °æ¿ì 1:1¹®ÀÇ °Ô½ÃÆÇ ¶Ç´Â °í°´¼¾ÅÍ(1577-2555)·Î ¿¬¶ô Áֽñ⠹ٶø´Ï´Ù.
¼ÒºñÀÚ ÇÇÇغ¸»óÀÇ ºÐÀïó¸® µî¿¡ °üÇÑ »çÇ×Àº ¼ÒºñÀÚºÐÀïÇØ°á±âÁØ(°øÁ¤°Å·¡À§¿øȸ °í½Ã)¿¡ µû¶ó ºñÇØ º¸»ó ¹ÞÀ» ¼ö ÀÖ½À´Ï´Ù.
|
±³È¯ ¹× ¹ÝÇ°ÀÌ °¡´ÉÇÑ °æ¿ì |
|
|
»óÇ°À» °ø±Þ ¹ÞÀ¸½Å ³¯·ÎºÎÅÍ 7ÀÏÀ̳» °¡´ÉÇÕ´Ï´Ù. |
|
°ø±Þ¹ÞÀ¸½Å »óÇ°ÀÇ ³»¿ëÀÌ Ç¥½Ã, ±¤°í ³»¿ë°ú ´Ù¸£°Å³ª ´Ù¸£°Ô ÀÌÇàµÈ °æ¿ì¿¡´Â °ø±Þ¹ÞÀº ³¯·ÎºÎÅÍ 3°³¿ùÀ̳», ±×»ç½ÇÀ» ¾Ë°Ô µÈ ³¯ ¶Ç´Â ¾Ë ¼ö ÀÖ¾ú´ø ³¯·ÎºÎÅÍ 30ÀÏÀ̳» °¡´ÉÇÕ´Ï´Ù. |
|
»óÇ°¿¡ ¾Æ¹«·± ÇÏÀÚ°¡ ¾ø´Â °æ¿ì ¼ÒºñÀÚÀÇ °í°´º¯½É¿¡ ÀÇÇÑ ±³È¯Àº »óÇ°ÀÇ Æ÷Àå»óÅ µîÀÌ ÀüÇô ¼Õ»óµÇÁö ¾ÊÀº °æ¿ì¿¡ ÇÑÇÏ¿© °¡´ÉÇÕ´Ï´Ù.
|
|
|
|
±³È¯ ¹× ¹ÝÇ°ÀÌ ºÒ°¡´ÉÇÑ °æ¿ì |
|
|
|
°í°´´ÔÀÇ Ã¥ÀÓ ÀÖ´Â »çÀ¯·Î »óÇ° µîÀÌ ¸ê½Ç ¶Ç´Â ÈÑ¼ÕµÈ °æ¿ì´Â ºÒ°¡´ÉÇÕ´Ï´Ù. (´Ü, »óÇ°ÀÇ ³»¿ëÀ» È®ÀÎÇϱâ À§ÇÏ¿© Æ÷Àå µîÀ» ÈѼÕÇÑ °æ¿ì´Â Á¦¿Ü) |
|
½Ã°£ÀÌ Áö³²¿¡ µû¶ó ÀçÆǸŰ¡ °ï¶õÇÒ Á¤µµ·Î ¹°Ç°ÀÇ °¡Ä¡°¡ ¶³¾îÁø °æ¿ì´Â ºÒ°¡´ÉÇÕ´Ï´Ù. |
|
Æ÷Àå °³ºÀµÇ¾î »óÇ° °¡Ä¡°¡ ÈÑ¼ÕµÈ °æ¿ì´Â ºÒ°¡´ÉÇÕ´Ï´Ù. |
|
|
´Ù¹è¼ÛÁöÀÇ °æ¿ì ¹ÝÇ° ȯºÒ |
|
|
|
´Ù¹è¼ÛÁöÀÇ °æ¿ì ´Ù¸¥ Áö¿ªÀÇ ¹ÝÇ°À» µ¿½Ã¿¡ ÁøÇàÇÒ ¼ö ¾ø½À´Ï´Ù. |
|
1°³ Áö¿ªÀÇ ¹ÝÇ°ÀÌ ¿Ï·áµÈ ÈÄ ´Ù¸¥ Áö¿ª ¹ÝÇ°À» ÁøÇàÇÒ ¼ö ÀÖÀ¸¹Ç·Î, ÀÌÁ¡ ¾çÇØÇØ Áֽñ⠹ٶø´Ï´Ù. |
|
|
|
|
|
|