Skip to content

๐Ÿ‘ฉโ€๐Ÿ‘ฉโ€๐Ÿ‘งโ€๐Ÿ‘ฆ ์™€๊ธ€์™€๊ธ€ - ์ง€ํ•˜์ฒ  ์—ญ ๊ธฐ๋ฐ˜ SNS ์„œ๋น„์Šค

Notifications You must be signed in to change notification settings

Sang-minKIM/waglewagle

ย 
ย 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

๐Ÿ‘จโ€๐Ÿ‘ฉโ€๐Ÿ‘งโ€๐Ÿ‘ฆ ์™€๊ธ€์™€๊ธ€ (Wagle Wagle)


แ„…แ…ฉแ„€แ…ฉ_แ„ƒแ…กแ„แ…ณ

Hits

About Project ๐Ÿš‹

์†Œํ”„ํ‹ฐ์–ด ๋ถ€ํŠธ์บ ํ”„ 3๊ธฐ - ์›Œ๋ฐ์—… ํ”„๋กœ์ ํŠธ ์†Œํ”„ํ‹ฐ5, ๋ชจ๋นŒ2ํŒ€

๊ฐœ๋ฐœ ๊ธฐ๊ฐ„

ver.1: 2024.01.04 ~ 2024.01.10
ver.2: 2024.01.11 ~ 2024.02.13

์ง€๋ฃจํ•œ ์ง€ํ•˜์ฒ .. ๋‚ด ์˜† ์‚ฌ๋žŒ์€ ๋ฌด์Šจ ์ƒ๊ฐํ•˜์ง€? ๐Ÿค”๐Ÿ’ญ

์ง€ํ•˜์ฒ ์„ ํƒ€๊ณ ์žˆ๋Š” ์‚ฌ๋žŒ๋“ค์˜ ๊ณต๊ฐ๋Œ€๋ฅผ ๋ฐ”ํƒ•์œผ๋กœ ์ฝ˜ํ…์ธ ๋ฅผ ๊ณต์œ /ํƒ์ƒ‰ํ•˜๋ฉฐ ์ง€ํ•˜์ฒ  ์ด๋™ ์ค‘์˜ ์ง€๋ฃจํ•จ์„ ํ•ด์†Œํ•˜๋Š” ์›น์„œ๋น„์Šค

1. ์ง€๊ธˆ ๋‚ด ์ƒ๊ฐ์€โ—๏ธ

์—ญ ๋ณ„๋กœ ์†Œ์†Œํ•œ ๊ธ€์„ ์˜ฌ๋ ค ๋‹น์žฅ์˜ ๋‚˜์˜ ๊ธฐ๋ถ„์„ ํ‘œํ˜„ํ•˜๊ณ  ๋‹ค๋ฅธ ์‚ฌ๋žŒ์—๊ฒŒ ์ •๋ณด๋ฅผ ๊ณต์œ ํ•œ๋‹ค.

2. ์ง€๊ธˆ ๋‹ค๋ฅธ ์‚ฌ๋žŒ๋“ค์€โ“

๋น„์Šทํ•œ ์‹œ๊ฐ„๋Œ€์— ์ง€ํ•˜์ฒ ์„ ํƒ€๋Š” ์‚ฌ๋žŒ๋“ค์˜ ๊ธ€์„ ํ†ตํ•ด ๊ณต๊ฐ๋Œ€๋ฅผ ํ˜•์„ฑํ•˜๊ณ  ์ง€๋ฃจํ•œ ์ง€ํ•˜์ฒ ์—์„œ์˜ ์‹œ๊ฐ„์„ ๋‹ฌ๋žœ๋‹ค.
(์ง€ํ•˜์ฒ  ์ด์šฉ์˜ ์ง€๋ฃจํ•จ ๊ณต๊ฐ, ์žฌ๋ฐŒ๋Š” ์งค ์—…๋กœ๋“œ ๋“ฑ)

3. ์™€๊ธ€์™€๊ธ€ ์ง€ํ•˜์ฒ  โ‰๏ธ

์ •์„œ๋ฅผ ํ‘œํ˜„ํ•˜๋Š” ์บ๋ฆญํ„ฐ์™€ ๊ณต๊ฐ์„ฑ์„ ๋‹ด์€ ์žฌ์น˜์žˆ๋Š” ๋žœ๋ค ๋‹‰๋„ค์ž„์„ ํ†ตํ•ด ์†Œ์†Œํ•œ ์žฌ๋ฏธ๋ฅผ ๋ถ€์—ฌํ•œ๋‹ค.
(ex. ๋‹‰๋„ค์ž„: ์ถœ๊ทผํ•˜๊ธฐ ์‹ซ์€ ๋ฐ•๋ช…์ˆ˜)


Sangmin's Contribution ๐Ÿ˜Ž

0. ์„œ๋น„์Šค ์„ค๊ณ„

  • User interaction์— ๋”ฐ๋ผ View๋ฅผ ์—…๋ฐ์ดํŠธ ํ•˜๋„๋ก ํ”„๋กœ์ ํŠธ๋ฅผ ์„ค๊ณ„ํ•˜์—ฌ ๋ฐ์ดํ„ฐ ํ๋ฆ„์„ ์ œ์–ด
  • Vanilla JS๋ฅผ ์‚ฌ์šฉํ•ด React์ฒ˜๋Ÿผ JS์—์„œ HTML์„ ์‚ฝ์ž…ํ•˜๋„๋ก ํ•˜์—ฌ ์ปดํฌ๋„ŒํŠธ ๋‹จ์œ„๋กœ UI๋ฅผ ์žฌํ™œ์šฉ
  • ์ด๋ฒคํŠธ ์œ„์ž„์„ ํ™œ์šฉํ•˜์—ฌ ์ตœ์ƒ์œ„์—์„œ ์ด๋ฒคํŠธ๋ฅผ ์ œ์–ด, ์ด๋ฒคํŠธ map ๊ฐ์ฒด๋ฅผ ํ™œ์šฉํ•ด ๊ฐ€๋…์„ฑ ํ–ฅ์ƒ image

1. ๋…ธ์„ ๋„ ํ™”๋ฉด

  • geolocationAPI์™€ element.scrollIntoView๋ฅผ ํ™œ์šฉํ•ด ํ˜„์žฌ ์œ„์น˜ ์ •๋ณด๋ฅผ ๋ฐ”ํƒ•์œผ๋กœ ๊ฐ€๊นŒ์šด ์—ญ์œผ๋กœ ํ™”๋ฉด ์ด๋™

  • SCSS์˜ ๋ฐ˜๋ณต๋ฌธ์„ ํ™œ์šฉํ•ด ๊ฒŒ์‹œ๊ธ€ ์ˆ˜๊ฐ€ ๋งŽ์€ ์—ญ์˜ pin์ด ์ปค์ง€๋„๋ก ์• ๋‹ˆ๋ฉ”์ด์…˜ ์ ์šฉ

  • CSS Grid๋ฅผ ํ™œ์šฉํ•ด ์ง€ํ•˜์ฒ  ๋…ธ์„ ๋„ ํ‘œํ˜„

    แ„’แ…ฉแ†ทแ„’แ…ชแ„†แ…งแ†ซ

2. ๊ฒŒ์‹œ๊ธ€ ํ™”๋ฉด

  • History API๋ฅผ ํ™œ์šฉํ•œ SPA Router๋ฅผ ๊ตฌํ˜„ํ•ด Vanilla JS ํ™˜๊ฒฝ์—์„œ ์ƒˆ๋กœ๊ณ ์นจ ์—†๋Š” ํŽ˜์ด์ง€ ์ „ํ™˜ ์ œ๊ณต

  • ๊ฒŒ์‹œ๊ธ€ ๋กœ๋”ฉ์ค‘ ์Šค์ผˆ๋ ˆํ†ค UI ์ ์šฉ

    แ„€แ…ฆแ„‰แ…ตแ„€แ…ณแ†ฏแ„‡แ…ฉแ„€แ…ต แ„‹แ…งแ†จแ„€แ…กแ†ซแ„‹แ…ตแ„ƒแ…ฉแ†ผ

  • ํƒœ๊ทธ๋ณ„ ๊ฒŒ์‹œ๊ธ€ ๋ชจ์•„๋ณด๊ธฐ ์ œ๊ณต

    แ„แ…ขแ„€แ…ณแ„‡แ…ฎแ†ซแ„…แ…ฒ

  • ๋ถ€์ ์ ˆํ•œ ๊ฒŒ์‹œ๊ธ€ ์‹ ๊ณ  ๊ธฐ๋Šฅ ์ œ๊ณต / localStorage๋ฅผ ํ™œ์šฉํ•ด ์‹ ๊ณ  ์‹œ ์ฆ‰์‹œ ๊ฐ€๋ฆฌ๊ธฐ, ๋ˆ„์  5ํšŒ ์ด์ƒ ์‹ ๊ณ  ๊ฒŒ์‹œ๊ธ€์€ DB์—์„œ ์‚ญ์ œ

    แ„€แ…ฆแ„‰แ…ตแ„€แ…ณแ†ฏ แ„‰แ…ตแ†ซแ„€แ…ฉ

3. ๊ฒŒ์‹œ๊ธ€ ์ž‘์„ฑ ํ™”๋ฉด

  • ๊ธ€ ๋˜๋Š” ์‚ฌ์ง„์€ ์ ์–ด๋„ 1๊ฐœ ์ด์ƒ ํ•„์ˆ˜๋กœ ์„ ํƒ

  • ๋ฌธ์ž์—ด Escape๋ฅผ ํ™œ์šฉํ•ด HTML ํƒœ๊ทธ๋ฅผ ์—”ํ‹ฐํ‹ฐ๋กœ ๋ณ€๊ฒฝํ•˜์—ฌ XSS ๊ณต๊ฒฉ ๋ฐฉ์ง€

    แ„€แ…ฆแ„‰แ…ตแ„€แ…ณแ†ฏแ„Œแ…กแ†จแ„‰แ…ฅแ†ผ

Video ๐Ÿ“บ

  • ์™€๊ธ€์™€๊ธ€ ์‹œ์—ฐ์˜์ƒ (์•„๋ž˜์˜ ์ด๋ฏธ์ง€๋ฅผ ํด๋ฆญํ•˜์‹œ๋ฉด ์œ ํŠœ๋ธŒ ๋งํฌ๋กœ ์—ฐ๊ฒฐ๋ฉ๋‹ˆ๋‹ค.)

    แ„€แ…ฆแ„‰แ…ตแ„€แ…ณแ†ฏแ„‡แ…ฉแ„€แ…ต

Our Team ๐ŸŒฟ

์šฐ๋ฆฌ ํŒ€์˜ ํ˜‘์—…

๐Ÿ‘ฉ๐Ÿปโ€๐Ÿ’ป ๋ชจ๋นŒ2ํŒ€์˜ ๊ทธ๋ผ์šด๋“œ ๋ฃฐ

๐Ÿ“ API ๋ฌธ์„œ(Swagger)

๐Ÿง‘โ€๐Ÿซ ์šฉ์–ด ์‚ฌ์ „

๐Ÿ“Ž ํŠธ๋Ÿฌ๋ธ” ์ŠˆํŒ…


ํŒ€์› ์†Œ๊ฐœ

๊ธฐํš ๋””์ž์ธ ๊ฐœ๋ฐœ(FE) ๊ฐœ๋ฐœ(FE,BE) ๊ฐœ๋ฐœ(FE,BE) ๊ฐœ๋ฐœ(BE)
@yunnamkyeong Naeun Kim @Sang-minKIM @insiderhj @SuHyeon00 @h-sooah
์œค๋‚จ๊ฒฝ ๊น€๋‚˜์€ ๊น€์ƒ๋ฏผ ๊น€ํฌ์ง„ ์˜ค์ˆ˜ํ˜„ ํ•œ์ˆ˜์•„

Stacks ๐Ÿˆ

Environment

VSCode Intellij Git Github

FrontEnd

HTML5 SASS javascript

BackEnd

SpringBoot H2 Docker

CI/CD

GithubActions

Deploy

AWS EC2

Communication

Slack Notion Figma

About

๐Ÿ‘ฉโ€๐Ÿ‘ฉโ€๐Ÿ‘งโ€๐Ÿ‘ฆ ์™€๊ธ€์™€๊ธ€ - ์ง€ํ•˜์ฒ  ์—ญ ๊ธฐ๋ฐ˜ SNS ์„œ๋น„์Šค

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • TypeScript 66.1%
  • SCSS 30.7%
  • HTML 2.5%
  • Dockerfile 0.7%