<aside> 📸 Intro: 풋살 온라인 프로젝트

</aside>

                                                                      *이 때는 우리형이었지…*

안녕하세요! 강창민 튜터입니다.

여러분! 피파 온라인 4(현재는 FC 온라인으로 이름이 바뀌었어요)이란 게임은 다들 아시죠? EA에서 만들고 넥슨에서 퍼블리싱하는 대표적인 온라인 축구게임입니다.

이번 게임서버 트랙 팀 프로젝트는 피파 온라인 4를 오마주한 풋살 온라인이란 게임을 만들어보려고 합니다. 물론, 저희가 지금까지 공부한 기술 기반으로 최대한 만들어보려고 하니 너무 어려운 과제가 아닐까 걱정하실 필요는 전혀 없습니다!

혹시라도, 피파 온라인 4라는 게임을 잘 모르신다고 하면 걱정마세요! 좀 있다가 뒤의 섹션에서 우리가 만들 게임엔 어떠한 기능들이 있어야 하는지를 소개해드리도록 하겠습니다!

참고로, 이번에는 따로 구현해야 하는 API 목록을 드리진 않을 것입니다. 이제는 여러분들이 기능 정의만 보고 어떤 것들을 구현해야 되겠네… 라고 감이 오실 수 있어야 되니깐요!

그렇다면, 이제 어떻게 팀 프로젝트를 진행하면 될지 간단하게 개발 프로세스 가이드를 드리도록 하겠습니다!

<aside> 🏭 개발 프로세스 가이드

</aside>

• 1단계. API 명세 작성하기!

  • 이건 뭐… 말 안해도 이제 익숙하시죠?!
  • 제가 아래에서 설명하는 필수 기능 / 도전 기능들을 API 명세를 하고 시작하는 것이 좋아요!
    • 그래야, 팀원 모두가 동의한 스펙 내에서 구현을 하는 것이니까요!

• 2단계. ERD 작성하기!

  

                                          *이미지 출처: [<https://drawsql.app/templates/airbnb>](<https://drawsql.app/templates/airbnb>)*
  

  • API 명세로 어떤 기능을 구현해야겠다고 감이 잡혔다면 이제 유저들의 데이터를 저장할 데이터베이스 스키마를 설계해야하고 이는 ERD로 표현되어야 합니다!
  • ERD를 사용하면 팀원들이 풋살 온라인의 데이터베이스의 구조를 쉽게 이해하고 더 효과적인 데이터베이스 설계를 할 수 있어요!
  • ERD를 설계할 때는 아래에 해당되는 속성들을 정의하고 ERD 설계를 하셔야해요!
    • E(Entity. 개체)
      • 여러분들의 서비스에서 필요로 하는 데이터를 담을 개체를 식별하도록 해요.
        • 예를 들어, 사용자, 게시물, 댓글 등이 될 수 있어요.
    • A(Attribute. 속성)
      • 각 개체가 가지는 속성을 정의하도록 해요.
        • 예를 들어, 사용자 개체는 이름, 로그인 아이디, 비밀번호 등의 속성을 가질 수 있어요.
    • R(Relationship. 관계)
      • 개체들 사이의 관계를 정의하도록 해요.
        • 예를 들어, 사용자와 게시물 사이에는 작성하다라는 관계가 있을겁니다.

• 3단계. 와이어프레임 작성하기!

  

  이미지 출처: https://www.visual-paradigm.com/learning/handbooks/agile-handbook/wireframe.jsp

  • 우리가 프론트엔드 구현은 하지 않지만 전반적인 게임의 흐름을 파악하기 위해서 와이어프레임을 작성해보시는 것은 여러분들의 구현에도 매우 도움이 됩니다!
  • 이로 인해, 기능 목록에 빠진 기능은 없는지 체크하고 어떠한 기능이 있으면 더 좋을 것 같은지에 대해서 구상을 해 볼 수 있습니다.
  • Figma나 Sketch 혹은 Draw.io와 같은 SaaS를 사용해도 좋고요. 아니면 파워포인트나 키노트와 같이 어플리케이션을 사용해도 상관이 없습니다. 예쁘지 않아도 좋으니 우리 프로젝트의 형태에 대해서는 구체적으로 정의가 되어야 합니다!

• 4단계. 본격적인 백엔드 개발하기!

  • Node.js를 이용하여 본격적으로 서버를 개발합니다.
  • 백엔드 개발을 하기 이전에 반드시 팀 내에서 업무 분장을 한 후에 feature 브랜치 별로 작업해주셔야 된다는 것은 다들 알고 계시죠?

• 5단계. 테스트 및 버그 수정하기!

  • 개발한 기능들이 제대로 작동하는지 테스트해봅니다.
  • 아직 테스트 코드를 작성하는 법을 배우기 전이니 와이어프레임과 유저 시나리오를 기반으로 철저하게 테스트를 해보는 것을 목표로 해요!
  • 그리고 버그나 오류를 찾아 수정하고, 사용성을 향상시킬 수 있는 부분이 있는지 찾아보세요!