클로드 코드로 웹 게임 만들기

Claude Code는 Anthropic이 만든 AI 코딩 도구예요. 터미널(명령을 입력하는 창)에서 말로 부탁하면, 내 컴퓨터의 게임 폴더에 파일을 직접 만들고 고쳐 줘요. 채팅창에서 코드를 복사해 붙여 넣는 방식보다 고치는 속도가 훨씬 빨라서, 해 보고 고치기를 수십 번 반복하는 게임 만들기에 잘 맞아요.

이 글은 터미널을 처음 열어 보는 사람도 첫 게임을 한 판 해 보는 데까지 갈 수 있도록 순서대로 적었어요. 코드를 읽을 줄 몰라도 괜찮아요.

1. 준비물

• 컴퓨터 한 대(맥, 윈도우, 리눅스 모두 돼요)
• Claude 유료 요금제(Pro나 Max) 또는 Anthropic API 키. Claude Code 자체는 무료로 설치하지만, AI를 쓰는 비용은 요금제나 API 사용료로 내요.
• 게임을 열어 볼 브라우저(크롬, 사파리, 엣지 등)

2. Claude Code 설치하기

맥이나 리눅스는 터미널을, 윈도우는 PowerShell을 열고 아래 명령을 붙여 넣은 뒤 엔터를 눌러요.

맥, 리눅스

curl -fsSL https://claude.ai/install.sh | bash

윈도우(PowerShell)

irm https://claude.ai/install.ps1 | iex

설치 방법은 바뀔 수 있어요. 명령이 안 되면 Anthropic의 Claude Code 공식 문서에서 최신 설치 방법을 확인하세요.

3. 게임 폴더를 만들고 시작하기

게임 파일이 모일 빈 폴더를 만들고, 그 폴더에서 Claude Code를 실행해요.

mkdir my-game
cd my-game
claude

처음 실행하면 Claude 계정으로 로그인하라는 안내가 나와요. 안내대로 로그인하고, 이 폴더를 써도 되는지 물으면 허락하면 돼요.

4. 첫 프롬프트

규칙, 조작, 끝나는 조건, 화면을 한 번에 알려 주세요. 파일 이름을 index.html로 정해 두면 나중에 웹에 올릴 때 편해요.

Claude Code가 파일을 만들기 전에 허락을 물으면 내용을 보고 허락하면 돼요.

5. 만든 게임 열어 보기

폴더에 생긴 index.html 파일을 더블클릭하면 브라우저에서 게임이 열려요. 파일을 찾기 어렵다면 Claude Code에게 "index.html을 브라우저로 열어줘"라고 부탁해도 돼요. 휴대폰에서 어떻게 보이는지는 브라우저 개발자 도구의 모바일 보기로 확인할 수 있어요.

6. 해 보고, 느낀 그대로 고쳐 달라고 하기

한 판 해 보고 코드 대신 느낌을 말하세요. Claude Code가 알아서 해당 부분을 찾아 고쳐요.

한 번에 한두 가지만 고치면 무엇이 좋아지고 무엇이 망가졌는지 알기 쉬워요. 이상해졌다면 "방금 고친 걸 되돌려줘"라고 하면 돼요.

7. 오래 만들 때 도움이 되는 습관

• 규칙을 메모 파일에 적어 두기. 폴더에 CLAUDE.md라는 파일을 만들어 게임 규칙과 지켜야 할 점을 적어 두면 Claude Code가 시작할 때마다 읽어요. "이 게임의 규칙과 지금까지 정한 것을 CLAUDE.md에 정리해줘"라고 부탁하면 돼요.
• 잘 된 상태마다 저장하기. "지금 상태를 git으로 저장해줘"라고 하면 되돌아갈 지점이 생겨요.
• 막히면 설명부터 듣기. 같은 부탁을 반복하기보다 "왜 안 되는지 먼저 설명해줘"라고 하면 문제를 더 빨리 찾아요.

8. 다음 단계

게임이 마음에 들면 만든 게임 무료로 웹에 올리기를 보고 주소를 만든 뒤, 바이브게임의 게임 올리기로 첫 출시를 해 보세요. 이달의 게임잼 주제로 만들면 더 많은 사람이 해 봐요.