๐ ๋ก๊ทธ์ธ-ํ์๊ฐ์ ๊ตฌํ ์์งค
Pinterest clone Project
Winnerest
์ด 5๋ช ์ด์ ๊ตฌ์ฑ๋ Winnerest ( FE : 3, BE : 2 )์์
2์ฃผ๊ฐ ์ค๋ก์ง ํ์ต์ฉ์ผ๋ก ํด๋ก ์ ์ด์ฌํ ๊ตฌํํ๋๋ฐ
๊ทธ ์ค ๋ก๊ทธ์ธ ํ์ด์ง / ๋ฉ์ธ ํ์ด์ง / ๋ง์ด ํ์ด์ง ๊ตฌํ์ ๋งก์ ๊ธฐ๋ก์ ์ ์ด๋ณด๋ คํ๋ค
๊ทธ ์ค ๋ก๊ทธ์ธ ์ฐฝ ํธ
๊ตฌํํ ๊ธฐ๋ฅ
- ์นด์นด์ค API๋ฅผ ํตํ ๋ก๊ทธ์ธ ๊ธฐ๋ฅ ๊ตฌํ
- ํ์ ๋๋ค์, ํ๋กํ ์ฌ์ง, ์นด์นด์ค๊ณ์ (์ด๋ฉ์ผ) ๋ฅผ ๋ฐ์ ๊ฐ๊ฐ ํ์ํ ์ ์ ์ ๋ณด ํ์ด์ง์ ์ ์ฉ
์นด์นด์ค ๋ก๊ทธ์ธ API๋ฅผ ์ฌ์ฉํ๊ธฐ ์ํด์๋
https://developers.kakao.com/ ์ ๋ค์ด๊ฐ
๋จผ์ ๋ด ์ฑ ์ ํ๋ฆฌ์ผ์ด์ ์ ๋ง๋ค์ด์ผํ๋ค.
์ด๋ ๋ฐ๊ธ ๋ฐ์ REST API ๋ javaScript ํค๋ฅผ ์ด์ฉํด ๊ตฌํํ๋ค.
์นด์นด์ค API ๊ตฌ์กฐ๋ ์๊ฐ๋ณด๋ค ๊ฐ๋จํ๋ค
ํ๋ก ํธ ์๋๊ฐ ์ธ๊ฐ ์ฝ๋๋ฅผ ์นด์นด์ค ์๋ฒ์ ์์ฒญํ๊ณ ํ์๊ฐ์ ์ ์ฐจ๋ฅผ ๋ง์น๋ฉด
๋ค์ (ํ๋ก ํธ/๋ฐฑ์๋)๋ก ์ธ๊ฐ ์ฝ๋๋ฅผ ์ ๋ฌํ๋ค
์ธ๊ฐ ์ฝ๋๋ฅผ ๋ฐ์ (ํ๋ก ํธ/๋ฐฑ์๋)๋ ์ธ๊ฐ ์ฝ๋๋ฅผ ๋ด์ ๋ค์ ์นด์นด์ค ์๋ฒ์ ์์ฒญํด์ ํ ํฐ์ ๋ฐ๊ธ ๋ฐ๊ณ
์๋ฒ๊ฐ ์ด ํ ํฐ ์ ํจ์ฑ์ ๊ฒ์ฆํ์ฌ ํ์๊ฐ์ /๋ก๊ทธ์ธ ์ ์ฐจ๋ฅผ ๋ง์น๋ค
๋ก๊ทธ์ธ ์ฐฝ์ ๊ตฌํํ๋ฉด์ ๋ฐฑ์๋ ์๋ฒ๊ฐ ์๋ ํ๋ก ํธ ์๋ ์ชฝ์์ ์นด์นด์ค์๊ฒ ์ธ๊ฐ ์ฝ๋ ๋ฐ๊ธ, ํ ํฐ ๋ฐ๊ธ ์์ฒญ์ ๋ ๋ฒํ๋ ๋ฐฉ์์ผ๋ก ์งํํ๊ฒ ๋์๋ค.
์ฒ์์ REST API๋ฅผ ์จ์ URl์ ์ธ๊ฐ ์ฝ๋๋ฅผ ๋ฐ์์ค๋ ๊ฒ๊น์ง ์ฑ๊ณตํ์ผ๋
๊ทธ ์ดํ ์ฝ๋๋ฅผ ๊ธฐ๋ฐ์ผ๋ก ํ ํฐ์ ๋ค์ ์์ฒญํ๋ ์ผ์ด ๊น๋ค๋ก์ ๋ค
๊ทธ๋๋ง๋ค ์นด์นด์ค์์ ์๋ฌ ๋ฉ์ธ์ง๋ฅผ ๋์์ฃผ๊ณ ์๋ฌ๊ฐ ์ ๋ฆฌ๋์ด์๋ ํ์ด์ง๋ฅผ ๋ณด์ฌ์ฃผ๋๋ฐ
๊ทธ๊ณณ์๋ ์๋ ์๋ฌ๊ฐ ์๊พธ ๋ ์ ๋นํฉ์ค๋ฌ์ ๋ค ๐
๋ฐฑ์๋ ํ์์๋ ๋ก๊ทธ์ธ ๊ด๋ จ ๋ก์ง์ ์ผ๋ฅธ ๋๋ด์ผ ๋ค๋ฅธ ๊ตฌํ์ ์ ๊ฒฝ์ ์์ ์ ์๊ณ
๋ค๋ฅธ ํ์ด์ง๋ ๋น ๋ฅด๊ฒ ๊ตฌํํด์ผํ๊ธฐ ๋๋ฌธ์
์ด์ฉ ์ ์์ด jsํค๋ก ์ธ๊ฐ์ฝ๋์ ํ ํฐ์ ํ๋ฒ์ ๋ฐ์์ค๋ ๋ก์ง์ ์ผ๋ค
์ผ๋จ ์ฒซ๋ฒ์งธ๋ก index.html ํ์ผ์ ์ด ์ฃผ์๋ฅผ ๋ฃ๊ณ
๋ก์ง์ ๋ฐ๋ก ์ปดํฌ๋ํธ๋ก ๋นผ์ ๊ด๋ฆฌํ๋ค
์นด์นด์ค ํค๋ env ํ์ผ์ ๋ฐ๋ก ๋นผ์ git ์ฌ๋ผ๊ฐ์ง ์๋๋ก ํด์ฃผ์๊ณ
ํ๋ฒ์ ์์ฒญ์ผ๋ก ์นด์นด์ค ์๋ฒ์๊ฒ์๋ถํฐ ํ ํฐ์ ๋ฐ์์
๊ทธ๊ฑธ ํ์ ๋ฐฑ์๋ ์๋ฒ๋ก ๋ณด๋ด๊ณ ๋ค์ ํ ํฐ์ ๋ฐ์์๋ค
๋๋์
์ด๋ ต์ง ์๊ฒ ๋ณด์๋ ์นด์นด์ค ๋ก๊ทธ์ธ API๊ฐ ์ ์ฉํ๋ ค๋ ์๊ฐ๋ณด๋ค ๊น๋ค๋ก์์ ํผ๋ฌ๋ค
๊ฒฐ๊ทน ์ด๋ ๊ฒ ํด์ ํต์ ์ ์ด๋ ต์ฌ๋ฆฌ ์ฑ๊ณตํ์ง๋ง
Rest URL์ ์ฌ์ฉํ์ง ๋ชปํด ์ด๋ ค๋ชจ๋ก ์์ฌ์ด ์์ ์ด์๋ค
๐ ๊ตฌํ์ ์ด Img ( ๋ฐฐ๊ฒฝ, ๋ก๊ทธ์ธ ๋ฒํผ)
๋ก๊ทธ์ธ ๋ฒํผ์ ์นด์นด์ค API ๊ณตํ์ ๋ค์ด๊ฐ๋ฉด ํฌ๊ธฐ๋ณ๋ก ๋ค์ด ๋ฐ์ ์ ์๋ค!
'WINNEREST Project' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
Winnerest ๋ฉ์ธ ํ์ด์ง ๋ฆฌํฉํ ๋ง(Observer ๋ฌดํ์คํฌ๋กค) (0) | 2023.01.08 |
---|---|
Winnerest ๋ง์ด ํ์ด์ง ๊ตฌํ (0) | 2022.09.10 |
Winnerest Project ํ๊ณ ๋ก (4) | 2022.09.09 |
Winnerest ๋ฉ์ธ ํ์ด์ง ๊ตฌํ (๋ฌดํ ์คํฌ๋กค, Intersection Observer) (0) | 2022.09.03 |
๋๊ธ