[TerraBlock] 리액트로 2D 마인크래프트 만들기

Covy·2022년 5월 19일
0

TerraBlock

목록 보기
1/1
post-thumbnail

게임을 만들기 위해 리액트를 사용하는게 아닌,
리액트 실력을 키우기 위해 게임을 만들고 있습니다.

🤔 리액트로 게임을?? 🤔

1. 리액트 실력을 키우기 위해

간단한 게임들을 사이드 프로젝트로 해보니 깊게 생각해야 할 부분도 많고 간간히 알고리즘이 필요한 부분들이 있었다.
새로운 기술이 조금 익숙해지면 간단한 게임을 만들어 보며 부족한 부분을 키우곤 한다.

전에 몇 번 게임 사이드 프로젝트를 만들어보며 생각해본 장점을 나열하면

  • 기획한 기능을 추가하기 위해서는 새로운 언어나 기술을 알아야 하는 경우가 꽤 있었다.
    (멀티플레이를 위한 PHP와 Node.js, 데이터 저장이나 전송을 위한 RDB, SQL, JSON 실시간 변화 반영이나 채팅을 위한 Socket 등등.. 이 모든 걸 게임을 만들면서 배웠다.)
  • 프로젝트의 전체적 구조를 잡는 사고력이 증가한다.
    (생각보다 게임을 웹으로 구현할 때 구조는 복잡하다. 열심히 구현한 한 뭉텅이의 코드를 지우거나 하나하나 수정하는 쓴 맛을 봐온 결과, 키보드를 치기 전에 생각하는 습관을 가지게 되었다.)
  • 사용자와의 상호작용(keyEvent, MouseEvent)이 게임의 시작과 끝이라 다양한 Event handling 경험과 최적화 경험이 쌓인다.
  • 성능 최적화 경험, 평소엔 사용하지 않던 CSS구문들을 사용, 등등..

정도가 있다. 사실 대부분이 모든 사이드 프로젝트들의 장점이지만 게임 프로젝트만의 특수한 장점도 확실히 있다.

2. 사이드 프로젝트의 완성을 위해

다양한 부분에서 사이드 프로젝트를 시도했었다.
주니어 개발자들을 위한 커뮤니티 플랫폼은 기획만 왕창 하다가 접었고.

Covid-19-KR은 Axios를 사용해 정부에서 일일 확진자 수 API를 받아 그래프를 보여주는 프로젝트였는데 만들어 보니 완성도가 떨어졌다.

이랬던 내가 게임을 만들기 시작하면 없던 열정도 생기고 프로젝트에 부족한 부분들이 더 잘 보였으며, 어떻게든 완성하고 발전시켰던 경험이 있다.

3. 재미를 위해

사실 이 부분이 가장 크다.

평소에도 게임을 좋아하는 난 웹 개발을 처음 접했을 때부터 간단한 게임들을 만들며 실력을 키웠다.
개인적으로 게임을 하는 것 보다 게임을 만드는 것이 더 재미있는 것 같다.

⛏️ TerraBlock? ⛏️

이번엔 어떤 게임을 만들까.. 고민하다가 "어릴 적 즐겨했던 마인크래프트를 내가 만들어보면 어떨까?" 라는 생각으로 시작했다.

사진엔 별 것 없어 보이지만 여기까지 개발하는 것도 꽤 복잡했고 오래 걸렸다.
마인크래프트를 해봤다면 알겠지만 맵에 있는 블럭(나무, 광물)을 캐고 블럭들을 조합해서 다른 아이템을 만들고 집을 만들고... 하는 게임으로 구상중이다.

개발하면서 만난 문제들

지금껏 개발해보면서 만난 문제들을 나열해보면

  • React에서 key event를 처리했던 경험
  • Zustand에서 변경된 State가 렌더링되지 않던 문제
  • 현재 타겟팅된 블럭을 렌더링 하면서 만난 최적화 문제
  • 인벤토리에서 마우스 이벤트(click, drag)
  • 등등...

앞으로 벨로그에 TerraBlock을 개발하면서 만난 문제들과 오류들 공부한 것들을 올릴 예정이다.

TerraBlock Github

profile
Jr. FE Developer

0개의 댓글