태그
React
TypeScript
Context API
SCSS
Framer Motion
날짜
Jun 30, 2023 → Aug 17, 2023
배포
https://kj2b-handsup.github.io/client
깃허브
https://github.com/KJ2B-HandsUp/client
포스팅
Video preview
💡
HandsUp은 모션 인식을 활용한 웹 기반 실시간 대전 보드 게임 서비스입니다.
 

👉🏻 서비스: https://kj2b-handsup.github.io/client

(WebRTC 및 로그인 서버가 내려간 상태라 로그인 없이 튜토리얼 모드만 플레이 가능합니다..!)

👉🏻 깃허브: https://github.com/KJ2B-HandsUp/client

 
 

사용한 기술 스택

프론트엔드
  • TypeScript, React
  • Context API, Axios, socket.io
  • Styled-Components, Framer Motion
  • Eslint, Prettier
  • S3, Cloud Front, Route53
 
백엔드
  • JavaScript, Express
  • WebRTC
  • DynamoDB
  • Kakao Login API

담당한 파트

FE 개발, 기획, 디자인 담당
 
프론트엔드
  • 1대1 대전 게임을 즐길 수 게임 관련 페이지(대전, 튜토리얼 페이지)
  • 보드 게임 로직 구현
  • 손 모션 인식을 활용한 화면 터치 기능 구현
  • socket.io를 활용한 실시간 게임 데이터 전송 및 동기화
  • Context API를 활용한 유저, 모달 전역 상태 관리
 

발표 자료

💡
피칭 발표 자료
HandsUp-발표자료.pdf
13111.5KB
notion image