[TIL๐Ÿ”ฅ] Day22(9/7)

๊น€๋‹ค์Šฌยท2021๋…„ 9์›” 7์ผ
1

Today I Learned

๋ชฉ๋ก ๋ณด๊ธฐ
18/22
post-thumbnail

Introduction

์˜ค๋Š˜์€ ๋‚ด๊ฐ€ ๋งŒ๋“  ํ”„๋กœ์ ํŠธ๋ฅผ ๋ฐฐํฌํ•  ์ˆ˜ ์žˆ๋Š” ์—ฌ๋Ÿฌ ๋ฐฉ๋ฒ•๋“ค์— ๋Œ€ํ•ด ๋ฐฐ์› ๋‹ค.
์‚ฌ์‹ค ์–ด์ œ ํŒ€์›๋“ค ์ค‘ ํ•œ ๋ถ„์ด ๋…ธ์…˜ ํ”„๋กœ์ ํŠธ๋ฅผ AWS s3+cloudfront๋ฅผ ์ด์šฉํ•ด ๋ฐฐํฌํ•˜์…”์„œ ์šฐ๋ฆฌ์—๊ฒŒ ๊ทธ ๋ฐฉ๋ฒ•์„ ์•Œ๋ ค์ฃผ์…จ๋‹ค.
๋„๋ฉ”์ธ ์‚ฌ๋Š” ๋ฐฉ๋ฒ•, ๊ฐ์ข… ์„ค์ •๋“ค...๋„ˆ๋ฌด ์ž์„ธํ•˜๊ฒŒ ์•Œ๋ ค์ฃผ์…”์„œ ๋ฐฐํฌ์— ์„ฑ๊ณตํ•  ์ˆ˜ ์žˆ์—ˆ๋‹ค. ์ข…ํ˜„๋‹˜ ๋‹ค์‹œ ํ•œ๋ฒˆ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค~~๐Ÿ™‡๐Ÿปโ€โ™€๏ธ
๋”ฑ ๋งž์ถฐ ๊ฐ•์‚ฌ๋‹˜๊ป˜์„œ ์šฐ๋ฆฌ๊ฐ€ ๋ฐฐํฌ์— ์–ด๋ ค์›€์„ ๊ฒช๋Š” ๊ฒƒ์„ ์•Œ๊ณ  ๋”ฐ๋กœ ๋ฐฐํฌ ๊ด€๋ จ ๊ฐ•์˜๋ฅผ ํ•ด์ฃผ์…จ๋‹ค...์ง„์งœ ์ตœ๊ณ ๋‹ค...๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค ๋กœํ† ๋‹˜ ๐Ÿ‘


์˜ค๋Š˜ ์ƒˆ๋กญ๊ฒŒ ๋ฐฐ์šด ๊ฒƒ

ํ”„๋กœ์ ํŠธ ๋ฐฐํฌํ•ด๋ณด๊ธฐ
- EC2
- AWS s3 + cloudfront
- github pages
- Firebase
- Netlify
- Vercel

์—ฌ๋Ÿฌ ๋ฐฉ๋ฒ•๋“ค์„ ๋ฐฐ์›Œ๋ณด๋‹ˆ Netlify์™€ Vercel์ด ๊ฐ€์žฅ ์‚ฌ์šฉํ•˜๊ธฐ ํŽธ๋ฆฌํ–ˆ๋˜ ๊ฒƒ ๊ฐ™๋‹ค.
๋‹ค๋ฅธ ๋ฐฉ๋ฒ•๋“ค์€ ์•„์ง ์ต์ˆ™์น˜์•Š์•„ ์ข€ ๋” ๊ณต๋ถ€๋ฅผ ํ•˜๊ณ  ์—ฐ์Šตํ•ด ๋ณผ ์˜ˆ์ •์ด๋‹ค.

Vercel์„ ์ด์šฉํ•ด ๋ฐฐํฌํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ์ฐจ๊ทผ์ฐจ๊ทผ ์•Œ์•„๋ณด์ž!!!


Vercel๋กœ ๋ฐฐํฌํ•˜๊ธฐ

1. Vercel ์ ‘์†ํ•ด์„œ ๊นƒํ—ˆ๋ธŒ์™€ ์—ฐ๋™ํ•˜๊ธฐ

2. Create a New Project ํด๋ฆญ ํ›„ Vercel์„ ์„ค์น˜ํ•  ๊นƒํ—ˆ๋ธŒ ๊ณ„์ • ์„ ํƒ

3. ๋ฐฐํฌํ•  repository importํ•˜๊ธฐ

4. Team ์ƒ์„ฑ Skipํ•˜๊ธฐ

  • Team์„ ์ƒ์„ฑํ•˜๋ฉด ๋น„์šฉ์ด ์ฒญ๊ตฌ๋  ์ˆ˜๋„ ์žˆ๋‹ค๊ณ  ํ•˜๋‹ˆ ๊ผญ ์ฃผ์˜ํ•˜์ž!!!

5. ํ”„๋กœ์ ํŠธ๋ฅผ ์ง„ํ–‰ํ•œ ํ”„๋ ˆ์ž„์›Œํฌ ์„ ํƒํ•˜๊ธฐ

  • ๋”ฐ๋กœ ํ”„๋ ˆ์ž„์›Œํฌ๋ฅผ ์‚ฌ์šฉํ•˜์ง€์•Š์•˜๊ธฐ ๋•Œ๋ฌธ์— other ์„ ํƒ

6. Deploy ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๊ณ  ๊ธฐ๋‹ค๋ฆฌ๋ฉด ๋ฐฐํฌ ์„ฑ๊ณต!!!๐Ÿฅณ๐Ÿฅณ๐Ÿฅณ

7. ๋ฐฐํฌ๋œ ํ™”๋ฉด์„ ๋ˆ„๋ฅด๋ฉด Domain ํ™•์ธ ๊ฐ€๋Šฅ

ํ•˜์ง€๋งŒ, ํ•ด๋‹น URL๋กœ ์ ‘์† ์‹œ ์ƒˆ๋กœ๊ณ ์นจํ•˜๋ฉด 404์—๋Ÿฌ๊ฐ€ ๋ฐœ์ƒํ•œ๋‹ค.
์ด๋ฅผ ํ•ด๊ฒฐํ•˜๊ธฐ์œ„ํ•ด ๊ตฌ๊ธ€์˜ ํž˜์„ ๋นŒ๋ ค ํ•ด๋‹น ํŽ˜์ด์ง€ ์ฐธ๊ณ !!

8. ํ•ด๋‹น repo์— vercel.json ํŒŒ์ผ ์ถ”๊ฐ€

9. vercel ํ™ˆํŽ˜์ด์ง€์˜ Deployments ํƒญ์—์„œ ์—…๋ฐ์ดํŠธ ํ™•์ธ

10. ์ƒˆ๋กœ๊ณ ์นจ์„ ํ•ด๋„ ์—๋Ÿฌ๊ฐ€ ๋ฐœ์ƒํ•˜์ง€์•Š๋Š”๋‹ค!๐Ÿ˜‰


Comment

ํ•ญ์ƒ ๋ฐฐํฌ๋Š” ์–ด๋ ค์šธ๊บผ์•ผ.. ๋‚œ ๋ชปํ• ๊บผ์•ผ..๋ผ๋Š” ๋งˆ์Œ๊ฐ€์ง์œผ๋กœ ๋ฏธ๋ค„๋‘๊ณ ๋งŒ ์žˆ๋˜ ๋‚ด๊ฐ€ ๋ฐ‰๋‹คใ… ใ… ใ… 
๋ง‰์ƒํ•˜๊ณ ๋‚˜๋ฉด ์ƒ๊ฐ๋ณด๋‹ค ์‰ฝ๊ฒŒ ํ’€๋ฆฌ๋Š” ๊ฒƒ๋“ค์ด ๋งŽ์€ ๊ฒƒ ๊ฐ™๋‹ค.
vercel ๋ง๊ณ ๋„ ๊ฐ•์˜๋กœ ๋“ค์—ˆ๋˜ ์—ฌ๋Ÿฌ ๋ฐฉ๋ฒ•๋“ค์„ ํ•˜๋‚˜์”ฉ ๋ฟŒ์…”๋ด์•ผ๊ฒ ๋‹ค!!!
ํ”„๋กœ์ ํŠธํ–ˆ์œผ๋‹ˆ ๋! ์ด๊ฒŒ ์•„๋‹ˆ๋ผ ๋ฐฐํฌ๋ฅผ ํ†ตํ•ด ์ฃผ๋ณ€ ์‚ฌ๋žŒ๋“ค์—๊ฒŒ ํ”ผ๋“œ๋ฐฑ์„ ๋ฐ›๊ณ  ์ˆ˜์ •ํ•ด๋‚˜๊ฐ€๋Š” ๊ณผ์ •์ด ๋งค์šฐ ์ค‘์š”ํ•˜๋‹ค๊ณ  ์ƒ๊ฐํ•œ๋‹ค.
์˜ค๋Š˜์˜ ๊ฒฝํ—˜์„ ๊ณ„๊ธฐ๋กœ ๋ฌด์ž‘์ • ์–ด๋ ต๊ฒ ๋‹ค๊ณ  ๋‘๋ ค์›Œํ•˜๋Š” ๊ฒƒ์ด ์•„๋‹ˆ๋ผ ๋ญ๋“  ๋ถ€๋”ชํ˜€๋ณด๋Š” ๊ฐœ๋ฐœ์ž๊ฐ€ ๋˜์–ด์•ผ๊ฒ ๋‹ค~~๐Ÿ’ซ

profile
์ธ์ƒ์€ ์šฉ๊ธฐ์˜ ์–‘์— ๋”ฐ๋ผ ์ค„์–ด๋“ค๊ฑฐ๋‚˜, ๋Š˜์–ด๋‚œ๋‹ค

2๊ฐœ์˜ ๋Œ“๊ธ€

comment-user-thumbnail
2021๋…„ 9์›” 9์ผ

Vercel ๋„ˆ๋ฌด ์ข‹์•„์š”

1๊ฐœ์˜ ๋‹ต๊ธ€