솔로 던전 크롤링 카드 게임 만들기

Source: Dev.to

분명히 말해두자면 – 보기 흉합니다. 이것이 현재까지 만든 웹 기반 던전 탐험 카드 게임의 메인 화면이며, 보드 게임 Scoundrel에서 영감을 받았습니다.

Scoundrel를 들어보지 못했다면, 아마 많이 보지 못했을 겁니다. 유튜브에서 무작위 영상 추천을 통해 흥미를 느꼈고, 직접 버전을 만들기로 했습니다.

왜 이렇게 못생겼나요?

이 프로젝트는 React JS로 제작했으며, 웹 개발 여정의 일환으로 React를 배우고 있습니다. 핵심 게임 로직을 작동시키고 UI를 올바르게 업데이트하는 데 초점을 맞췄습니다. 예를 들어, 아래 스크린샷은 페이지 로드 시 네 장의 카드가 표시되는 모습을 보여주며, 그 중 몬스터 카드의 아이콘과 힘은 동적으로 생성됩니다. 카드는 덱에서 뽑히고, 나타날 때마다 덱에서 제거됩니다.

몬스터 카드를 클릭하면 카드가 사라지고, 플레이어는 체력을 잃으며, 나머지 카드는 순서를 유지합니다:

도전 과제

이 메커니즘을 구현하는 것은 React에 익숙하지 않은 사람에게는 가파른 학습 곡선이었습니다. 경험이 많은 개발자라면 더 수월할 수 있지만, 처음부터 로직을 직접 짜보는 과정은 보람 있었습니다.

이것은 AI 프로젝트가 아닙니다

때때로 빠른 질문에 답하기 위해 AI를 사용합니다(예: useRef 값을 useEffect 의존성 배열에 넣을 수 있는지, public 폴더의 이미지가 로드되지 않는 이유 등). 하지만 코드의 약 99 %는 제가 직접 작성했으며, AI 도움은 최소화하고 스킬 향상에 집중하고 있습니다.

대대적인 초보자 리팩터링

계획에 많은 시간을 들이지 않습니다; 바로 뛰어들어 무언가를 실행하는 것을 선호합니다. 밤새(새벽 7시까지) 작업한 뒤, 카드 클릭이 게임 내 다른 효과를 트리거하도록 대부분의 게임 로직을 리팩터링했습니다(위에서 보여준 대로). 힘든 리팩터링이었지만 많은 것을 배웠고, 후회는 없습니다.

게임 아이디어는 무엇인가요?

이 게임은 솔로 던전 탐험 카드 게임으로, 솔리테어와 비슷한 정신을 가지고 있습니다. 플레이어는 방을 탐험하고, 몬스터와 마주하고, 무기를 찾으며, 포션을 모읍니다. 전리품을 획득할지, 싸울지, 도망칠지를 결정해야 합니다. 목표는 방을 통과하며 살아남는 것이며, 체력이 0이 되면 사망합니다:

세부 규칙은 많습니다—예를 들어 어떤 무기가 어떤 몬스터를 공격할 수 있는지, 몇 번까지 도망칠 수 있는지 등—하지만 핵심 개념은 간단합니다: 던전을 살아남는 것.

자세한 내용이 궁금하다면 언제든 물어보세요(또는 영감을 얻기 위해 Scoundrel을 찾아보세요).

의견을 들려주세요!

게임 아이디어, 초기 시각 디자인, 혹은 게임을 만들면서 겪은 비슷한 도전 과제에 대한 피드백을 환영합니다. 읽어주셔서 감사합니다! 🥳