Thumbs Up! ๐Ÿ‘ - ๋‹น์‹ ์˜ ์ตœ๊ณ ์˜ ์ธ๋„ค์ผ ๋ฉ”์ด์ปค

seungjun.devยท2025๋…„ 4์›” 18์ผ
0

WEB Front-End

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

๋ฐ”๋กœ๊ฐ€๊ธฐ

Thumbs Up! ๐Ÿ‘ ์€ ๋ธ”๋กœ๊ทธ ๊ธ€์˜ ์ธ๋„ค์ผ์„ ๋งŒ๋“ค ๋•Œ์˜ ๊ณ ๋ฏผ์„ ํ•ด์†Œํ•˜๊ณ ์ž ๋งŒ๋“  ์„œ๋น„์Šค์ž…๋‹ˆ๋‹ค.

๊ฐ์ข… ๋ธ”๋กœ๊ทธ ์„œ๋น„์Šค์˜ ์ธ๋„ค์ผ ๋น„์œจ์„ ์‹œ์ž‘ํ•˜๋Š” ๊ฒƒ๋ถ€ํ„ฐ ๋ฐฐ๊ฒฝ, ์ธ๋„ค์ผ์˜ ๋ ˆ์ด์•„์›ƒ, ํ…์ŠคํŠธ ๋“ฑ ์—ฌ๋Ÿฌ ์ปค์Šคํ„ฐ๋งˆ์ด์ง•์„ ์‰ฝ๊ฒŒ ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

๊ฒฐ๊ณผ๋ฌผ์€ ๋ฐ”๋กœ ์ด๋ฏธ์ง€ ๋งํฌ ํ˜•์‹์œผ๋กœ ๋ณต์‚ฌํ•˜๊ฑฐ๋‚˜ ์ด๋ฏธ์ง€๋กœ ์ €์žฅํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

๊ธฐ๋Šฅ

  • Velog, YouTube ๋“ฑ ๊ฐ์ข… ์ธ๋„ค์ผ ์ด๋ฏธ์ง€ ๋น„์œจ ์ง€์›
  • ๋ ˆ์ด์•„์›ƒ ์„ค์ •์„ ํ†ตํ•œ ์ธ๋„ค์ผ์˜ ๊ฐ€๋…์„ฑ ํ–ฅ์ƒ
  • ๋‹ค์–‘ํ•œ ๋ฐฐ๊ฒฝ ์„ ํƒ ์ง€์›
  • ํฐํŠธ ์ˆ˜์ •, ๋ณผ๋“œ, ๋ฐ‘์ค„, ํฌ๊ธฐ ๋“ฑ ํ…์ŠคํŠธ ์„ค์ •
  • ํ…์ŠคํŠธ ์š”์†Œ ์ด๋™ ๋ฐ ๊ฐ€์šด๋ฐ์— ๊ฐ€๊นŒ์›Œ์ง€๋ฉด ์ž๋™์œผ๋กœ ์ •๋ ฌํ•ด์ฃผ๋Š” ์Šค๋ƒ… ๊ธฐ๋Šฅ ์ง€์›

๊ธฐ์ˆ  ์Šคํƒ

์นดํ…Œ๊ณ ๋ฆฌ ์Šคํƒ
๊ณตํ†ต TypeScript ESLint Prettier
ํ”„๋ก ํŠธ์—”๋“œ React TailwindCSS Konva
๋ฐฐํฌ Netlify

๋ฏธ๋ฆฌ๋ณด๊ธฐ

๋น„์œจ ์„ค์ •

Screen Recording 2025-04-18 at 11 29 58

Velog, 1:1, 4:3, Youtube(16:9) ์ด 4๊ฐœ์˜ ์ด๋ฏธ์ง€ ๋น„์œจ์„ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค.

๋ ˆ์ด์•„์›ƒ ์„ค์ •

Screen Recording 2025-04-18 at 11 36 13

๋‹ค์–‘ํ•œ ์˜ต์…˜์˜ ๋ ˆ์ด์•„์›ƒ์œผ๋กœ ์ธ๋„ค์ผ์˜ ๊ฐ€๋…์„ฑ์„ ํ–ฅ์ƒ์‹œํ‚ฌ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

๋ฐฐ๊ฒฝ ์„ค์ •

๋žœ๋ค ๋ฐฐ๊ฒฝ ์ด๋ฏธ์ง€

Screen Recording 2025-04-18 at 11 38 22

์ถ”์ƒ์ ์ธ ๋ฐฐ๊ฒฝ ์ด๋ฏธ์ง€๋ฅผ ๊ธฐ๋ณธ์œผ๋กœ ์ œ๊ณตํ•ด ์ธ๋„ค์ผ์˜ ํ€„๋ฆฌํ‹ฐ ํ–ฅ์ƒ์— ๊ธฐ์—ฌํ•ฉ๋‹ˆ๋‹ค.

๋‹จ์ƒ‰ ๋ฐฐ๊ฒฝ

Screen Recording 2025-04-18 at 11 41 00

์ƒ‰์ƒ ์„ ํƒ๊ธฐ๋ฅผ ํ†ตํ•ด ๋‹ค์–‘ํ•œ ์ƒ‰์˜ ๋‹จ์ƒ‰ ๋ฐฐ๊ฒฝ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.

HEX ๊ฐ’์œผ๋กœ๋„ ์›ํ•˜๋Š” ์ƒ‰์ƒ์„ ์„ ํƒํ•  ์ˆ˜ ์žˆ์œผ๋ฉฐ ๋žœ๋ค์œผ๋กœ ์ƒ‰์„ ๊ฒฐ์ •ํ•  ์ˆ˜๋„ ์žˆ์Šต๋‹ˆ๋‹ค.

๊ทธ๋ผ๋””์–ธํŠธ ๋ฐฐ๊ฒฝ

Screen Recording 2025-04-18 at 11 44 32

์ƒ‰์ƒ ์„ ํƒ๊ธฐ๋ฅผ ํ†ตํ•ด ๋‹ค์–‘ํ•œ ์ƒ‰์˜ ๊ทธ๋ผ๋””์–ธํŠธ ๋ฐฐ๊ฒฝ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.

๋žœ๋ค์œผ๋กœ ์ƒ‰์„ ๊ฒฐ์ •ํ•  ์ˆ˜๋„ ์žˆ์Šต๋‹ˆ๋‹ค.

์ด๋ฏธ์ง€ ์‚ฝ์ž…

Screen Recording 2025-04-18 at 11 47 23

์‚ฌ์šฉ์ž๊ฐ€ ์›ํ•˜๋Š” ์ด๋ฏธ์ง€๋ฅผ ๋ฐฐ๊ฒฝ์— ์‚ฝ์ž…ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

ํ…์ŠคํŠธ ์„ค์ •

Screen Recording 2025-04-18 at 11 49 44

์›ํ•˜๋Š” ํ…์ŠคํŠธ๋ฅผ ์ง์ ‘ ์ž…๋ ฅํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

ํ…์ŠคํŠธ ์ปค์Šคํ„ฐ๋งˆ์ด์ง•

Screen Recording 2025-04-18 at 11 54 05

ํฐํŠธ๋ถ€ํ„ฐ ์‹œ์ž‘ํ•ด ๋ณผ๋“œ์ฒด, ๋ฐ‘์ค„, ์ƒ‰, ํฌ๊ธฐ ๋“ฑ ๋‹ค์–‘ํ•œ ์ปค์Šคํ„ฐ๋งˆ์ด์ง• ์˜ต์…˜์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.

๋ผ์ด์„ ์Šค

์ด ํ”„๋กœ์ ํŠธ๋Š” MIT License ํ•˜์— ๋ฐฐํฌ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.

profile
Microsoft Learn Student Ambassadors

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

Powered by GraphCDN, the GraphQL CDN