๐ŸŽจ๋ฏธ๋‹ˆ๋ฉ€ํ•œ ํ”„๋ฆฐํŠธ ๋ฐ ์ƒ‰์ƒ๊ณผ ์†Œ์žฌ๋งŒ์œผ๋กœ ๊ณ ์œ ์˜ ์œ ๋‹ˆํฌํ•œ ๋งค๋ ฅ์„ ๋‹ด์•„๋‚ด๋Š” ์•„๋ฏธ ํŒŒ๋ฆฌ์Šค(Ami Paris) ์›น์‚ฌ์ดํŠธ ํด๋ก  ํ”„๋กœ์ ํŠธ

ํ”„๋กœ์ ํŠธ ๊ธฐ๊ฐ„๐Ÿšฉ

2020๋…„ 6์›” 22์ผ~7์›” 3์ผ (์ด 2์ฃผ) ํ”„๋ก ํŠธ 3๋ช…, ๋ฐฑ์—”๋“œ 3๋ช…

ํ”„๋กœ์ ํŠธ ๊นƒํ—ˆ๋ธŒ ์ฃผ์†Œ ๐Ÿ“

ํ”„๋ก ํŠธ : https://github.com/wecode-bootcamp-korea/9-WE_T_S-frontend ๋ฐฑ์—”๋“œ : https://github.com/wecode-bootcamp-korea/9-WE_T_S-backend

์‚ฌ์šฉ๋œ ๊ธฐ์ˆ  ์Šคํƒ (ํ”„๋ก ํŠธ) ๐Ÿคผโ€โ™€๏ธ

  • HTML
  • SCSS
  • React
  • ์‚ฌ์šฉํ•œ React library
  • slick slider(๋ฉ”์ธ ํŽ˜์ด์ง€ ์Šฌ๋ผ์ด๋” ์ ์šฉ)
  • zxcvbn(์•”ํ˜ธ ๊ฐ•๋„ ์ปฌ๋Ÿฌ๋ฐ” ์ ์šฉ)
  • React icon

๊ตฌํ˜„ ํŽ˜์ด์ง€ ๐ŸŒ

  • ๋ฉ”์ธ ํŽ˜์ด์ง€ -๋ฐ˜์‘ํ˜• Nav bar(์Šคํฌ๋กค, ํŽ˜์ด์ง€ ๋ณ„ ๋ฐ˜์‘ ์ด๋ฒคํŠธ ์ ์šฉ) -๋ฉ”๋‰ด ์นดํ…Œ๊ณ ๋ฆฌ ์„œ๋ฒ„ ํ†ต์‹ /ํ˜ธ์ถœ ํ•˜์—ฌ ์ ์šฉ -์ด๋ฏธ์ง€ ์Šฌ๋ผ์ด๋”
  • ๋กœ๊ทธ์ธ / ํšŒ์›๊ฐ€์ž… -์ •๊ทœ์‹ ๋น„๋ฐ€๋ฒˆํ˜ธ ์ ์šฉ -์กฐ๊ฑด์‹ ๋น„๋ฐ€๋ฒˆํ˜ธ ์• ๋‹ˆ๋ฉ”์ด์…˜ ๊ธฐ๋Šฅ ์ ์šฉ
  • ์ œํ’ˆ ๋ฆฌ์ŠคํŠธ/์ œํ’ˆ ์ƒ์„ธ ํŽ˜์ด์ง€ -์ œํ’ˆ ๋ฆฌ์ŠคํŠธ ์ƒ‰์ƒ ๋ณ„ ํ•„ํ„ฐ ์ด๋ฒคํŠธ -์ œํ’ˆ ๊ฐ€๊ฒฉ ๋ณ„ sort ํ•จ์ˆ˜ ์ ์šฉ -๋ฐ˜์‘ ํ˜• hover ์• ๋‹ˆ๋ฉ”์ด์…˜ -์ƒ์„ธ ์ƒํ’ˆ ์Šคํฌ๋กค ์ด๋ฒคํŠธ -์‚ฌ์ด์ฆˆ ์˜ต์…˜ ํด๋ฆญ ์ด๋ฒคํŠธ -์ด๋ฏธ์ง€ ํ™•๋Œ€ modal ์ฐฝ -์ œํ’ˆ๋ฆฌ์ŠคํŠธ/์ƒ์„ธํŽ˜์ด์ง€ ์„œ๋ฒ„ ํ†ต์‹  ํ˜ธ์ถœํ•˜์—ฌ ํ™”๋ฉด์— render
  • ์žฅ๋ฐ”๊ตฌ๋‹ˆ /์œ„์‹œ๋ฆฌ์ŠคํŠธ -reduce ํ•จ์ˆ˜ ์ ์šฉํ•œ ์ œํ’ˆ ์ˆ˜๋Ÿ‰ ๋ณ€๊ฒฝ -๋ชจ๋‹ฌ ์ฐฝ ์‚ฌ์šฉํ•œ ํŒ์—…ํ˜• ์žฅ๋ฐ”๊ตฌ๋‹ˆ/์œ„์‹œ๋ฆฌ์ŠคํŠธ ๊ตฌํ˜„ -์œ„์‹œ๋ฆฌ์ŠคํŠธ ์„œ๋ฒ„ ํ†ต์‹  ํ˜ธ์ถœํ•˜์—ฌ ์‚ฌ์šฉ์ž ์ •๋ณด๋ฅผ ๋งž๋Š” ๋ฆฌ์ŠคํŠธ๋ฅผ render
  • Newsletter/search -๋‰ด์Šค๋ ˆํ„ฐ์™€ ์„œ์น˜ ํŽ˜์ด์ง€ UI๊ตฌํ˜„