๐ŸŽ„ ์„ฑ์žฅ์ผ์ง€ 5.0

์ฑ… ํ–‰๋ณตํ•œ ์ด๊ธฐ์ฃผ์˜์ž(์›จ์ธ ๋‹ค์ด์–ด)์˜ ๋‚ด์šฉ์— ์ž๊ทน๋ฐ›์•„ ์‹œ์ž‘ํ•˜๋Š” ์†Œ๋ฐ•ํ•œ ์„ฑ์žฅ๊ธฐ๋ก

์‚ด์•„์žˆ๋Š” ๊ฝƒ๊ณผ ์ฃฝ์€ ๊ฝƒ์€ ์–ด๋–ป๊ฒŒ ๊ตฌ๋ณ„ํ•˜๋Š”๊ฐ€?
์„ฑ์žฅํ•˜๊ณ  ์žˆ๋Š” ๊ฒƒ์ด ์‚ด์•„ ์žˆ๋Š” ๊ฒƒ์ด๋‹ค.
์ƒ๋ช…์˜ ์œ ์ผํ•œ ์ฆ๊ฑฐ๋Š” ์„ฑ์žฅ์ด๋‹ค!

๐ŸŒพ (4.0)ํ•™์Šต ํ‚ค์›Œ๋“œ์—์„œ ์ตœ๋Œ€ํ•œ ๊ฐ„๋‹จํ•œ ์ •๋ณด ์ œ๊ณต, ๊ณ ๋ฏผ์—์„œ ๋‚ด ๊ฒฝํ—˜์„ ์ž์„ธํžˆ ์ ์ž!
๐ŸฅŠ (5.0)ํ•™์Šต ํ‚ค์›Œ๋“œ๋Š” ํ•œ์ค„์˜ ํ•ต์‹ฌ์œผ๋กœ๋งŒ ์ •๋ฆฌ, ์„ฑ๊ณต/์‹คํŒจ ์ผ์ง€ ์ž‘์„ฑํ•˜๊ธฐ! ์ด ๋•Œ, ์‹คํŒจ์˜ ๊ฒฝํ—˜์€ ์ž์„ธํžˆ ์ ๊ธฐ!

๐Ÿ”‘ ์˜ค๋Š˜์˜ ํ•™์Šต ํ‚ค์›Œ๋“œ

axios

์ด์ „์—๋Š” axios๋ฅผ ์ปค์Šคํ…€ ๊ฐ€๋Šฅํ•œ fetch ์ •๋„๋กœ ์ƒ๊ฐํ–ˆ๋Š”๋ฐ, axios ๊ณต์‹๋ฌธ์„œ์—์„œ interceptor๋ฅผ ๋ณด๊ณ  ๊นœ์ง ๋†€๋ž๋‹ค. ๋ญ”๊ฐ€ fetch์™€ Proxy ํŒจํ„ด(ํ˜น์€ js์˜ Proxy ๊ฐ์ฒด) ํ•ฉ์นœ ๊ฒƒ ๊ฐ™์€๋ฐ, ์ถ”ํ›„์— ์•„์ฃผ ๊ฐ„๋‹จํ•˜๊ฒŒ๋ผ๋„ ๊ตฌํ˜„ํ•ด๋ด์•ผ๊ฒ ๋‹ค.

props drilling

์•„ํ† ๋ฏน ๋””์ž์ธ์œผ๋กœ ์ž‘์€ ๋‹จ์œ„์˜ ์ปดํฌ๋„ŒํŠธ๋“ค์„ ๊ฐœ๋ฐœํ•˜๊ณ  ์žˆ๋‹ค. ๊ฑฐ๊ธฐ์— styled-components๋ฅผ ์ ์šฉํ•˜๋‹ค๋ณด๋‹ˆ, ์ปดํฌ๋„ŒํŠธ์˜ props๊ฐ€ ๋„ˆ๋ฌด ๋งŽ์•„์ง€๋Š” ๊ฒƒ ๊ฐ™๋‹ค. ๊ทธ๋Ÿฌ๋ฉด์„œ ์ž์—ฐ์Šค๋ ˆ drilling ์‹œ์ผœ์ค˜์•ผํ•˜๋Š” ๊ฐ’๋“ค๋„ ๋งŽ์•„์ง€๊ณ  ์ข€ ํ—ท๊ฐˆ๋ฆฌ๊ธฐ ์‹œ์ž‘ํ–ˆ๋‹ค. ์ด ๋ถ€๋ถ„์— ๋Œ€ํ•ด์„œ ์ฝ”๋“œ๋ฅผ ๊ฐœ์„ ํ•˜๊ณ  ์ƒํƒœ ๊ด€๋ฆฌ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์˜ ์†Œ์ค‘ํ•จ์„ ๋Š๊ปด์•ผ๊ฒ ๋‹คโ€ฆ

recoil ๊ตฌํ˜„ํ•ด๋ณด๊ธฐ

๋Œ€๋žต์ ์ธ recoil์˜ ์ปจ์…‰(?)์€ ์•Œ๊ฒ ๋‹ค. ๊ทธ๋ž˜์„œ ํ•ด๋‹น ์ปจ์…‰์œผ๋กœ ref์™€ context๋ฅผ ์‚ฌ์šฉํ•ด์„œ ๊ฐ„๋‹จํ•˜๊ฒŒ ๊ตฌํ˜„์„ ํ•ด๋ณด์•˜๋‹ค. ๊ทธ๋Ÿฐ๋ฐโ€ฆ ๋‚ด๊ฐ€ ์ƒ๊ฐํ•œ๋Œ€๋กœ ์ž‘๋™ํ•˜์ง€ ์•Š๋Š”๋‹ค ใ…Žใ…Žใ…Žใ…Žใ…Ž ์ข€๋” ๋‹ค๋“ฌ์–ด์„œ ์„ฑ๊ณตํ•˜๋ฉด ๋”ฐ๋กœ ๋บด์„œ ์ •๋ฆฌ๊ธ€์„ ๋‘ฌ์•ผ๊ฒ ๋‹ค. ใ…Žใ…Ž

์˜ค๋Š˜์˜ ์„ฑ๊ณต

  • ๊ณตํ†ต ์ปดํฌ๋„ŒํŠธ ๊ฐœ๋ฐœ ์™„๋ฃŒ
  • axios ๊ณต๋ถ€ํ•œ ๊ฒƒ
  • recoil ๊ตฌํ˜„ ์‹œ๋„ํ•ด๋ณธ ์ 

์˜ค๋Š˜์˜ ์‹คํŒจ

  • ์ด๋ ฅ์„œ ํ”„๋กœ์ ํŠธ ์‹œ์ž‘ ๋ชปํ•œ ์ โ€ฆ(์ผ๋‹จ pdf๋„ ์žˆ์–ด์•ผ๋ ๋“ฏ!!!)
  • ์ˆ˜๋ฉด ์‹œ๊ฐ„์ด ๋„ˆ๋ฌด ์ ์—ˆ๋˜ ์ 
  • recoil ๊ตฌํ˜„ ์‹คํŒจํ•œ ์  => ์™œ ์•ˆ๋ ๊นŒ..?

๐Ÿ“ ์š”์•ฝ ๋ฐ ํ•˜๋ฃจ ๊ฐ„๋‹จ ํšŒ๊ณ 

์ง„์งœ ์กฐ๊ธˆ๋งŒ ์•„์ฃผ ์กฐ๊ธˆ๋งŒ ๋” ์š•์‹ฌ๋‚ด์ž. ์ง€๊ธˆ๋„ ์ž˜ํ•˜๊ณ  ์žˆ๋‹ค! ๊ทธ๋ ‡์ง€๋งŒ ๋”๋”๋” ์ž˜ํ•  ์ˆ˜ ์žˆ๊ฒŒ ๋…ธ๋ ฅํ•ด๋ณด๋ฉด ์ข‹์„ ๊ฒƒ ๊ฐ™๋‹ค!

์ฐธ๊ณ