본문 바로가기

Project3

[Projects] "라이어게임:비밀의 문" 게임 룰 구현하기 JavaScript와 React, WebSocket(SockJS, Stomp)을 사용하여 라이어게임을 Web으로 구현한 방식에 대한 간단한 설명. 이번 포스트는 제가 작성한 방식을 간단하게 설명하는 내용이며 더 좋은 다른 방식이 있을 수 있습니다. 😃 Github repository : https://github.com/HangHae-TheFinalProject/FrontEnd 라이어 게임의 룰을 살펴보면 크게 몇 단계의 스테이지로 이루어져 있다는 걸 알 수 있다. 각 유저에게 할당된 라이어여부/키워드를 공개하는 스테이지 각 유저가 키워드에 대해 발표하는 스테이지 라이어로 예상되는 유저를 투표하는 스테이지 라이어로 지목된 유저가 정답을 맞추는 스테이지 승/패를 출력하는 스테이지 이를 stageNumber.. 2023. 6. 11.
[Projects] 라이어게임:비밀의 문 개요 개발기간 : 2022.11.04 ~ 2022.12.02 인원 : 총 6인 (FE 3인, BE 2인, Design 1인) 기술 : JavaScript, React, Redux, SCSS, WebSocket, WebRTC 주요기능 1. 화상채팅과 채팅 2. Web Socket을 이용한 게임 기능 3. 실시간 업적 달성 알림 기능 4. 게시글, 댓글 CRUD 및 검색 및 정렬 기능 5. 로그인, 소셜로그인 Github : https://github.com/HangHae-TheFinalProject/FrontEnd 시연 영상 작업 내용 Open vidu를 이용하여 게임 내 화상채팅 기능 구현 Class component로 작성된 Open-vidu 코드를 Function component로 변경하여 작업 게.. 2023. 6. 11.
[Projects] Pinterest clone coding 개요 개발기간 : 2022.10.28 ~ 2022.11.03 인원 : 총 6인 ( FE 3인, BE 3인 ) 기술 : JavaScript, React, Redux, Styled components, Axios 주요기능 1. Login(JWT) 2. 게시글과 댓글, 대댓글 CRUD & 댓글 좋아요 3. 반응형 웹 Github : https://github.com/Hanghae99-CloneWeek-team3/frontend 시연 영상 담당 작업 댓글, 대댓글 CRUD 및 댓글 좋아요. Dropdown, Icon, Button, Modal 공용 컴포넌트 작성 컴포넌트 내에 Base가 되는 기능들을 작성한 후 매개변수로 요청 받은 동작을 할 수 있도록 작성 반응형 웹 window.innerWidth, 반응형 .. 2023. 6. 9.