Skip to content

bokjiri/front-end

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

139 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

image

๋ณต์ง€๋ฐ›๊ณ  ์„ธ์ƒ ํŽธํ•˜๊ฒŒ ์‚ด์ž!

๋ณต์„ธํŽธ์‚ด์€ ๋ณต์ง€ ์ •์ฑ… ๋ฐ ๋‰ด์Šค ๋งž์ถค ์ถ”์ฒœ ์‚ฌ์ดํŠธ์ž…๋‹ˆ๋‹ค!


ํ”„๋กœ์ ํŠธ ์†Œ๊ฐœ

๐Ÿ›  Architecture

แ„‰แ…ฅแ„‡แ…ตแ„‰แ…ณ แ„‹แ…กแ„แ…ตแ„แ…ฆแ†จแ„Žแ…ง (2) (1)


โฐ ํ”„๋กœ์ ํŠธ ํƒ€์ž„๋ผ์ธ

  • 4์›” 22์ผ ~ 6์›” 3์ผ (6์ฃผ)
  • 5์›” 19์ผ ๋ฐฐํฌ & ๋งˆ์ผ€ํŒ… & UT ์‹œ์ž‘
  • 5์›” 27์ผ ๋ˆ„์  ์‚ฌ์šฉ์ž 500๋ช… & ์กฐํšŒ์ˆ˜ 1๋งŒํšŒ ๋ŒํŒŒ
  • 6์›” 3์ผ ๋ˆ„์  ์‚ฌ์šฉ์ž 600๋ช… & ์กฐํšŒ์ˆ˜ 2๋งŒํšŒ ๋ŒํŒŒ

๐Ÿš€ ๊ธฐ๋Šฅ

๐Ÿ˜ƒ ๊ฐ„๋‹จํ•˜๊ณ  ์•ˆ์ „ํ•œ ํšŒ์›๊ฐ€์ž…

  • ์นด์นด์˜ค๋ฅผ ํ†ตํ•œ ์†Œ์…œ ๋กœ๊ทธ์ธ์œผ๋กœ ๊ฐ„๋‹จํ•˜๊ณ  ์•ˆ์ „ํ•˜๊ฒŒ ํšŒ์›๊ฐ€์ž… ํ•  ์ˆ˜ ์žˆ์–ด์š”!

๐Ÿ˜ƒ ๊ฐ„๋‹จํ•œ ์ •๋ณด ์ž…๋ ฅ์œผ๋กœ ๋ณต์ง€ ์ •์ฑ… ์ถ”์ฒœ ๋ฐ›๊ธฐ

  • ๋‚ด๊ฐ€ ์ž…๋ ฅํ•œ ์ •๋ณด๋ฅผ ๋ฐ”ํƒ•์œผ๋กœ ๋ฐ›์„ ์ˆ˜ ์žˆ๋Š” ๋ณต์ง€ ์ •์ฑ…๋งŒ ๋ชจ์•„์„œ ์ถ”์ฒœํ•ด๋“œ๋ ค์š”!

๐Ÿ˜ƒ ์›ํ•˜๋Š” ์ •์ฑ…์„ ๊ฒ€์ƒ‰ ๊ธฐ๋Šฅ์œผ๋กœ ๊ฐ„ํŽธํ•˜๊ฒŒ

  • ํ‚ค์›Œ๋“œ ๊ฒ€์ƒ‰์ด๋‚˜ ์ •์ฑ…๋ช…, ์นดํ…Œ๊ณ ๋ฆฌ ๊ฒ€์ƒ‰์œผ๋กœ ๋น ๋ฅด๊ฒŒ ์›ํ•˜๋Š” ์ •์ฑ…์„ ์ฐพ์„ ์ˆ˜ ์žˆ์–ด์š”!

๐Ÿ˜ƒ ์ž์ฃผ ์ฐพ๋Š” ์ •์ฑ…์€ ๋ถ๋งˆํฌ ๊ธฐ๋Šฅ์œผ๋กœ ๊ฐ„ํŽธ ํ™•์ธ

  • ๋ถ๋งˆํฌ๋ฅผ ํ•ด๋‘๋ฉด ์‚ฌ์ด๋“œ๋ฐ”์—์„œ ๊ฐ„ํŽธํ•˜๊ฒŒ ํ™•์ธํ•  ์ˆ˜ ์žˆ์–ด์š”

๐Ÿ˜ณ ํ•„์š”์—†๋Š” ์ •์ฑ…์ด ์žˆ์„ ๋•Œ๋Š” ๋ฐ”๋กœ ์‚ญ์ œ

  • ๋งž์ง€ ์•Š๋Š” ์ •์ฑ…์ด ์žˆ๋‹ค๋ฉด ์•Œ๋ ค์ฃผ์„ธ์š”!๋ฅผ ํด๋ฆญํ•˜๋ฉด ํ•ด๋‹น ์ •์ฑ…์ด ๋‚˜์—๊ฒŒ ๋”์ด์ƒ ์ถ”์ฒœ๋˜์ง€ ์•Š์•„์š”!

๐Ÿ˜œ ๋‹ค๋ฅธ ์‚ฌ๋žŒ๋“ค์—๊ฒŒ ๋ณด์—ฌ์ฃผ๊ณ  ์‹ถ์€ ์ •์ฑ…์ด ์žˆ๋‹ค๋ฉด ๊ณต์œ ํ•˜๊ธฐ

  • ๊ณต์œ  ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด ํด๋ฆฝ๋ณด๋“œ๋กœ url์ด ๋ณต์‚ฌ๋ผ์š”

๐Ÿค  ์ž…๋ ฅ๋œ ์ง€์—ญ ์ •๋ณด๋ฅผ ๋ฐ”ํƒ•์œผ๋กœ ์ง€์—ญ ๋งž์ถค ๋‰ด์Šค๋งŒ ์ถ”์ฒœ

  • ์ž…๋ ฅํ•œ ์ง€์—ญ ์ •๋ณด์— ๋งž๋Š” ๋งž์ถค ๋ณต์ง€ ๋‰ด์Šค ์ถ”์ฒœ๋ผ์š”

๐Ÿ’ฌ ์ด์šฉ์ž๋“ค๊ณผ์˜ ์‹ค์‹œ๊ฐ„ ์ฑ„ํŒ… ๊ธฐ๋Šฅ

  • ๋ณต์„ธํŽธ์‚ด์„ ์ด์šฉ์ค‘์ธ ์‚ฌ๋žŒ๋“ค๊ณผ ์ž์œ ๋กญ๊ฒŒ ์‹ค์‹œ๊ฐ„์œผ๋กœ ๋Œ€ํ™”๋ฅผ ๋‚˜๋ˆŒ ์ˆ˜ ์žˆ์–ด์š”!

๐Ÿ’ก ๋†“์น˜๊ธฐ ์‰ฌ์šด ์ •์ฑ…์„ ์•Œ๋ฆผ ์„œ๋น„์Šค๋กœ ๋†“์น˜์ง€ ์•Š๊ธฐ

  • ์ •์ฑ… ์‹ ์ฒญ ๊ธฐํ•œ์ด ๋๋‚˜๊ธฐ ์ผ์ฃผ์ผ ์ „์— ์ด๋ฉ”์ผ๋กœ ์ •์ฑ…์„ ๋ถ๋งˆํฌ ํ•ด๋‘” ์‚ฌ์šฉ์ž์—๊ฒŒ ์•Œ๋ ค๋“œ๋ ค์š”!

๐Ÿ›  Tools

Design


Back-end

JavaScript NodeJS
NPM Express.js
AWS
MongoDB Redis
Passport
Jest

Front-end



Dev tools



์ด๋ฆ„ ํฌ์ง€์…˜ ๊ฐœ์ธ ๊นƒํ—ˆ๋ธŒ or ์ด๋ฉ”์ผ
์ตœ์„œ๋ผ ํ”„๋ก ํŠธ์—”๋“œ https://github.com/Seol827
ํ•œ์ƒ์› ํ”„๋ก ํŠธ์—”๋“œ https://github.com/hsangwon
๊ถŒ์ง€์› ๋ฐฑ์—”๋“œ https://github.com/zzpjw
์ดํ‘ธ๋ฆ„ ๋ฐฑ์—”๋“œ https://github.com/pooreumu
๊น€์˜์šฐ ๋ฐฑ์—”๋“œ https://github.com/rlasuddn
๊น€์ง€์› ๋””์ž์ด๋„ˆ ๐Ÿšข clue653@gmail.com
๋ฐฑ์ง€์œค ๋””์ž์ด๋„ˆ ๐Ÿšข qorwldbs1027@gmail.com

๐Ÿ”ฅ์ด์Šˆ ๋ฐ ํŠธ๋Ÿฌ๋ธ”์ŠˆํŒ…

โžก๏ธ CloudFront ๋ฐฐํฌ ๊ด€๋ จ ๋ฌธ์ œ

๋ฌธ์ œ : S3 ๋ฒ„ํ‚ท์˜ ๋‚ด์šฉ์„ ๋ณ€๊ฒฝํ–ˆ๋‹ค๊ณ  ํ•˜๋”๋ผ๋„ ์บ์‹œ๊ฐ€ ์œ ์ง€๋˜๋Š” ์‹œ๊ฐ„๋‚ด์—์„œ๋Š” ํ•ด๋‹น ๋ณ€๊ฒฝ ๋‚ด์šฉ์ด CloudFront์— ์ฆ‰์‹œ ๋ฐ˜์˜๋˜์ง€ ์•Š๋Š” ๋ฌธ์ œ

ํ•ด๊ฒฐ : CloudFront์˜ Invalidations(๋ฌดํšจํ™”)๋ฅผ ์ง„ํ–‰ํ•˜์—ฌ Edge Location์— ์ €์žฅ๋œ ์บ์‹œ๋ฅผ ์‚ญ์ œํ–ˆ๋‹ค.

โžก๏ธ useSWR

๋ฌธ์ œ : Redux์˜ ๊ฒฝ์šฐ ์„œ๋ฒ„์˜ ์‘๋‹ต๊ฐ’์„ ์ €์žฅํ•ด ๋†“๋Š” ์Šคํ† ์–ด ์—ญํ• ์ด ์•„๋‹Œ ์ „์—ญ ์ƒํƒœ ๊ด€๋ฆฌ๋ฅผ ์œ„ํ•œ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋กœ, useEffect๋ฅผ ํ†ตํ•ด mount๋  ๋•Œ๋งˆ๋‹ค ์„œ๋ฒ„์— ๋ถˆํ•„์š”ํ•œ GET ์š”์ฒญ์„ ํ•˜๊ฒŒ ๋œ๋‹ค.

ํ•ด๊ฒฐ : SWR์€ ๊ธฐ์กด ํ๋ฆ„์„ ๋ฒ—์–ด๋‚˜์ง€ ์•Š๊ณ  ์บ์‹œ ๊ธฐ๋Šฅ๊นŒ์ง€ ๊ฐ€๋Šฅํ•œ data Fetching ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์ด๋ฉฐ, ๋ฆฌ๋•์Šค action, reducer, store ๋“ฑ์„ ์‚ฌ์šฉํ•˜์ง€ ์•Š์•„ ๋กœ์ง์ด ๋งค์šฐ ๊ฐ„๊ฒฐํ•ด์ง„๋‹ค. ๋˜ํ•œ ์บ์‹œ๋œ ๋ฐ์ดํ„ฐ๋ฅผ ํ™œ์šฉํ•˜์—ฌ ๋ถˆํ•„์š”ํ•œ ๋ฐ์ดํ„ฐ ํ˜ธ์ถœ๊ณผ ๋žœ๋”๋ง์— ์‹œ๊ฐ„์„ ์“ฐ์ง€ ์•Š์•„ ํšจ์œจ์ ์ด๋‹ค.

โžก๏ธ ์„ฑ๋Šฅ ๋ฌธ์ œ

๋ฌธ์ œ : ๋‰ด์Šค ํฌ๋กค๋ง๊ณผ ์œ ์ € ์ •๋ณด๋ฅผ ํ†ตํ•œ ์ •์ฑ… ์ถ”์ฒœ ๋กœ์ง์„ ๋ฉ”์ธ ํŽ˜์ด์ง€๊ฐ€ ๋ณด์—ฌ์งˆ ๋•Œ๋งˆ๋‹ค ์ง€์†์ ์œผ๋กœ GETํ•ด์•ผ ํ•˜๊ธฐ ๋•Œ๋ฌธ์— ํŠธ๋ž˜ํ”ฝ์— ๋”ฐ๋ผ ์„ฑ๋Šฅ์ƒ์˜ ํฐ ๋ฌธ์ œ๊ฐ€ ์žˆ์„ ์ˆ˜ ์žˆ์Œ

ํ•ด๊ฒฐ๋ฐฉ์•ˆ : ์œ ์ €์ •๋ณด๋Š” ์‰ฝ๊ฒŒ ๋ฐ”๋€Œ์ง€ ์•Š์•„ ๋ณด์—ฌ์ฃผ๋Š” ๋ฐ์ดํ„ฐ๊ฐ€ ์ž˜ ๋ณ€ํ•˜์ง€ ์•Š์Œ ์บ์‹œ๋กœ ์ €์žฅํ•ด์„œ ๋ณด์—ฌ์ฃผ์ž

ํ•ด๊ฒฐ : Redis๋ฅผ ํ†ตํ•ด ๊ณ„์‚ฐ๋œ ๋ฐ์ดํ„ฐ๋“ค์„ ์บ์‹ฑ ์ฒ˜๋ฆฌํ•˜์—ฌ ํ•ด๊ฒฐ

ํšจ๊ณผ : redis ์ ์šฉ ํšจ๊ณผ ์ „ํ›„๋น„๊ต

โžก๏ธ ๊ณต๊ณตAPI ๋‚˜์ด ๋ถ„๋ฅ˜ ๋ฌธ์ œ

์„ค๋ช… : ๊ณต๊ณต API์—๋Š” ์ •์ฑ…๋ฐ์ดํ„ฐ๋ฅผ ์ƒ์• ์ฃผ๊ธฐ๋กœ ๋ถ„๋ฅ˜๋ฅผ ํ–ˆ๋Š”๋ฐ, ๋งŒ 9์„ธ~ 24์„ธ๊นŒ์ง€ ํ•ด๋‹น๋˜๋Š” ์ •์ฑ…์ด ์•„๋™,์ฒญ์†Œ๋…„, ์ฒญ๋…„์œผ๋กœ ๋ถ„๋ฅ˜๋˜์–ด ์žˆ์–ด์„œ ๋งŒ 25์„ธ ์ด์ƒ์˜ ์ฒญ๋…„๋“ค์—๊ฒŒ๋„ ํ•ด๋‹น ์ •์ฑ…์ด ์ถ”์ฒœ๋˜๋Š” ๋“ฑ์˜ ๋ฌธ์ œ๊ฐ€ ๋งŽ์•˜์Œ

ํ•ด๊ฒฐ : ์ •์ฑ…์— ํ•ด๋‹น๋˜๋Š” ์ •ํ™•ํ•œ ๋งŒ ๋‚˜์ด๋ฅผ ์ •์ฑ… ์„ธ๋ถ€ ๋‚ด์šฉ์—์„œ ๊บผ๋‚ด ์ƒˆ๋กœ์šด ๋ถ„๋ฅ˜ ๊ธฐ์ค€์„ โ€œageโ€:[9,24] ๋“ฑ์œผ๋กœ ์ถ”๊ฐ€ํ•˜๊ณ , ์‚ฌ์šฉ์ž์˜ ๋งŒ ๋‚˜์ด๋ฅผ ๊ณ„์‚ฐํ•ด์„œ ์ •ํ™•ํ•œ ๋‚˜์ด ๋งž์ถค ์ •์ฑ…์„ ์ถ”์ฒœํ•˜๋„๋ก ํ•˜์—ฌ ํ•ด๊ฒฐ

โžก๏ธ ๊ณต๊ณตAPI ์—…์ข… ๋ถ„๋ฅ˜ ๋ฌธ์ œ

์„ค๋ช… : ํ•ด๋‹น ์ •์ฑ…์€ ์‚ฌ์šฉ์ž ์ค‘ ๋†์—…์ธ์—๊ฒŒ๋งŒ ํ•ด๋‹นํ•˜๋Š” ์ •์ฑ…์ธ๋ฐ ๊ณต๊ณตAPI์—์„œ๋Š” ๋ถ„๋ฅ˜๊ฐ€ ์•ˆ๋˜์–ด์žˆ์–ด์„œ ์ผ๋ฐ˜ ์‚ฌ์šฉ์ž๋“ค๋„ ์ถ”์ฒœ์ด ๋˜๋Š” ๋ฌธ์ œ๊ฐ€ ์žˆ์—ˆ๋‹ค.

ํ•ด๊ฒฐ : ๋†์—…, ๊ด‘์—…, ์–ด์—… ๋“ฑ ๊ฐ™์€ ์—…์ข…์˜ ์ •์ฑ…๋‚ด์šฉ ํŒจํ„ด์„ ๋ณด๊ณ  ํ‚ค์›Œ๋“œ๋กœ ์นดํ…Œ๊ณ ๋ฆฌ๋ฅผ ๋งŒ๋“ค์—ˆ๋‹ค.

โžก๏ธ ๊ณต๊ณตAPI ์†Œ๋“๋ถ„์œ„ ๋ถ„๋ฅ˜ ๋ฌธ์ œ

์„ค๋ช… : ๊ณต๊ณต API์—์„œ๋Š” ๋Œ€๋ถ€๋ถ„์˜ ์†Œ๋“ ๊ธฐ์ค€์ด ์ ์šฉ๋˜๋Š” ์ •์ฑ…์„ ์ €์†Œ๋“์œผ๋กœ ๋ฌถ์–ด๋†”์„œ ์ •ํ™•ํ•œ ์ถ”์ฒœ์ด ๋ถˆ๊ฐ€๋Šฅํ–ˆ๋˜ ๋ฌธ์ œ๊ฐ€ ์žˆ์—ˆ๋‹ค.

ํ•ด๊ฒฐ : ์ •์ฑ…์— ํ•ด๋‹น๋˜๋Š” ์ •ํ™•ํ•œ ์†Œ๋“ ๋ถ„์œ„๋ฅผ ์ •์ฑ… ์„ธ๋ถ€ ๋‚ด์šฉ์—์„œ ๊บผ๋‚ด ์ƒˆ๋กœ์šด ๋ถ„๋ฅ˜ ๊ธฐ์ค€์„ โ€œsalaryโ€:60(ํ•ด๋‹น ์ •์ฑ…์„ ๋ฐ›์„ ์ˆ˜ ์žˆ๋Š” ์ตœ๋Œ€ ์†Œ๋“ ๋ถ„์œ„ ์ˆ˜(%)) ๋“ฑ์œผ๋กœ ์ถ”๊ฐ€ํ•˜๊ณ , ์‚ฌ์šฉ์ž์˜ ์†Œ๋“ ๋ถ„์œ„๋ฅผ ๊ฐ€๊ตฌ์› ์ˆ˜์™€ ๋ณตํ•ฉ ๊ณ„์‚ฐํ•˜์—ฌ ์ •ํ™•ํ•œ ์†Œ๋“ ๋งž์ถค ์ •์ฑ…์„ ์ถ”์ฒœํ•˜๋„๋ก ํ•˜์—ฌ ํ•ด๊ฒฐ

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 2

  •  
  •