|
¡Ø ¾Ë·Áµå¸³´Ï´Ù.¹ßÇàÀÏ : 2022-01-25
Ã¥¼Ò°³ÀÌ Ã¥ÀÌ ¼ÓÇÑ ºÐ¾ßÀÌ Ã¥ÀÇ ÁÖÁ¦¾îÀ¥ ¾ÖÇø®ÄÉÀÌ¼Ç °³¹ßÀ» À§ÇÑ ¡¸Svelte ½ÇÀü °¡À̵塹 À¥ ÇÁ·±Æ®¿£µå ±âÃʺÎÅÍ ½ÇÀü SNS ÇÁ·ÎÁ§Æ®±îÁö ½ºº§Æ®ÀÇ ÀåÁ¡°ú ±â´É, ±âÁ¸ ÇÁ·±Æ®¿£µå ÇÁ·¹ÀÓ¿öÅ©¿ÍÀÇ Â÷ÀÌÁ¡ ±×¸®°í ½ºº§Æ®°¡ ½ÇÀü ÇÁ·ÎÁ§Æ®¿¡ ¾î¶»°Ô »ç¿ëµÇ´ÂÁö ¼Ò°³ÇÑ´Ù. ¶ÇÇÑ, ½ÇÁ¦ ¹é¿£µå ¼¹ö°¡ Àִ ȯ°æ¿¡¼ ‘Todo ¼ºñ½º’¿Í ‘SNS ¼ºñ½º’¸¦ È¿°úÀûÀ¸·Î ±¸ÇöÇÑ´Ù. ÀÌ °úÁ¤¿¡¼ ´Ü¼øÈ÷ ÇϳªÀÇ ÇÁ·¹ÀÓ¿öÅ©¸¦ ÀÍÈ÷´Â °ÍÀ» ³Ñ¾î ÄÄÆ÷³ÍÆ®, »óÅ°ª, ºñµ¿±âÅë½Å µî ÇÁ·±Æ®¿£µå °³¹ßÀÚ¶ó¸é ¾Ë¾Æ¾ß ÇÏ´Â ±âº»±â¸¦ ÀÍÈú ¼ö ÀÖ´Ù. ÀÌ Ã¥À» ÅëÇØ ½ºº§Æ® ¹®¹ýÀ» ü°èÀûÀ¸·Î °øºÎÇÏ°í °£°áÇÑ ÄÚµå·Î À¥ ÇÁ·±Æ®¿£µå¸¦ ºü¸£°Ô °³¹ßÇØ ³ª°¡¸ç ½ºº§Æ®ÀÇ ¸Å·ÂÀ» Á¦´ë·Î ´À²¸º¼ ¼ö ÀÖÀ» °ÍÀÌ´Ù. ÀÌ Ã¥À» ÅëÇØ ¾òÀ» ¼ö ÀÖ´Â °Í - Svelte ÇÁ·¹ÀÓ¿öÅ© È°¿ë ¹× ÀÀ¿ë ½ºÅ³ - ÇÁ·±Æ®¿£µå °³¹ß °úÁ¤¿¡ ´ëÇÑ Àü¹ÝÀûÀÎ ÀÌÇØ - È»ìÇ¥ÇÔ¼ö, map, filter µî ¸ð´ø ÀÚ¹Ù½ºÅ©¸³Æ® ¹®¹ýÀÇ ÀÌÇØ - axios¸¦ ÀÌ¿ëÇØ ¹é¿£µå ¼¹ö¿Í È¿À²ÀûÀ¸·Î Åë½ÅÇÏ´Â ¹æ¹ý - ÅäÅ«À» ÀÌ¿ëÇØ ÀÎÁõ°úÁ¤À» ÇÁ·±Æ®¿£µå¿¡ Àû¿ëÇÏ´Â ¹æ¹ý - SNS ¼ºñ½º Á¦ÀÛÀ» ÅëÇÑ ½ÇÀü °³¹ß ÇÁ·ÎÁ§Æ® °æÇè - rollup.js ¹øµé·¯ÀÇ ÀÌÇØ - ¹«ÇѽºÅ©·Ñ, Æû°ËÁõ, ½¬¿î³¯Â¥º¸±â µî ½Ç¹«¿¡ ¹Ù·Î Àû¿ë °¡´ÉÇÑ ÇÁ·±Æ®¿£µå ½ºÅ³ ¸ñÂ÷Chapter 01 Svelte ¼Ò°³ 1-1 À¥ ÇÁ·±Æ®¿£µåÀÇ °ú°Å¿Í ÇöÀç 1-2 SvelteÀÇ µîÀå 1-3 Svelte ÀåÁ¡ ____1-3-1 Write less code: º¸´Ù ÀûÀº ÄÚµå ____1-3-2 No virtual DOM: °¡»óµ¼ ¾øÀÌ ____1-3-3 Truly reactive: ÁøÁ¤ÇÑ ¹ÝÀÀ¼º Chapter 02 ÇнÀ ȯ°æ 2-1 REPLÀ» ÅëÇÑ ¿¹Á¦ ½ÇÇà¹æ¹ý ¼Ò°³ 2-2 ·ÎÄà °³¹ßȯ°æ ±¸Ãà ____2-2-1 Node.js ȯ°æ ¼³Á¤ ____2-2-2 ºñÁÖ¾ó ½ºÆ©µð¿À ÄÚµå ¼³Ä¡ ____2-2-3 Svelte ¼³Ä¡ ¹× ½ÇÇà 2-3 Svelte ¼³Ä¡ Æú´õ ¼³¸í ____2-3-1 ±âº» ±¸¼º¿ä¼Ò ¹× Æú´õ ±¸Á¶ ¼³¸í ____2-3-2 Svelte ±âº» ±¸¼º¿ä¼Ò 2-4 ¼Ò½ºÄÚµå ½ÇÇà¹æ¹ý Chapter 03 ÄÄÆ÷³ÍÆ®(1) - ±âº» »ç¿ë¹æ¹ý 3-1 ÄÄÆ÷³ÍÆ® ±âº» 3-2 State(»óÅ°ª) 3-3 Reactivity(¹ÝÀÀ¼º) ____3-3-1 ¸¶Å©¾÷ ¿µ¿ª¿¡¼ÀÇ ¹ÝÀÀ¼º ____3-3-2 ½ºÅ©¸³Æ® ¿µ¿ª¿¡¼ÀÇ ¹ÝÀÀ¼º - \$: ____3-3-3 ´Ù¸¥ ÇÁ·¹ÀÓ¿öÅ©¿Í ÄÚµå ºñ±³ 3-4 Event ____3-4-1 À̺¥Æ® ±âº» »ç¿ë¹æ¹ý ____3-4-2 ÀζóÀÎ(inline) À̺¥Æ® »ç¿ë¹æ¹ý ____3-4-3 À̺¥Æ® ¼ö½Ä¾î(modifiers) 3-5 Props¸¦ ÀÌ¿ëÇÑ ÄÄÆ÷³ÍÆ® Åë½Å¹æ¹ý ____3-5-1 Props ±âº» »ç¿ë¹æ¹ý ____3-5-2 Props µ¥ÀÌÅÍ º¯°æ Chapter 04 ÄÄÆ÷³ÍÆ®(2) - Template Á¦¾î 4-1 ³í¸®ºí·Ï {#if...} ____4-1-1 if ºí·Ï ____4-1-2 else ºí·Ï ____4-1-3 else-if ºí·Ï 4-2 ¹Ýº¹ºí·Ï {#each...} ____4-2-1 Each ºí·Ï 4-3 Binding ____4-3-1 ¹ÙÀεùÀ̶õ? ____4-3-2 ·¹ÀÎÁö ¹ÙÀεù ____4-3-3 ¼¿·ºÆ®¹Ú½º ¹ÙÀεù ____4-3-4 ¹Ú½º ¹ÙÀεù ____4-3-5 group inputÀ» ÀÌ¿ëÇÑ ¶óµð¿À ¹öÆ° · ¹Ú½º ¹ÙÀεù ____4-3-6 contenteditable ¹ÙÀεù ____4-3-7 ÄÄÆ÷³ÍÆ® ¹ÙÀεù 4-4 ½½·Ô(Slot) ____4-4-1 ½½·ÔÀ̶õ? ____4-4-2 ½½·Ô name ¼³Á¤ ____4-4-3 Á¶°Ç¿¡ µû¸¥ Ç¥Çö ____4-4-4 ½½·Ô¿¡¼ÀÇ Props Åë½Å 4-5 ¶óÀÌÇÁ»çÀÌŬ Chapter 05 ÄÄÆ÷³ÍÆ® Åë½Å °í±Þ 5-1 context API ____5-1-1 context API ±âº» »ç¿ë¹æ¹ý ____5-1-2 context API È°¿ë ¿¹Á¦ 5-2 dispatch 5-3 store ____5-3-1 writable store ____5-3-2 derived store ____5-3-3 readable store Chapter 06 ½ºÅ¸ÀÏ ¹× È¿°ú 6-1 CSS Á¦¾î 6-2 transition: ȸéÀüȯ ____6-2-1 fade ____6-2-2 blur ____6-2-3 fly ____6-2-4 slide ____6-2-5 scale ____6-2-6 draw ____6-2-7 in · out ____6-2-8 crossfade ____6-2-9 flipÀ» ÀÌ¿ëÇÑ ¾Ö´Ï¸ÞÀÌ¼Ç 6-3 motion ____6-3-1 tweened ____6-3-2 spring 6-4 actions ____6-4-1 ¾×¼Ç ±âº» »ç¿ë¹æ¹ý ____6-4-2 ¾×¼Ç¿¡ ÀÎÀÚ Àü´Þ ____6-4-3 update · destroy ____6-4-4 ¾×¼ÇÀ» ÅëÇÑ À̺¥Æ® Á¦¾î ____6-4-5 ¾×¼ÇÀ» ÀÌ¿ëÇÑ ¿ÜºÎ ¶óÀ̺귯¸® È°¿ë Chapter 07 Modal·Î ¹è¿ì´Â ÄÄÆ÷³ÍÆ® ½Ç½À Chapter 08 ½ÇÀü ÇÁ·ÎÁ§Æ®(1) - Todo ¼ºñ½º ¸¸µé±â 8-1 Todo ÇÁ·ÎÁ§Æ® ¼³¸í ____8-1-1 Todo ¼ºñ½º ±â´É ____8-1-2 ±âº» ȯ°æ¼³Á¤ 8-2 ÄÄÆ÷³ÍÆ® ¹èÄ¡ 8-3 Todo ¸®½ºÆ® Ãâ·Â 8-4 Todo ÀÔ·Â 8-5 Todo »èÁ¦ 8-6 Todo ¼öÁ¤ 8-7 count & Todo º¸±â¸ðµå ____8-7-1 count: ÇÒ ÀÏ °³¼ö ____8-7-2 º¸±â¸ðµå: ¸ðµÎ º¸±â · ÁøÇà · ¿Ï·á 8-8 ȸéÀüȯ È¿°ú Àû¿ë 8-9 ½ºÅä¾î¸¦ ÅëÇÑ Todo ¸®ÆÑÅ丵 ____8-9-1 storeForm · storeTodo ÀÛ¼º ____8-9-2 fetchTodos · countTodo ÀÛ¼º ____8-9-3 ÄÄÆ÷³ÍÆ®¿¡ ½ºÅä¾î Àû¿ë Chapter 09 ¶ó¿ìÅÍ(Router) 9-1 ¶ó¿ìÅͶõ? 9-2 tinro ¼³Ä¡ 9-3 ¶ó¿ìÆà ±â´É 9-4 Áßø ¶ó¿ìÆà 9-5 ÆĶó¹ÌÅÍ Àü´Þ ¹× ¹Þ±â 9-6 ÇÁ·Î±×·¡¹Ö Á¦¾î 9-7 ȸéÀüȯ 9-8 ¶ó¿ìÆà °¡µå Chapter 10 ¼¹ö¿ÍÀÇ Åë½Å¹æ¹ý 10-1 fetch¸¦ ÀÌ¿ëÇÑ Åë½Å 10-2 axios¸¦ ÀÌ¿ëÇÑ Åë½Å 10-3 {#await} ºí·ÏÀ» ÀÌ¿ëÇÑ Åë½Å Á¦¾î Chapter 11 ½ÇÀü ÇÁ·ÎÁ§Æ®(2) - SNS ¼ºñ½º ¸¸µé±â 11-1 SLOG ÇÁ·ÎÁ§Æ® ¼³¸í ____11-1-1 SLOG ¼ºñ½º ±â´É 11-2 API ¼³Ä¡ ¹× ¼³¸í ____11-2-1 SLOG ¹é¿£µå ¼³Ä¡ ____11-2-2 SLOG API ¼³¸í 11-3 ÇÁ·ÎÁ§Æ® »ý¼º ¹× ÄÄÆ÷³ÍÆ® ¹èÄ¡ ____11-3-1 ÇÁ·ÎÁ§Æ® »ý¼º ____11-3-2 µðÀÚÀÎ ¿ä¼Ò ¹èÄ¡ ____11-3-3 ÄÄÆ÷³ÍÆ® ¹èÄ¡ 11-4 ¶ó¿ìÅÍ ¼³Á¤ 11-5 axios¸¦ ÀÌ¿ëÇÑ ¼¹öÅë½Å ¼³Á¤ 11-6 ½ºÅä¾î ¹èÄ¡ 11-7 ÀÎÁõ ±¸Çö ____11-7-1 ÀÎÁõÅäÅ« ¼³¸í ____11-7-2 authToken ½ºÅä¾î ÀÛ¼º ____11-7-3 auth ½ºÅä¾î ÀÛ¼º ____11-7-4 ·Î±×ÀÎ »óÅ ____11-7-5 ·Î±×ÀÎ ÆäÀÌÁö ÀÛ¼º ____11-7-6 ȸ¿ø°¡ÀÔ ÆäÀÌÁö ÀÛ¼º ____11-7-7 ÀÛ¼ºµÈ ÀÎÁõ±â´É Å×½ºÆ® 11-8 ±Û ¸ñ·Ï ±¸Çö ____11-8-1 currentArticlesPage ½ºÅä¾î ÀÛ¼º ____11-8-2 articles ½ºÅä¾î ÀÛ¼º ____11-8-3 ¹«ÇѽºÅ©·Ñ ±â´É ±¸Çö ____11-8-4 ¹«ÇѽºÅ©·Ñ ¹®Á¦ ÇØ°á 11-9 ±Û ÀÛ¼º ±¸Çö ____11-9-1 ·Î±×ÀÎ »óÅ¿¡ µû¸¥ ±Û ÀÛ¼ºÆû º¯È ____11-9-2 ArticleAddForm ÄÄÆ÷³ÍÆ® ÀÛ¼º 11-10 ±Û ¼öÁ¤ ¹× »èÁ¦ ±¸Çö ____11-10-1 ±Û Æ˾÷ ¸Þ´º ¼³Á¤ ____11-10-2 ±Û ¼öÁ¤¸ðµå ¸¸µé±â ____11-10-3 ±Û ¼öÁ¤ »èÁ¦ 11-11 ÄÚ¸àÆ® ±â´É ±¸Çö ____11-11-1 ÄÚ¸àÆ® ÆäÀÌÁö À̵¿ ____11-11-2 ÄÚ¸àÆ® ÆäÀÌÁö¿¡¼ ¼±ÅÃµÈ ±ÛÀÇ ³»¿ë º¸±â ¼³Á¤ ____11-11-3 ÄÚ¸àÆ® Ãß°¡ ¹× ¸ñ·Ï º¸±â ____11-11-4 ±Û¸ñ·Ï¿¡¼ ÄÚ¸àÆ® Ä«¿îÆ® ¼öÁ¤ 11-12 'ÁÁ¾Æ¿ä' ±â´É ±¸Çö ____11-12-1 'ÁÁ¾Æ¿ä' °ü·Ã ½ºÅä¾î Ãß°¡ ____11-12-2 Aritcle ÄÄÆ÷³ÍÆ®¿¡ 'ÁÁ¾Æ¿ä' ±â´É Ãß°¡ 11-13 º¸±â¸ðµå º¯°æ ±¸Çö ____11-13-1 º¸±â¸ðµå º¯°æ ¿ø¸® ____11-13-2 ½ºÅä¾î ÀÛ¼º ____11-13-3 ArticleHeader ÄÄÆ÷³ÍÆ®¿¡ º¸±â¸ðµå ±â´É ±¸Çö 11-14 ¾Û ¿Ï¼ºµµ ³ôÀ̱â ____11-14-1 Æû °ËÁõ(form validation) ±¸Çö ____11-14-2 ³¯Â¥ º¸±â ¼öÁ¤ ____11-14-3 ·Î±×¾Æ¿ô º¸¿Ï 11-15 ¸¶¹«¸® Chapter 12 rollup ¼Ò°³ ¹× ¹øµé·¯ ÀÌÇØ 12-1 ¹øµé·¯¶õ? 12-2 rollup ¼Ò°³ 12-3 ±âº» ¼³Á¤ 12-4 SCSS ¼³Á¤ Chapter 13 Ư¼ö ¿ä¼Ò 13-1 ¡´svelte:self¡µ 13-2 ¡´svelte:component¡µ 13-3 ¡´svelte:window¡µ 13-4 ¡´svelte:body¡µ 13-5 ¡´svelte:head¡µ 13-6 ¡´svelte:options¡µ 13-7 ¡´svelte:fragment¡µ Chapter 14 À¯¿ëÇÑ ÀÚ¹Ù½ºÅ©¸³Æ® ¹®¹ý 14-1 È»ìÇ¥ÇÔ¼ö 14-2 ¹è¿Á¶ÀÛ ¸Þ¼Òµå
(°³)
1. ¹è¼Û
¹è¼ÛÀº ´çÀÏ ¿ÀÈÄ 4½ÃÀÌÀü(Åä¿äÀÏÀº ¿ÀÈÄ12½Ã)¿¡ ÁÖ¹®¹× °áÀ縦 ÇÏ½Ã¸é ´çÀϹè¼ÛµË´Ï´Ù. ¹è¼ÛÀº ÁÖ¹® ÈÄ °áÀç¿Ï·áÀÏÀ» ±âÁØÀ¸·Î 1~2ÀÏ ¾È¿¡ ¹è¼Û¿Ï·á¸¦ ¿øÄ¢À¸·Î ÇÏ°í ÀÖ½À´Ï´Ù. ´Ù¸¸ ºÎµæÀÌÇÑ °æ¿ì(ÇØ´ç»óÇ°ÀÇ Ç°Àý ¹× ÀýÆÇ) °í°´´Ô²² Àüȸ¦ µå·Á¼ 󸮸¦ ÇÕ´Ï´Ù. 2. ¹è¼Û·á ¹è¼Û·á´Â 25,000¿ø ÀÌ»óÀÌ °æ¿ì À̱×ÀëÇ÷¯½º¿¡¼ ºÎ´ãÇÏ°í, ¹Ì¸¸ÀÏ °æ¿ì °í°´ÀÌ 2,500¿øÀ» ºÎ´ãÇÕ´Ï´Ù. ´Ù¸¸ ±¸¸Å±Ý¾×ÀÌ 25,000¿ø ÀÌ»óÀε¥ Àû¸³±Ý µîÀ» »ç¿ëÇÏ¿© ½ÇÁ¦ °áÀç±Ý¾×ÀÌ 25,000¿ø ¹Ì¸¸ÀÌ µÇ´õ¶óµµ À̱×ÀëÇ÷¯½º¿¡¼ ¹è¼Û·á¸¦ ºÎ´ãÇÏ°í, Á¦ÁÖ¸¦ Á¦¿ÜÇÑ µµ¼Áö¿ªÀÇ °æ¿ì´Â 5,000¿øÀÌ Ãß°¡µË´Ï´Ù. Çؿܹè¼ÛÀº Àü¾× °í°´ºÎ´ãÀÌ µË´Ï´Ù. 5. ¹ÝÇ°/±³È¯
¹ÞÀ¸½Å ³¯ ºÎÅÍ ÀÏÁÖÀÏ À̳» ¹ÝÇ°/±³È¯ÀÌ °¡´ÉÇϽʴϴÙ. ½Ã°£ÀÌ Áö³ª¸é 󸮰¡ ºÒ°¡ÇÔÀ» ¾Ë·Á µå¸³´Ï´Ù. ´Ù¸¸ ÁÖ¹®ÇϽŠ»óÇ°°ú ´Ù¸¥ »óÇ°ÀÌ ¹è¼ÛµÇ°Å³ª Æĺ», ³«ÀåÀÌ ÀÖ´Â µµ¼ÀÇ °æ¿ì ÀÌ¿ë¾à°ü¿¡ ÁØÇÏ¿© À̱×ÀëÇ÷¯½ºÀÇ ºñ¿ëÀ¸·Î ±³È¯, ¹ÝÇ° ¹× ȯºÒ µîÀ» Çص帳´Ï´Ù. 4. ȯºÒ ¹ÞÀ¸½Å ³¯ºÎÅÍ 2ÀÏ À̳»·Î Àüȳª 1:1 °Ô½Ã±Û·Î Àû¾îÁÖ¼Å¾ß °¡´ÉÇϽʴϴÙ. 5. ÁÖÀÇ °í°´´Ô º¯½ÉÀ¸·Î ÀÎÇÑ ±³È¯/¹ÝÇ°/ȯºÒ °í°´´Ô²²¼ Åùèºñ(¿Õº¹Åùèºñ)¸¦ ºÎ´ãÀÌ µÇ´Ï ÀÌÁ¡ À¯ÀÇÇØ ÁֽʽÿÀ. ¶ÇÇÑ °ÀÇÅ×ÀÙ/¾ãÀº¹®Á¦Áý/ºñ´ÒÆ÷ÀåµÈÁ¦Ç°µîÀº Çѹø ±¸¸ÅÇÏ½Ã¸é ±³È¯/¹ÝÇ°/ȯºÒÀÌ ÀüÇô ¾ÈµË´Ï´Ù. ½ÅÁßÈ÷ »ý°¢Çϼż ±¸¸Å ºÎŹµå¸³´Ï´Ù. ´Ù¸¸ ºÒ·®Å×ÀÙÀÇ °æ¿ì ±× ºÒ·®ÀÌ µÈ °³º°Å×ÀÙÀ» À̱×ÀëÇ÷¯½ºÀÇ ºñ¿ëÀ¸·Î A/S¸¦ Çص帳´Ï´Ù. 6. ÁÖ¹®Ãë¼Ò, ±³È¯, ¹ÝÇ° ¹× ȯºÒÀº ´çÀÏ 3½Ã ÀÌÀü¿¡ ÇØÁÖ¼Å¾ß °¡´ÉÇÕ´Ï´Ù. ±× ÀÌÈÄ´Â ¹è¼Û µî¿¡ µû¸¥ Á¦ºñ¿ëÀ» ºÎ´ãÇÏ¼Å¾ß ÇÕ´Ï´Ù.
|
|
||||||||
|
||||||||
|
||||||||
* »óÇ°»çÀÌÁî Ä¡¼ö´Â Àç´Â ¹æ¹ý°ú À§Ä¡¿¡ µû¶ó 1~3cm ¿ÀÂ÷°¡ ÀÖÀ» ¼ö ÀÖ½À´Ï´Ù.