home
안녕하세요 한범석입니다.👐
이곳은 컴포넌트 개발, css 테스트를 위한 공간입니다.
이외에도 사용자들의 상호작용을 위한 요소가 존재합니다.
포트폴리오 이동 ➡️
1. 미니미 🤡
💡 웹 클라이언트와 서버 간의 실시간 양방향 통신을 위해
Socket.IO
를 활용했습니다.
◾️ 방향키를 이용해 캐릭터 이동이 가능합니다🏃
◾️ z 방향키 입력 시 춤을 출 수 있습니다👯♀️
◾️ 모니터 주사율로 인한 이동 속도 차이가 있습니다..🥲
미니미 맵 이동
오른쪽 위 캐릭터를 누르면 캐릭터 선택창으로 이동가능합니다.
캐릭터 선택 창
원하는 캐릭터와 이미지를 선택한 뒤 save 버튼을 클릭하면 맵으로 이동합니다
캐릭터 이동
➡️ ⬅️ ⬆️ ⬇️ 방향키를 이용해 이동할 수 있습니다.
캐릭터 춤
🆉 방향키를 꾹 누르면 캐릭터가 춤을 춥니다
2. 채팅 💬
💡 웹 클라이언트와 서버 간의 실시간 양방향 통신을 위해
Socket.IO
를 활용했습니다.
◾️ 미니미 맵 상에서 채팅이 가능합니다.
◾️ 어떠한 공간에서도 전체 채팅이 가능합니다.
◾️ 두 채팅 공간은 나누어진 공간입니다.
◾️ 채팅 내용은 웹 사이트 종료 시 저장되지 않습니다..🥲
미니미 채팅
미니미 맵 아래 메시지를 입력하세요를 누르면 채팅이 가능합니다.
전체 채팅
오른쪽 아래 채팅 버튼
을 누르면 전체 채팅이 가능합니다.