온라인 보드게임 만들기

직접 만든 보드게임의 규칙을 자바스크립트로 쓰면, 판 그리기와 온라인 대전, 기보, AI 상대는 보드마당이 맡습니다. 무료이고, 친구는 설치 없이 링크 하나로 들어와 둡니다.

규칙 쓰기
보드
온라인 대전
AI 상대

이렇게 만듭니다

1. 규칙 쓰기

npx boardmadang new my-game으로 틱택토에서 시작하는 게임 폴더를 만듭니다. index.js에 시작 판, 수를 두면 바뀌는 판, 누구 차례인지, 누가 이겼는지, 화면에 그릴 것을 씁니다. npx boardmadang dev를 켜면 두 플레이어의 판이 나란히 보여서 혼자 양쪽을 둬 보며 고칠 수 있습니다.
2. 올리기

npx boardmadang pack으로 만든 zip을 게임 등록 화면에 올립니다. 규칙 코드가 지켜야 할 것, 무작위로 200판을 둬도 오류가 없는지, 충분히 빠른지를 자동으로 검사합니다. 혼자 한 판을 이기면(클리어 체크) 이름, 소개, 룰북을 적어 등록합니다.
3. 같이 두기

등록하면 게임 목록에 나옵니다. 대전 찾기, 방 만들기, 관전, 기보 다시보기가 바로 됩니다. 내 프로필에서 "AI 만들기"를 누르면 AI 상대와 선공·후공 승률도 생깁니다.

게임 코드는 이렇게 생겼습니다

게임은 객체 하나입니다. 네트워크, 화면, 상대가 누구인지는 신경 쓰지 않고 규칙만 씁니다.

index.js

1export default {
2  id: 'my-game',
3  board: { places: 'cells', rows: 3, cols: 3 },
4  pieces: 'xo',
5  maxActions: 9,
6
7  setup(rng) { // 시작 상태
8    return { board: Array(9).fill(null), turn: 0 };
9  },
10  play(state, player, action) { // 둘 수 없는 수면 받은 상태 그대로
11    const i = action.row * 3 + action.col;
12    if (player !== state.turn || state.board[i] !== null) return state;
13    const board = state.board.slice();
14    board[i] = player;
15    return { board, turn: 1 - player };
16  },
17  turn(state) { return state.turn; }, // 누구 차례인지
18  result(state) { return null; },  // 끝났으면 { winner }
19  view(state, player) { /* 판에 그릴 기물 */ },
20};

누가 칸을 누르면 두 플레이어의 브라우저가 같은 수를 같은 순서로 play()에 넣습니다. 그래서 둘은 늘 같은 판을 보고, 대전 서버를 따로 만들지 않아도 됩니다.

무엇이 다른가요

규칙을 코드가 지킵니다. 둘 수 없는 수는 둬지지 않고, 승패도 자동으로 가립니다. 판과 말만 주는 도구에서는 규칙을 사람이 지켜야 합니다.
대전에 필요한 것이 다 있습니다. 매칭, 방 만들기, 대국 시계, 관전, 기보 다시보기를 보드마당이 맡습니다.
AI 상대가 생깁니다. AlphaZero 방식으로 학습한 AI와 혼자서도 둘 수 있고, AI끼리 둔 판으로 선공과 후공 중 누가 유리한지 봅니다. AI 소개
무료이고 코드가 공개돼 있습니다. 서버와 화면은 AGPL-3.0, SDK는 MIT 라이선스로 GitHub에 있습니다. 올린 게임의 저작권은 만든 사람에게 남습니다.

이런 게임을 만들 수 있습니다

두 사람이 번갈아 두는 1대1 보드게임
최대 32×32 판, 칸 안이나 교차점에 놓기
체스 기물, 바둑돌, X와 O, 장기·쇼기 같은 글자 패
놓기, 옮기기, 잡기, 칠하기, 특수 행동(넘기기 같은 버튼)

보드마당에서 만든 게임

틱택토가로, 세로, 대각선 중 한 줄을 먼저 채우면 이깁니다.
스플체스기물이 지나간 칸을 내 색으로 칠하는 체스. 상대 기물 주변을 모두 칠하면 잡습니다.
개척 오목돌을 두면 판이 넓어지는 오목. 내 돌 곁에 둘수록 칸을 더 얻어, 판을 넓히며 다섯 줄을 노립니다.
십이장기3×4 판에 기물 넷으로 두는 작은 장기. 잡은 기물은 내 편으로 다시 놓습니다.

자주 묻는 질문

코딩을 할 줄 알아야 하나요?: 규칙은 자바스크립트로 씁니다. 처음 만든 폴더의 틱택토를 조금씩 고쳐 나가면 되고, AI 코딩 도구에 SDK 문서와 룰을 주고 초안을 받아도 됩니다.
돈이 드나요?: 아니요. 보드마당은 개인이 운영하는 무료 사이트입니다. 게임을 하는 사람도 로그인 없이 게스트로 둘 수 있습니다.
올린 게임의 권리는 누구에게 있나요?: 만든 사람에게 남습니다. 보드마당은 대전, 관전, 기보, AI 상대처럼 서비스에 필요한 만큼만 씁니다. 자세한 내용은 약관에 있습니다.
세 명 이상이 하는 게임도 되나요?: 지금은 두 사람이 번갈아 두는 게임만 됩니다.