Frontend ๐Ÿ“š/React

[React]Instagram Clone - 17. ํ”„๋กœ์ ํŠธ ์™„์„ฑ ๋ฐ ํšŒ๊ณ 

leejaejae 2025. 2. 13. 17:35

1. ํด๋ผ์ด์–ธํŠธ ๊ธฐ๋Šฅ ๋ช…์„ธ

 

2. ์ฃผ์š” ์›น ํ™”๋ฉด ๊ตฌํ˜„

โ‘  ํšŒ์›๊ฐ€์ž…

โ‘ก ์†Œ์…œ ๋กœ๊ทธ์ธ

โ‘ข ๋กœ๊ทธ์ธ

โ‘ฃ ํ™ˆ ํ™”๋ฉด

โ‘ค ํ™ˆ ํ™”๋ฉด - ๊ฒŒ์‹œ๋ฌผ ์ˆ˜์ •/์‚ญ์ œ

โ‘ฅ ๋งˆ์ดํŽ˜์ด์ง€

โ‘ฆ ๊ฒŒ์‹œ๋ฌผ ์—…๋กœ๋“œ

โ‘ง ๋ฉ”์„ธ์ง€

 

3. ๋ฐฐํฌ ๋ฐ ๊ธฐ์ˆ  ๋ฌธ์„œ

๐Ÿ“๋ฐฐํฌ url

https://instagram-clone-client-lr01.onrender.com/auth/login

๐Ÿ“๊ธฐ์ˆ  ๋ฌธ์„œ

https://spectacled-azimuth-86e.notion.site/SSinstagram-18f05e45325f807fbbc2cbb8f0c20747?pvs=74

๐Ÿ“๊นƒ ์ฃผ์†Œ

https://github.com/SeungjaeLee00/Instagram_Clone

๐Ÿ“ํ”„๋กœ์ ํŠธ ํฌํŠธํด๋ฆฌ์˜ค

SSinstagram.pdf
10.98MB

 

4. ํšŒ๊ณ 

10์›” 4์ผ๋ถ€ํ„ฐ ์‹œ์ž‘ํ•ด์„œ 1์›” 22์ผ๊นŒ์ง€. ์•ฝ 4๊ฐœ์›” ๋™์•ˆ์˜ ํ”„๋กœ์ ํŠธ๊ฐ€ ๋๋‚ฌ๋‹ค. ํ’€์Šคํƒ ๊ฐœ๋ฐœ์ž๋กœ์„œ ์•„~ ๋“ค์–ด๋ดค์–ด์š”~ ํ•  ์ •๋„๋กœ๋Š” ํ”„๋กœ์ ํŠธ์— ์ ์šฉํ•˜๊ณ  ์‹ถ์—ˆ๊ธฐ ๋•Œ๋ฌธ์— ์˜ˆ์ƒํ–ˆ๋˜ ์‹œ๊ฐ„๋ณด๋‹ค ์ œ๋ฒ• ์˜ค๋ž˜ ๊ฑธ๋ ธ์ง€๋งŒ (์ฒ˜์Œ์—” 2๋‹ฌ ์˜ˆ์ƒํ•จใ…‹ใ…‹) ํฌ๊ธฐํ•˜์ง€ ์•Š๊ณ  ๋ฐฐํฌ๊นŒ์ง€ ํ–ˆ๋‹ค๋Š” ๊ฒŒ ๋งˆ์Œ์— ๋“ ๋‹ค.

์•„๋ฌดํŠผ,, ์•„์‰ฌ์šด ์ ์ด๋ผ๋ฉด,, ๋˜.,,. ๋ธ”๋กœ๊ทธ์— ์ฝ”๋“œ ๊ธฐ๋ก์„ ํ•˜์ง€ ์•Š๊ณ  ๊ฐœ๋ฐœํ–ˆ๋‹ค๋Š” ์ ์ด๋‹ค. ์ฉ

์ €๋ฒˆ์—๋„ ๊ฐ™์€ ์ ์„ ๋ฐ˜์„ฑํ•ด์„œ ์„œ๋ฒ„ ์ชฝ์€ ์ œ๋ฒ• ์—ด์‹ฌํžˆ ์ ์€ ๊ฒƒ ๊ฐ™์•˜๋Š”๋ฐ, ํด๋ผ์ด์–ธํŠธ๋กœ ๋„˜์–ด๊ฐ€๋ฉด์„œ ํด๋ผ์ด์–ธํŠธ๋งŒ ๊ฐœ๋ฐœํ•˜๋Š” ๊ฒŒ ์•„๋‹ˆ๋ผ ๋งŒ์•ฝ API ์‘๋‹ต๊ฐ’์ด ๋” ํ•„์š”ํ•˜๋ฉด ๋‹ค์‹œ ์„œ๋ฒ„ ์ฝ”๋“œ ๊ณ ์น˜๊ณ  ํ”„๋ก ํŠธ๋กœ ๋Œ์•„์˜ค๊ณ (์ด๊ฒŒ..์• ์ž์ผ?ํ‘ํ‘).. ์ด๋Ÿฐ ์‹์œผ๋กœ ์ง„ํ–‰ํ•ด์„œ ์ ์  ๊ธฐ๋กํ•˜๋Š” ๊ฑธ ์žŠ๊ธฐ ์‹œ์ž‘ํ–ˆ๋‹ค.. ๋ญ ์ด๋ ‡๊ฒŒ ๋ชจ๋“  ์ฝ”๋“œ๋ฅผ ๋‚ด ๋ง˜๋Œ€๋กœ ๊ทธ๋•Œ๊ทธ๋•Œ ์ˆ˜์ •ํ•  ์ˆ˜ ์žˆ๋Š” ๊ฒŒ ํ’€์Šคํƒ์˜ ์žฅ์ ์ด๋ผ๊ณ  ์ƒ๊ฐํ•˜๊ธด ํ•˜์ง€๋งŒ.. ๋‹ค์Œ๋ถ€ํ„ด ๋‹ค์‹œ ๊ธฐ๋ก์„ ์ž˜ ํ•ด์•ผ๊ฒ ๋‹ค ๋‹ค์งํ•˜๋Š” ๋‚˜๋‹ค..๐Ÿฅฒ

๊ทธ๋ž˜๋„ ๋ถˆํ–‰ ์ค‘ ๋‹คํ–‰์€.. Swagger ๋ผ๋˜์ง€.. ํด๋ผ์ด์–ธํŠธ ๊ธฐ์ˆ  ๋ช…์„ธ์„œ๋ฅผ ๊ผฌ๋ฐ•๊ผฌ๋ฐ• ์ž‘์„ฑํ–ˆ๋‹ค. ์ฝ”๋“œ ๋ฆฌ๋ทฐ๋ฅผ ์ „๋ถ€ ๋‹ค ํ•  ์ˆ˜ ์—†์–ด์„œ ์•„์‰ฝ์ง€๋งŒ ๊ทธ๋ž˜๋„ ๋ช…์„ธ๊ฐ€ ์žˆ์œผ๋‹ˆ๊น.

์•ž์œผ๋กœ๋Š” ์‹ค์ œ ๋Œ€๊ทœ๋ชจ ํŠธ๋ž˜ํ”ฝ ์ฒ˜๋ฆฌ๋‚˜ ์ตœ์ ํ™” ๊ฐ™์€ ๊ฑธ ๊ณต๋ถ€ํ•ด์„œ ์ ์šฉํ•ด ๋ณด๊ณ  ์‹ถ๋‹ค. ๋ฌด์—‡๋ณด๋‹ค ํด๋ผ์šฐ๋“œ๋ฅผ ๊ธฐ๋ฐ˜์œผ๋กœ ํ•ด์„œ ๋Œ€์šฉ๋Ÿ‰ ํŠธ๋ž˜ํ”ฝ์„ ์ฒ˜๋ฆฌํ•˜๊ฒŒ ๋œ๋‹ค๋ฉด ํ›จ์”ฌ ๋” ๋งŽ์€ ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์„ ๊ณ ๋ คํ•  ์ˆ˜ ์žˆ์ง€ ์•Š์„๊นŒ ์‹ถ๋‹ค. 

๊ทธ๋ฆฌ๊ณ  ๋ณด์•ˆ๋„ ์กฐ๊ธˆ ๋” ๊ณต๋ถ€ํ•˜๋ ค๊ณ  ํ•œ๋‹ค. ์ด๋ฒˆ ํ”„๋กœ์ ํŠธ์—์„œ ์‚ฌํŒŒ๋ฆฌ์—์„œ ๋ฐœ์ƒํ•˜๋Š” ์ฟ ํ‚ค ์ €์žฅ ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•˜์ง€ ๋ชปํ–ˆ๋‹ค. ์„œ๋ฒ„์™€ ํด๋ผ์ด์–ธํŠธ ๋ฐฐํฌ ๋„๋ฉ”์ธ์ด ์„œ๋กœ ๋‹ฌ๋ผ ๋ฐœ์ƒํ•œ ๋ฌธ์ œ์˜€๋‹ค. ํ•˜์ง€๋งŒ ๋‚œ ์•„์ง ํ•™์ƒ์ธ ๊ด€๊ณ„๋กœ (๊ฐ™์€ ๋„๋ฉ”์ธ ์“ฐ๋ ค๋ฉด ๋ˆ ๋‚ด๊ณ  ์‚ฌ์•ผ ํ•จ ์ฉ) ๋‹ค๋ฅธ ๋ฐฉ๋ฒ•์„ ์ฐพ์œผ๋ ค ํ–ˆ๋Š”๋ฐ ๊ฒฐ๋ก ์€.. ๋” ๊ณต๋ถ€๊ฐ€ ํ•„์š”ํ•˜๋‹ค์˜€๋‹ค..!