ÄÜÅÙÃ÷ »ó¼¼º¸±â
¸®¾×Æ® ÈÅÀ» È°¿ëÇÑ ¸¶ÀÌÅ©·Î »óÅ °ü¸®


¸®¾×Æ® ÈÅÀ» È°¿ëÇÑ ¸¶ÀÌÅ©·Î »óÅ °ü¸®

¸®¾×Æ® ÈÅÀ» È°¿ëÇÑ ¸¶ÀÌÅ©·Î »óÅ °ü¸®

<´ÙÀ̽à īÅä> Àú/<À̼±Çù>,<±èÁöÀº> °ø¿ª | À§Å°ºÏ½º

Ãâ°£ÀÏ
2024-03-15
ÆÄÀÏÆ÷¸Ë
ePub
¿ë·®
3 M
Áö¿ø±â±â
PC½º¸¶Æ®ÆùÅÂºí¸´PC
ÇöȲ
½Åû °Ç¼ö : 0 °Ç
°£·« ½Åû ¸Þ¼¼Áö
ÄÜÅÙÃ÷ ¼Ò°³
ÀúÀÚ ¼Ò°³
¸ñÂ÷
ÇÑÁÙ¼­Æò

ÄÜÅÙÃ÷ ¼Ò°³

ÀÌ Ã¥¿¡¼­´Â ´Ù¾çÇÑ »óÅ °ü¸® ¹æ¹ý°ú À¯¸íÇÑ »óÅ °ü¸® ¶óÀ̺귯¸®ÀÎ Zustand, Jotai, Valtio, React TrackedÀÇ »ç¿ë¹ýÀ» ¼Ò°³ÇÑ´Ù. ¶ÇÇÑ ½Ç¹«¿¡¼­ À¯¿ëÇÏ°Ô È°¿ëÇÒ ¼ö ÀÖ´Â ¿©·¯ »ç¿ë »ç·Ê¿¡ ´ëÇÑ ÆÐÅÏ°ú ¸®·»´õ¸µ ÃÖÀûÈ­¿¡ ´ëÇÑ ³»¿ëÀ» ´Ù·é´Ù. ÀÌ Ã¥À» óÀ½ºÎÅÍ ³¡±îÁö Á¤µ¶ÇÏ¸é ¸®¾×Æ®¿¡¼­ »óŸ¦ °ü¸®ÇÏ´Â ¹æ¹ý°ú ¿ø¸®¸¦ ºñ·ÔÇØ ¾ÖÇø®ÄÉÀÌ¼Ç ¿ä±¸»çÇ׿¡ ÀûÇÕÇÑ »óÅ °ü¸® ¶óÀ̺귯¸®¸¦ ¼±ÅÃÇÒ ¼ö ÀÖÀ» °ÍÀÌ´Ù.

ÀúÀÚ¼Ò°³

¼ö½Ê ³â µ¿¾È P2P ³×Æ®¿öÅ©¿Í À¥ ±â¼ú¿¡ ´ëÇØ ¿¬±¸ÇßÀ¸¸ç ¿ÀǼҽº ¼ÒÇÁÆ®¿þ¾î¿¡ ¿­Á¤À» °¡Áø ¼ÒÇÁÆ®¿þ¾î ¿£Áö´Ï¾î´Ù. ¿£Áö´Ï¾î¸µ¿¡ °ü½ÉÀÌ ¸¹À¸¸ç, Áö³­ 5³â µ¿¾ÈÀº ½ºÅ¸Æ®¾÷¿¡¼­ ÀÏÇØ ¿Ô´Ù. 90³â´ëºÎÅÍ ¿ÀǼҽº ¼ÒÇÁÆ®¿þ¾î¿¡ Àû±ØÀûÀ¸·Î Âü¿©ÇØ ¿ÔÀ¸¸ç, ÃÖ±Ù¿¡´Â ÀÚ¹Ù½ºÅ©¸³Æ®¿Í ¸®¾×Æ®¸¦ ÀÌ¿ëÇÑ ´Ù¾çÇÑ ¶óÀ̺귯¸® °³¹ß¿¡ ÁÖ·ÂÇÏ°í ÀÖ´Ù.

¸ñÂ÷

[1ºÎ] ¸®¾×Æ® ÈÅ°ú ¸¶ÀÌÅ©·Î »óÅ °ü¸®

- 01Àå: ¸®¾×Æ® ÈÅÀ» ÀÌ¿ëÇÑ ¸¶ÀÌÅ©·Î »óÅ °ü¸®
±â¼ú ¿ä±¸»çÇ×
¸¶ÀÌÅ©·Î »óÅ °ü¸® ÀÌÇØÇϱâ
¸®¾×Æ® ÈÅ »ç¿ëÇϱâ
__µ¥ÀÌÅÍ ºÒ·¯¿À±â¸¦ À§ÇÑ ¼­½ºÆ潺¿Í µ¿½Ã¼º ·»´õ¸µ
Àü¿ª »óÅ Ž±¸Çϱâ
useState »ç¿ëÇϱâ
__°ªÀ¸·Î »óÅ °»½ÅÇϱâ
__ÇÔ¼ö·Î »óÅ °»½ÅÇϱâ
__Áö¿¬ ÃʱâÈ­
useReducer »ç¿ëÇϱâ
__±âº» »ç¿ë¹ý
__º£ÀϾƿô
__¿ø½Ã °ª
__Áö¿¬ ÃʱâÈ­(init)
useState¿Í useReducerÀÇ À¯»çÁ¡°ú Â÷ÀÌÁ¡
__useReducer¸¦ ÀÌ¿ëÇÑ useState ±¸Çö
__useState¸¦ ÀÌ¿ëÇÑ useReducer ±¸Çö
__ÃʱâÈ­ ÇÔ¼ö »ç¿ëÇϱâ
__ÀζóÀÎ ¸®µà¼­ »ç¿ëÇϱâ
Á¤¸® 26

[02ºÎ] Àü¿ª »óÅ¿¡ ´ëÇÑ ±âÃÊÀûÀÎ Á¢±Ù¹ý

- 02Àå: Áö¿ª »óÅÂ¿Í Àü¿ª »óÅ »ç¿ëÇϱâ
±â¼ú ¿ä±¸»çÇ×
¾ðÁ¦ Áö¿ª »óŸ¦ »ç¿ëÇÒ±î?
__ÇÔ¼ö¿Í Àμö
__¸®¾×Æ® ÄÄÆ÷³ÍÆ®¿Í props
__Áö¿ª »óÅ¿¡ ´ëÇÑ useState ÀÌÇØÇϱâ
__Áö¿ª »óÅÂÀÇ ÇÑ°è
Áö¿ª »óŸ¦ È¿°úÀûÀ¸·Î »ç¿ëÇÏ´Â ¹æ¹ý
__»óÅ ²ø¾î¿Ã¸®±â(Lifting State Up)
__³»¿ë ²ø¾î¿Ã¸®±â(Lifting Content Up)
Àü¿ª »óÅ »ç¿ëÇϱâ
__Àü¿ª »óŶõ?
__¾ðÁ¦ Àü¿ª »óŸ¦ »ç¿ëÇÒ±î?
Á¤¸®

- 03Àå: ¸®¾×Æ® ÄÁÅؽºÆ®¸¦ ÀÌ¿ëÇÑ ÄÄÆ÷³ÍÆ® »óÅ °øÀ¯
±â¼ú ¿ä±¸»çÇ×
useState¿Í useContext Ž±¸Çϱâ
__useContext ¾øÀÌ useState »ç¿ëÇϱâ
__Á¤Àû °ªÀ» ÀÌ¿ëÇØ useContext »ç¿ëÇϱâ
__useContext¿Í ÇÔ²² useState »ç¿ëÇϱâ
ÄÁÅؽºÆ® ÀÌÇØÇϱâ
__ÄÁÅؽºÆ® ÀüÆÄÀÇ ÀÛµ¿ ¹æ½Ä
__ÄÁÅؽºÆ®¿¡ °´Ã¼¸¦ »ç¿ëÇÒ ¶§ÀÇ ÇÑ°èÁ¡
Àü¿ª »óŸ¦ À§ÇÑ ÄÁÅؽºÆ® ¸¸µé±â
__ÀÛÀº »óÅ Á¶°¢ ¸¸µé±â
useReducer·Î ÇϳªÀÇ »óŸ¦ ¸¸µé°í ¿©·¯ °³ÀÇ ÄÁÅؽºÆ®·Î ÀüÆÄÇϱâ
ÄÁÅؽºÆ® »ç¿ëÀ» À§ÇÑ ¸ð¹ü »ç·Ê
__»ç¿ëÀÚ Á¤ÀÇ ÈÅ°ú °ø±ÞÀÚ ÄÄÆ÷³ÍÆ® ¸¸µé±â
__»ç¿ëÀÚ Á¤ÀÇ ÈÅÀÌ ÀÖ´Â ÆÑÅ丮 ÆÐÅÏ
reduceRight¸¦ ÀÌ¿ëÇÑ °ø±ÞÀÚ Áßø ¹æÁö
Á¤¸®

- 04Àå: ±¸µ¶À» ÀÌ¿ëÇÑ ¸ðµâ »óÅ °øÀ¯
±â¼ú ¿ä±¸»çÇ×
¸ðµâ »óÅ »ìÆ캸±â
¸®¾×Æ®¿¡¼­ Àü¿ª »óŸ¦ ´Ù·ç±â À§ÇÑ ¸ðµâ »óÅ »ç¿ë¹ý
±âÃÊÀûÀÎ ±¸µ¶ Ãß°¡Çϱâ
¼±ÅÃÀÚ¿Í useSubscription »ç¿ëÇϱâ
Á¤¸®

- 05Àå: ¸®¾×Æ® ÄÁÅؽºÆ®¿Í ±¸µ¶À» ÀÌ¿ëÇÑ ÄÄÆ÷³ÍÆ® »óÅ °øÀ¯
±â¼ú ¿ä±¸»çÇ×
¸ðµâ »óÅÂÀÇ ÇÑ°è
ÄÁÅؽºÆ® »ç¿ëÀÌ ÇÊ¿äÇÑ ½ÃÁ¡
ÄÁÅؽºÆ®¿Í ±¸µ¶ ÆÐÅÏ »ç¿ëÇϱâ
Á¤¸®

[03ºÎ] ¶óÀ̺귯¸® ±¸Çö ¹× ¿ëµµ

- 06Àå: Àü¿ª »óÅ °ü¸® ¶óÀ̺귯¸® ¼Ò°³
±â¼ú ¿ä±¸»çÇ×
Àü¿ª »óÅ °ü¸® ¹®Á¦ ÇØ°áÇϱâ
µ¥ÀÌÅÍ Á᫐ Á¢±Ù ¹æ½Ä°ú ÄÄÆ÷³ÍÆ® Á᫐ Á¢±Ù ¹æ½Ä »ç¿ëÇϱâ
__µ¥ÀÌÅÍ Á᫐ Á¢±Ù ¹æ½Ä ÀÌÇØÇϱâ
__ÄÄÆ÷³ÍÆ® Á᫐ Á¢±Ù ¹æ½Ä ÀÌÇØÇϱâ
µÎ Á¢±Ù ¹æ½ÄÀÇ ¿¹¿Ü
¸®·»´õ¸µ ÃÖÀûÈ­
__¼±ÅÃÀÚ ÇÔ¼ö »ç¿ë
__¼Ó¼º Á¢±Ù °¨Áö
__¾ÆÅè »ç¿ë
Á¤¸®

- 07Àå: »ç¿ë »ç·Ê ½Ã³ª¸®¿À 1: Zustand
±â¼ú ¿ä±¸»çÇ×
¸ðµâ »óÅÂ¿Í ºÒº¯ »óÅ ÀÌÇØÇϱâ
¸®¾×Æ® ÈÅÀ» ÀÌ¿ëÇÑ ¸®·»´õ¸µ ÃÖÀûÈ­
Àб⠻óÅÂ¿Í °»½Å »óÅ »ç¿ëÇϱâ
±¸Á¶È­µÈ µ¥ÀÌÅÍ Ã³¸®Çϱâ
ÀÌ Á¢±Ù ¹æ½Ä°ú ¶óÀ̺귯¸®ÀÇ Àå´ÜÁ¡
Á¤¸®

- 08Àå: »ç¿ë »ç·Ê ½Ã³ª¸®¿À 2: Jotai
±â¼ú ¿ä±¸»çÇ×
Jotai ÀÌÇØÇϱâ
__±¸¹® ´Ü¼ø¼º
__µ¿Àû ¾ÆÅè »ý¼º
·»´õ¸µ ÃÖÀûÈ­
Jotai°¡ ¾ÆÅè °ªÀ» ÀúÀåÇÏ´Â ¹æ½Ä ÀÌÇØÇϱâ
¹è¿­ ±¸Á¶ Ãß°¡Çϱâ
JotaiÀÇ ´Ù¾çÇÑ ±â´É »ç¿ëÇϱâ
__¾ÆÅèÀÇ write ÇÔ¼ö Á¤ÀÇÇϱâ
__¾×¼Ç ¾ÆÅè »ç¿ëÇϱâ
__¾ÆÅèÀÇ onMount ¿É¼Ç ÀÌÇØÇϱâ
__jotai/utils ¹øµé ¼Ò°³Çϱâ
__¶óÀ̺귯¸® »ç¿ë¹ý ÀÌÇØÇϱâ
__°í±Þ ±â´É ¼Ò°³
Á¤¸®

- 09Àå: »ç¿ë »ç·Ê ½Ã³ª¸®¿À 3: Valtio
±â¼ú ¿ä±¸»çÇ×
¶Ç ´Ù¸¥ ¸ðµâ »óÅ ¶óÀ̺귯¸®ÀÎ Valtio »ìÆ캸±â
ÇÁ¶ô½Ã¸¦ È°¿ëÇÑ º¯°æ °¨Áö ¹× ºÒº¯ »óÅ »ý¼ºÇϱâ
ÇÁ¶ô½Ã¸¦ È°¿ëÇÑ ¸®·»´õ¸µ ÃÖÀûÈ­
ÀÛÀº ¾ÖÇø®ÄÉÀÌ¼Ç ¸¸µé¾î º¸±â
ÀÌ Á¢±Ù ¹æ½ÄÀÇ Àå´ÜÁ¡
Á¤¸®

- 10Àå: »ç¿ë »ç·Ê ½Ã³ª¸®¿À 4: React Tracked
±â¼ú ¿ä±¸»çÇ×
React Tracked ÀÌÇØÇϱâ
useState, useReducer¿Í ÇÔ²² React Tracked »ç¿ëÇϱâ
__useState¿Í ÇÔ²² React Tracked »ç¿ëÇϱâ
__useReducer¿Í ÇÔ²² React Tracked »ç¿ëÇϱâ
React Redux¿Í ÇÔ²² React Tracked »ç¿ëÇϱâ
ÇâÈÄ Àü¸Á
Á¤¸®

- 11Àå: ¼¼ °¡Áö Àü¿ª »óÅ ¶óÀ̺귯¸®ÀÇ À¯»çÁ¡°ú Â÷ÀÌÁ¡
±â¼ú ¿ä±¸»çÇ×
Zustand¿Í ReduxÀÇ Â÷ÀÌÁ¡
__Redux¿Í Zustand¸¦ »ç¿ëÇÑ ¿¹Á¦
__Redux¿Í Zustand ¿¹Á¦ ºñ±³
Jotai¿Í Recoil À» »ç¿ëÇÏ´Â ½ÃÁ¡
__Recoil°ú Jotai ¿¹Á¦
__Recoil°ú Jotai ¿¹Á¦ ºñ±³
Valtio¿Í MobX »ç¿ëÇϱâ
__MobX, Valtio °ü·Ã ¿¹Á¦
__MobX¿Í Valtio ¿¹Á¦ ºñ±³
Zustand, Jotai, Valtio ºñ±³Çϱâ
Á¤¸®