|
|
|
|
|
|
|
Ã¥³»¿ë |
|
¢º ½Ç¹«¿¡¼ ¸®¾×Æ®¸¦ ´Ù·ê ¶§ ÇÊ¿äÇÑ ³»¿ëÀ¸·Î °¡µæÇØ¿ä!
- ¸®¾×Æ® ÈÅ, ¸®´ö½º, ¶ó¿ìÆà °³³ä »ó¼¼ ¼Ò°³¿Í È°¿ë
- Å×ÀÏÀ©µåCSS¸¦ È°¿ëÇÑ À¥ ÆäÀÌÁö ²Ù¹Ì±â
- ±Û·Î¹ú ¼öÁØÀÇ Å¸ÀÔ½ºÅ©¸³Æ® ÄÚµå ÆÐÅÏ »ç¿ë
- ÀͽºÇÁ·¹½º¿Í ¸ù°íDB µî ¹é¿£µå¿Í ¿¬µ¿
¢º ÇÁ·±Æ®¿£µå ºÐ¾ß Çʼö ½ºÆåÀ» ½×¾Æ¿ä!
Áö±Ý ÇÁ·±Æ®¿£µå °³¹ßÀÚ Ã¤¿ë °ø°í¸¦ È®ÀÎÇØ º¸¼¼¿ä. ÀÚ°Ý ¿ä°Ç¿¡¼ React.js´Â ±âº»ÀÌ°í TypeScript, SPA, REST API, Redux, Router¿Í °°Àº ´Ü¾î¸¦ ÈçÈ÷ º¼ ¼ö ÀÖ½À´Ï´Ù. ÀÌ Ã¥¿¡¼´Â ÀÌ·¯ÇÑ ±â¼úÀÇ °³³ä°ú È°¿ë¹ýÀ» ´ã¾Æ ¿äÁò À¥ °³¹ßÀÇ Æ®·»µå¸¦ ¹Ý¿µÇß½À´Ï´Ù. Æò¼Ò ¸ð´ø À¥ °³¹ß ±â¼ú¿¡ °¥ÁõÀ» ´À²¼´ø ºÐµéÀ̶ó¸é ÀÌ Ã¥ ÇÑ ±ÇÀ¸·Î ÇؼÒÇØ º¸¼¼¿ä.
¢º Æ®·¼·Î °°Àº ¾ÖÇø®ÄÉÀ̼ÇÀ» ¸¸µé¾î ¹é¿£µå ±â¼ú°ú ¿¬µ¿ÇØ º¸¼¼¿ä!
ÀÌ Ã¥¿¡¼´Â Ä«µå µå·¡±× ¾Ø µå·Ó ±â´ÉÀÌ ÀÖ´Â Ä¹Ý º¸µå·Î À¯¸íÇÑ Æ®·¼·Î(Trello.com) °°Àº ¾ÖÇø®ÄÉÀ̼ÇÀ» ¸¸µì´Ï´Ù. ¿äÁò ´ë¼¼·Î ¶°¿À¸¥ Å×ÀÏÀ©µåCSS¸¦ È°¿ëÇÑ ÄÄÆ÷³ÍÆ® ½ºÅ¸ÀϸµÀ¸·Î ¿¹»Ú°Ô µðÀÚÀÎµÈ °á°ú¹°À» ¸¸µé ¼ö ÀÖ½À´Ï´Ù. ¶ÇÇÑ ¸®¾×Æ®·Î °³¹ßÇÑ À¥ ¾ÖÇø®ÄÉÀ̼ÇÀ» Node.js¿ë ÀͽºÇÁ·¹½º ¼¹ö¿Í ¸ù°íDB µî ¹é¿£µå ±â¼ú°ú ¿¬µ¿ÇÏ´Â ¹æ¹ýµµ ´Ù·ì´Ï´Ù. À̷νá ȸ¿ø °¡ÀÔ°ú ·Î±×ÀÎ/·Î±×¾Æ¿ôÀ» ±¸ÇöÇÏ°í ¸®¾×Æ®¿Í ÇÔ²² »ç¿ëÇÏ´Â ´Ù¾çÇÑ ±â¼úÀ» ÀÀ¿ëÇØ ½Ç¹« ¼öÁØÀÇ Ç®½ºÅà ÇÁ·ÎÁ§Æ®¸¦ °æÇèÇÒ ¼ö ÀÖ½À´Ï´Ù.
¢º ±Û·Î¹ú ¼öÁØÀÇ ÄÚµå ÆÐÅÏÀ» ¹è¿ï ¼ö ÀÖ¾î¿ä!
ÀúÀÚ°¡ Á÷Á¢ ±¸ÇöÇÑ ÄÚµå ÆÐÅÏÀ» ¿³º¼ ¼ö ÀÖ½À´Ï´Ù. ÀÌ·± ÄÚµå ÆÐÅÏÀº ÀÎÅͳݿ¡¼µµ ½±°Ô ã¾Æº¼ ¼ö ¾øÁÒ. ¼ö½Ê ÁÙÀ̳ª µÇ´Â Äڵ带 ŸÀÔ½ºÅ©¸³Æ®ÀÇ ¹®¹ýÀ» ÀÌ¿ëÇØ ´Ü µÎ¼¼ ÁÙ·Î ÁÙÀδٵçÁö, ÀÚÁÖ »ç¿ëÇÏ´Â ÄÚµåµéÀ» ¾î¶»°Ô ºÐ¸®Çؼ È¿À²ÀûÀ¸·Î ÀçÈ°¿ëÇÏ´ÂÁö µîÀ» ¿¹·Î µé ¼ö ÀÖ½À´Ï´Ù. ÀÌ·¸°Ô Äڵ带 ´«À¸·Î Àб⸸ Çصµ ±¸Á¶ÀûÀÌ¸é¼ È¿À²ÀûÀÎ ±Û·Î¹ú ¼öÁØÀÇ ÄÚµå ÆÐÅÏÀ» ¹è¿ï ¼ö ÀÖ½À´Ï´Ù.
¢º ¸®¾×Æ® °³¹ßÀÚ·Î ÀÎÁ¤¹ÞÀ¸·Á¸é ²À ¾Ë¾Æ¾ß ÇÒ ÄÚµù ±â¹ýÀ» ¹è¿ö¿ä!
ÀÌ Ã¥Àº ¸®¾×Æ®¸¦ óÀ½ ¹è¿ì´Â µ¶ÀÚ¸¦ À§ÇØ ÁغñÇßÁö¸¸ ½Ã´Ï¾î °³¹ßÀÚ¿¡°Ôµµ À¯¿ëÇÑ ³»¿ëÀÌ °¡µæÇÕ´Ï´Ù. ŸÀÔ½ºÅ©¸³Æ®ÀÇ °í±Þ ¹®¹ý°ú µðÀÚÀÎ ÆÐÅÏÀ» 100% È°¿ëÇØ ¿À·ù¸¦ ¸·°í ¼º´ÉÀ» ³ôÀÏ ¼ö ÀÖ´Â Äڵ带 ¾î¶»°Ô Çϸé ÃÖ´ëÇÑ ´Ü¼øÇÏ°Ô ÀÛ¼ºÇÒ ¼ö ÀÖ´ÂÁö ¾Ë·Á ÁÝ´Ï´Ù.
¢º ÀÌ Ã¥ÀÇ ´ë»ó µ¶ÀÚ
- ¸®¾×Æ®¸¦ óÀ½ ¹è¿ì´Â Çлý ¶Ç´Â Ãë¾÷ Áغñ»ý -±âº» °³³äºÎÅÍ ½ÃÀÛÇÏ°í ½Í´Ù!
- ¸®¾×Æ®¸¦ ´Ù·ï º» °³¹ßÀÚ - ÃֽŠ±â¹ý, °í±Þ ÄÚµå ÆÐÅÏÀ» ¹è¿ö ÇÁ·ÎÁ§Æ®¿¡ ½á¸Ô°í ½Í´Ù!
¢º ÀÌÁö½ºÆÛºí¸®½Ì µ¶ÀÚ ÇнÀ Áö¿ø
¡Ø ¼Ò½º ÆÄÀÏ: ÀÌÁö½ºÆÛºí¸®½Ì ȨÆäÀÌÁö(www.easyspub.co.kr) ¡æ [ÀÚ·á½Ç]¿¡¼ Ã¥ À̸§À¸·Î °Ë»ö
¡Ø ¡®Do it! ½ºÅ͵ð·ë(cafe.naver.com/doitstudyroom)¡¯¿¡¼ ¿î¿µÇÏ´Â [Do it! °øºÎ´Ü]¿¡ Âü¿©ÇØ º¸¼¼¿ä. ÀÌ Ã¥À¸·Î °øºÎÇÏ¸ç ³ª¸¸ÀÇ ½ºÅ͵ð ³ëÆ®¸¦ ÀÛ¼ºÇϸé ÀÌÁö½ºÆÛºí¸®½Ì¿¡¼ Ãâ°£ÇÑ ´Ù¸¥ Ã¥À» ¼±¹°·Î ¹ÞÀ» ¼ö ÀÖ½À´Ï´Ù. |
|
¸ñÂ÷ |
|
================
01 ¸®¾×Æ® °³¹ß Áغñ
================
01-1 ¸®¾×Æ® ÇÁ·¹ÀÓ¿öÅ© ÀÌÇØÇϱâ
01-2 À©µµ¿ì¿¡¼ ¸®¾×Æ® °³¹ß ȯ°æ ¸¸µé±â
01-3 macOS¿¡¼ ¸®¾×Æ® °³¹ß ȯ°æ ¸¸µé±â
01-4 VSCode °³¹ß ȯ°æ ¼³Á¤Çϱâ
01-5 ù ¹ø° ¸®¾×Æ® ÇÁ·ÎÁ§Æ® ¸¸µé±â
=================
02 ¸®¾×Æ® µ¿ÀÛ ¿ø¸®
=================
02-1 °¡»ó DOM ÀÌÇØÇϱâ
02-2 JSX ±¸¹® ÀÌÇØÇϱâ
02-3 ÄÄÆ÷³ÍÆ® ÀÌÇØÇϱâ
02-4 key¿Í children ¼Ó¼º ÀÌÇØÇϱâ
02-5 À̺¥Æ® ¼Ó¼º ÀÌÇØÇϱâ
======================
03 ÄÄÆ÷³ÍÆ® CSS ½ºÅ¸Àϸµ
======================
03-1 ¸®¾×Æ® ÄÄÆ÷³ÍÆ®ÀÇ CSS ½ºÅ¸Àϸµ
03-2 Å×ÀÏÀ©µåCSS ¸®¾×Æ® ÇÁ·ÎÁ§Æ® ¸¸µé±â
03-3 CSS »óÀÚ ¸ðµ¨ ÀÌÇØÇϱâ
03-4 Ç÷º½º ·¹À̾ƿô ÀÌÇØÇϱâ
03-5 daisyui CSS ÄÄÆ÷³ÍÆ® ÀÌÇØÇϱâ
========================
04 ÇÔ¼ö ÄÄÆ÷³ÍÆ®¿Í ¸®¾×Æ® ÈÅ
========================
04-1 óÀ½ ¸¸³ª´Â ¸®¾×Æ® ÈÅ
04-2 useMemo¿Í useCallback ÈÅ ÀÌÇØÇϱâ
04-3 useState ÈÅ ÀÌÇØÇϱâ
04-4 useEffect¿Í useLayoutEffect ÈÅ ÀÌÇØÇϱâ
04-5 useRef¿Í useImperativeHandle ÈÅ ÀÌÇØÇϱâ
04-6 useContext ÈÅ ÀÌÇØÇϱâ
========================
05 »óÅ °ü¸®¿Í ¸®´ö½º ÆÐÅ°Áö
========================
05-1 ¸®´ö½º ±âº» °³³ä ÀÌÇØÇϱâ
05-2 ¸®µà¼ È°¿ëÇϱâ
05-3 ¸®´ö½º ¹Ìµé¿þ¾î ÀÌÇØÇϱâ
05-4 Æ®·¼·Î µû¶ó ¸¸µé±â
===============
06 ¸®¾×Æ® ¶ó¿ìÅÍ
===============
06-1 óÀ½ ¸¸³ª´Â ¸®¾×Æ® ¶ó¿ìÅÍ
06-2 Outlet ÄÄÆ÷³ÍÆ®¿Í Áßø ¶ó¿ìÆÃ
06-3 °ø°³ ¶ó¿ìÆ®¿Í ºñ°ø°³ ¶ó¿ìÆ® ±¸ÇöÇϱâ
===================
07 ¸ù°íDB¿Í API ¼¹ö
===================
07-1 ¸ù°íDB ÀÌÇØÇϱâ
07-2 ÇÁ·Î±×·¡¹ÖÀ¸·Î ¸ù°íDB »ç¿ëÇϱâ
07-3 ÀͽºÇÁ·¹½º ÇÁ·¹ÀÓ¿öÅ©·Î API ¼¹ö ¸¸µé±â
07-4 JSON À¥ ÅäÅ«À¸·Î ȸ¿ø ÀÎÁõ ±â´É ±¸ÇöÇϱâ
ã¾Æº¸±â |
|
|
|
|
|
|
|
Ãâ°í¾È³» |
|
|
Ãâ°í¶õ ÀÎÅÍÆÄÅ© ¹°·ùâ°í¿¡¼ µµ¼°¡ Æ÷ÀåµÇ¾î ³ª°¡´Â ½ÃÁ¡À» ¸»Çϸç, ½ÇÁ¦ °í°´´Ô²²¼ ¼ö·ÉÇϽô ½Ã°£Àº »óÇ°Áغñ¿Ï·áÇØ Ãâ°íÇÑ ³¯Â¥ + Åùè»ç ¹è¼ÛÀÏÀÔ´Ï´Ù. |
|
ÀÎÅÍÆÄÅ© µµ¼´Â ¸ðµç »óÇ°ÀÇ Àç°í°¡ ÃæÁ·ÇÒ ½Ã¿¡ ÀÏ°ý Ãâ°í¸¦ ÇÕ´Ï´Ù. |
|
ÀϺΠÀç°í¿¡ ´ëÇÑ Ãâ°í°¡ ÇÊ¿äÇÒ ½Ã¿¡´Â ´ã´çÀÚ¿¡°Ô Á÷Á¢ ¿¬¶ôÇϽðųª, °í°´¼¾ÅÍ(°í°´¼¾ÅÍ(1577-2555)·Î ¿¬¶ôÁֽñ⠹ٶø´Ï´Ù. |
|
¹è¼Ûºñ ¾È³» |
|
|
ÀÎÅÍÆÄÅ© µµ¼ ´ë·®±¸¸Å´Â ¹è¼Û·á°¡ ¹«·áÀÔ´Ï´Ù. |
|
´Ü, 1°³ÀÇ »óÇ°À» ´Ù¼öÀÇ ¹è¼ÛÁö·Î ÀÏ°ý ¹ß¼Û½Ã¿¡´Â 1°³ÀÇ ¹è¼ÛÁö´ç 2,000¿øÀÇ ¹è¼Ûºñ°¡ ºÎ°úµË´Ï´Ù. |
¾Ë¾ÆµÎ¼¼¿ä! |
|
|
°í°´´Ô²²¼ ÁÖ¹®ÇϽŠµµ¼¶óµµ µµ¸Å»ó ¹× ÃâÆÇ»ç »çÁ¤¿¡ µû¶ó Ç°Àý/ÀýÆÇ µîÀÇ »çÀ¯·Î Ãë¼ÒµÉ ¼ö ÀÖ½À´Ï´Ù. |
|
Åùè»ç ¹è¼ÛÀÏÀÎ ¼¿ï ¹× ¼öµµ±ÇÀº 1~2ÀÏ, Áö¹æÀº 2~3ÀÏ, µµ¼, »ê°£, ±ººÎ´ë´Â 3ÀÏ ÀÌ»óÀÇ ½Ã°£ÀÌ ¼Ò¿äµË´Ï´Ù.
(´Ü, Åä/ÀÏ¿äÀÏ Á¦¿Ü) |
|
|
|
|
ÀÎÅÍÆÄÅ©µµ¼´Â °í°´´ÔÀÇ ´Ü¼ø º¯½É¿¡ ÀÇÇÑ ±³È¯°ú ¹ÝÇ°¿¡ µå´Â ºñ¿ëÀº °í°´´ÔÀÌ ÁöºÒÄÉ µË´Ï´Ù.
´Ü, »óÇ°À̳ª ¼ºñ½º ÀÚüÀÇ ÇÏÀÚ·Î ÀÎÇÑ ±³È¯ ¹× ¹ÝÇ°Àº ¹«·á·Î ¹ÝÇ° µË´Ï´Ù.
±³È¯/¹ÝÇ°/º¸ÁõÁ¶°Ç ¹× Ç°Áúº¸Áõ ±âÁØÀº ¼ÒºñÀڱ⺻¹ý¿¡ µû¸¥ ¼ÒºñÀÚ ºÐÀï ÇØ°á ±âÁØ¿¡ µû¶ó ÇÇÇظ¦ º¸»ó ¹ÞÀ» ¼ö ÀÖ½À´Ï´Ù.
Á¤È®ÇÑ È¯ºÒ ¹æ¹ý ¹× ȯºÒÀÌ Áö¿¬µÉ °æ¿ì 1:1¹®ÀÇ °Ô½ÃÆÇ ¶Ç´Â °í°´¼¾ÅÍ(1577-2555)·Î ¿¬¶ô Áֽñ⠹ٶø´Ï´Ù.
¼ÒºñÀÚ ÇÇÇغ¸»óÀÇ ºÐÀïó¸® µî¿¡ °üÇÑ »çÇ×Àº ¼ÒºñÀÚºÐÀïÇØ°á±âÁØ(°øÁ¤°Å·¡À§¿øȸ °í½Ã)¿¡ µû¶ó ºñÇØ º¸»ó ¹ÞÀ» ¼ö ÀÖ½À´Ï´Ù.
|
±³È¯ ¹× ¹ÝÇ°ÀÌ °¡´ÉÇÑ °æ¿ì |
|
|
»óÇ°À» °ø±Þ ¹ÞÀ¸½Å ³¯·ÎºÎÅÍ 7ÀÏÀ̳» °¡´ÉÇÕ´Ï´Ù. |
|
°ø±Þ¹ÞÀ¸½Å »óÇ°ÀÇ ³»¿ëÀÌ Ç¥½Ã, ±¤°í ³»¿ë°ú ´Ù¸£°Å³ª ´Ù¸£°Ô ÀÌÇàµÈ °æ¿ì¿¡´Â °ø±Þ¹ÞÀº ³¯·ÎºÎÅÍ 3°³¿ùÀ̳», ±×»ç½ÇÀ» ¾Ë°Ô µÈ ³¯ ¶Ç´Â ¾Ë ¼ö ÀÖ¾ú´ø ³¯·ÎºÎÅÍ 30ÀÏÀ̳» °¡´ÉÇÕ´Ï´Ù. |
|
»óÇ°¿¡ ¾Æ¹«·± ÇÏÀÚ°¡ ¾ø´Â °æ¿ì ¼ÒºñÀÚÀÇ °í°´º¯½É¿¡ ÀÇÇÑ ±³È¯Àº »óÇ°ÀÇ Æ÷Àå»óÅ µîÀÌ ÀüÇô ¼Õ»óµÇÁö ¾ÊÀº °æ¿ì¿¡ ÇÑÇÏ¿© °¡´ÉÇÕ´Ï´Ù.
|
|
|
|
±³È¯ ¹× ¹ÝÇ°ÀÌ ºÒ°¡´ÉÇÑ °æ¿ì |
|
|
|
°í°´´ÔÀÇ Ã¥ÀÓ ÀÖ´Â »çÀ¯·Î »óÇ° µîÀÌ ¸ê½Ç ¶Ç´Â ÈÑ¼ÕµÈ °æ¿ì´Â ºÒ°¡´ÉÇÕ´Ï´Ù. (´Ü, »óÇ°ÀÇ ³»¿ëÀ» È®ÀÎÇϱâ À§ÇÏ¿© Æ÷Àå µîÀ» ÈѼÕÇÑ °æ¿ì´Â Á¦¿Ü) |
|
½Ã°£ÀÌ Áö³²¿¡ µû¶ó ÀçÆǸŰ¡ °ï¶õÇÒ Á¤µµ·Î ¹°Ç°ÀÇ °¡Ä¡°¡ ¶³¾îÁø °æ¿ì´Â ºÒ°¡´ÉÇÕ´Ï´Ù. |
|
Æ÷Àå °³ºÀµÇ¾î »óÇ° °¡Ä¡°¡ ÈÑ¼ÕµÈ °æ¿ì´Â ºÒ°¡´ÉÇÕ´Ï´Ù. |
|
|
´Ù¹è¼ÛÁöÀÇ °æ¿ì ¹ÝÇ° ȯºÒ |
|
|
|
´Ù¹è¼ÛÁöÀÇ °æ¿ì ´Ù¸¥ Áö¿ªÀÇ ¹ÝÇ°À» µ¿½Ã¿¡ ÁøÇàÇÒ ¼ö ¾ø½À´Ï´Ù. |
|
1°³ Áö¿ªÀÇ ¹ÝÇ°ÀÌ ¿Ï·áµÈ ÈÄ ´Ù¸¥ Áö¿ª ¹ÝÇ°À» ÁøÇàÇÒ ¼ö ÀÖÀ¸¹Ç·Î, ÀÌÁ¡ ¾çÇØÇØ Áֽñ⠹ٶø´Ï´Ù. |
|
|
|
|
|
|