Giters

wet6123 / WE-tness

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

πŸ₯‡WE-TNESS (μœ„νŠΈλ‹ˆμŠ€)πŸ₯ˆ

WebRTC와 λͺ¨μ…˜μΈμ‹μ„ ν™œμš©ν•œ μš΄λ™ κ²Œμž„ μ„œλΉ„μŠ€



✨ λͺ©μ°¨

  1. μ„œλΉ„μŠ€ μ†Œκ°œ
    1. μ£Όμš” κΈ°λŠ₯ 및 μ‹œμ—°ν™”λ©΄
    2. κΈ°λ³Έ κΈ°λŠ₯ 및 μ‹œμ—°ν™”λ©΄
  2. κ°œλ°œν™˜κ²½
    1. μ‹œμŠ€ν…œ ν™˜κ²½
    2. Technical Architecture Diagram
  3. νŒ€μ› μ†Œκ°œ


πŸ”Ž μ„œλΉ„μŠ€ μ†Œκ°œ

187242914-c3ef1eeb-936c-4c8b-8719-fac0f7903fba.mp4

항상 μž‘μ‹¬ 일일을 μ‹€ν–‰ν•˜κ³  μžˆμ§„ μ•ŠμœΌμ‹ κ°€μš”?

μš”μ¦˜ 날씨, 밖에 λ‚˜κ°€μ„œ μš΄λ™ν•˜κΈ° νž˜λ“€μ£ ?

κ·Έλƒ₯ μˆ¨μ‰¬κΈ°λ„ λ²„κ±°μš΄λ° μš΄λ™μ΄ μž¬λ―Έμ—†μœΌλ©΄ μ–΄λ–»κ²Œ ν•΄μš”?

ν•˜μ§€λ§Œ μš΄λ™μ„ κ²Œμž„μ²˜λŸΌ 즐겁게 ν•  수 μžˆλ‹€λ©΄?

μœ„νŠΈλ‹ˆμŠ€μ™€ ν•¨κ»˜λΌλ©΄ κ°€λŠ₯ν•©λ‹ˆλ‹€.



πŸ’» μ£Όμš”κΈ°λŠ₯ 및 μ‹œμ—°ν™”λ©΄


κ²Œμž„ ν™”λ©΄ - ν”Œλ ˆμ΄ ν™”λ©΄

μš΄λ™ - ν‘Έμ‹œμ—…

μš΄λ™ - λŸ°μ§€

μš΄λ™ -슀쿼트

μš΄λ™ - 버피

Teachable Machine - 버피, 슀쿼트, ν‘Έμ‹œμ—…, λŸ°μ§€



πŸ’» κΈ°λ³ΈκΈ°λŠ₯ 및 μ‹œμ—°ν™”λ©΄

ν™ˆ ν™”λ©΄ - ν˜„μž¬ μƒμ„±λœ λ°©

λ°© 생성 - κ²Œμž„ μ’…λ₯˜, 제λͺ© 및 μ•”ν˜Έ μ„€μ •

νŠœν† λ¦¬μ–Ό - 카메라 μ„ΈνŒ… 및 μš΄λ™ 별 κ°€μ΄λ“œ

screen-recording__2_.webm

λž­ν‚Ή νŽ˜μ΄μ§€ - κ²Œμž„ μ’…λ₯˜ 별(쀑볡 선택 κ°€λŠ₯) 및 지역 별 λž­ν‚Ή

screen-recording__1_.webm

검색 - μœ μ €, λ°© 검색 및 μœ μ € μš΄λ™ 기둝 쑰회

screen-recording.webm


πŸ“ƒ κ°œλ°œν™˜κ²½

μ‹œμŠ€ν…œ ν™˜κ²½

  • πŸ”— Frontend

    • React v5.0.1
    • node.js v16.14.0
    • npm v8.7.0
    • redux-toolkit v1.8.3
    • styled-components v5.3.5

  • πŸ”— CI/CD & Database

    • AWS ec2 - Ubuntu 20.04.4 LTS
    • Docker 20.10.12
    • Jenkins 2.346.3
    • nginx/1.18.0 (Ubuntu)
    • MySQL 8.0.30-0ubuntu0.20.04.2
    • certbot 0.40.0

  • πŸ”— Backend

    • Spring Boot 2.7.1
    • Spring Data JPA 2.7.1
    • Spring Security 5.7.2
    • Spring Cloud 2.2.6

  • πŸ”— Web RTC

    • openVidu 2.22.0

  • πŸ”— Tools

    • Intellij 2022.2
    • VS Code
    • Google Chrome 104.0.5112.81

Technical Architecture Diagram

πŸ€Έβ€β™€οΈ νŒ€μ› μ†Œκ°œ

  • 였혜린(νŒ€μž₯)

    • λ°±μ—”λ“œ
    • User, Rankκ΄€λ ¨ API κ΅¬ν˜„
    • λ°μ΄ν„°λ² μ΄μŠ€ 섀계
    • Jenkinsλ₯Ό μ‚¬μš©ν•œ μžλ™λΉŒλ“œ
    • nginxμ„ΈνŒ…
    • EC2 μ„œλ²„ ν™˜κ²½ μ„ΈνŒ… 및 배포
    • μ΅œμ’… λ°œν‘œ

  • κΉ€μœ€μ„

    • λ°±μ—”λ“œ
    • user 둜그인 κ΄€λ ¨ κΈ°λŠ₯ 개발
    • νŒ”λ‘œμš°, μ•Œλ¦Ό, μ‹ κ³ , μ–΄μ›Œλ“œ κΈ°λŠ₯ 개발

  • λ₯˜ν˜„μˆ˜

    • λ°±μ—”λ“œ
    • Spring Security ν™œμš©ν•œ user 인증 κ΅¬ν˜„
    • Openvidu ν™œμš© WebRTC ν™˜κ²½ ꡬ좕
    • μ†Œμ…œ 둜그인 κ΅¬ν˜„(카카였)

  • λ°°μ€€μ„±

    • ν”„λ‘ νŠΈμ—”λ“œ
    • μš”κ΅¬μ‚¬ν•­ λͺ…μ„Έμ„œ μž‘μ„±
    • react-toolkit & react-router-dom ν™œμš© SPA κ΅¬ν˜„
    • axios μš”μ²­μ„ ν†΅ν•œ api 톡신
    • νŠœν† λ¦¬μ–Ό νŽ˜μ΄μ§€ μ œμž‘
    • λ””μžμΈ 및 ν”„λ‘œν† νƒ€μž… μ œμž‘
    • μš΄λ™λ³„ μ• λ‹ˆλ©”μ΄μ…˜ μ œμž‘
    • styled-components ν™œμš© css μŠ€νƒ€μΌλ§
    • ν˜‘μ—…κ³Ό μ½”λ“œ λ¦¬νŒ©ν† λ§μ„ μœ„ν•œ ESLint μ„€μ •

  • 이동근

    • ν”„λ‘ νŠΈμ—”λ“œ
    • react μ»΄ν¬λ„ŒνŠΈ ꡬ쑰 섀계
    • react-toolkit & react-router-dom ν™œμš© SPA κ΅¬ν˜„
    • axios μš”μ²­μ„ ν†΅ν•œ api 톡신
    • νšŒμ› CRUD κ΅¬ν˜„ (νšŒμ›κ°€μž…, 둜그인, 정보 μˆ˜μ •, λΉ„λ°€λ²ˆν˜Έ μˆ˜μ •, νŒ”λ‘œμš° λ“±)
    • μ†Œμ…œ 둜그인 κ΅¬ν˜„ (카카였)
    • Openvidu ν™œμš© κ²Œμž„λ°© μ‹€μ‹œκ°„ 데이터 κ΅ν™˜ κ΅¬ν˜„
    • teachable machine ν™œμš© λ™μž‘μΈμ‹ κ΅¬ν˜„
    • styled-components ν™œμš© css μŠ€νƒ€μΌλ§

  • ν•œμœ μ—°

    • λ°±μ—”λ“œ
    • κ²Œμž„ κ΄€λ ¨ κΈ°λŠ₯ (κ²Œμž„ 생성 및 κ²°κ³Ό μ €μž₯ λ“±) API κ΅¬ν˜„
    • μ‚¬μš©μž μš΄λ™ 기둝 κ΄€λ ¨ API κ΅¬ν˜„
    • 닀이어리 κ΄€λ ¨ κΈ°λŠ₯, S3 버킷 연동 톡해 λ¦¬μ†ŒμŠ€ 관리 API κ΅¬ν˜„
    • EC2 μ„œλ²„ ν™˜κ²½ μ„ΈνŒ… 및 배포
      • DB μ„ΈνŒ… 및 관리
      • Nginx ν†΅ν•œ ν”„λ‘μ‹œ μ„€μ •
      • Certbot 톡해 SSL ꡬ좕

About

Languages

Language:JavaScript 52.0%Language:Java 47.2%Language:CSS 0.5%Language:HTML 0.3%