NEO

1. 개요

NEO는 게임 서버 대여 및 간편 관리 서비스입니다.
NEO는3가지의 문제에 대해 집중하였습니다.

1. 처음 게임 서버를 개설하는 사람들은 스스로 게임 서버를 개설하기 위해 시간과 노력이 들어갑니다.
2. 게임 서버를 개설한 서버 관리자는 자신의 서버를 알리기 위해서 커뮤니티에 글을 올려야 합니다. 이는 서버와 커뮤니티가 따로 분리되어 관리해야하는 것을 의미합니다.
3. 서버 관리자는 게임 서버를 개설하고 게임을 즐기는 경우, 대체로 짧은 기간 동안만 게임을 하는 경우가 많습니다.

NEO는 각각의 문제에 맞서

1. 처음 게임 서버를 개설하는 사람들에게 단순한 UI로 게임을 관리하게 합니다.
2. 서버 관리자가 웹 상에서 서버 관리와 서버 커뮤니티를 동시에 관리하게 합니다.
3. 서버 관리자는 시간에 따른 비용을 지불하는 시간 요금제를 통해 짧은 기간 동안 대여할 수 있습니다.

2. 주요 기능

NEO의 주요 기능은 3가지로 나뉩니다.

1. 게임 서버 관리

• 서버 시작, 정지, 게임 맵 & 모드 & 플러그인 추가, 게임 서버 로그,서버 상태 등의 서버 운영에 필요한 UI 제공합니다.

2. 게임 서버 커뮤니티

• 서버 관리자가 연 서버 목록을 서버 관리자가 원할 경우, 다른 사용자가 볼 수 있습니다.
• 서버 참여, 서버 참여를 희망한 인원의 승인/거절, 참여 인원등의 서버 인원에 대한 관리 UI를 제공합니다.

3. 게임 서버 대여

• 저희가 선정한 게임 서버 용량(메모리) 선택지를 서버 관리자에게 추천합니다.
• 서버 관리자가 사용했던 서버를 다시 대여 가능합니다.
• 서버 대여시, 결제한 요금제에 따라 시간제일 경우 대여한 시간에 따라 가격을 받고, 기간제일 경우 기간에 맞게 요금을 받습니다.

3. 시스템 구조

Main Server : 유저의 요청에 따라 백엔드 기능 및 Edge Server 내에 유저의 도커 서버와 게임 서버를 관리합니다.
Edge Server : 유저의 게임 서버를 도커 위에 띄워서 실행시키는 서버, 여러 Edge Server를 둘 수 있으며, 이 중에 Main Server에서 메모리를 기준으로 Edge Server를 선택하고, 도커 서버를 할당하여 게임 서버를 Managing process를 통해 관리합니다.

Teck Stack

4. 팀원 소개

5. 프로젝트 포스터

2024-1학기 아주대학교 소프트콘에 제출한 포스터입니다.

6. 백엔드 사용법

env.properties 세팅

web/back/src/main/resources/env.properties 파일에 환경 설정을 세팅해야합니다.

SPRING_JWT_SECRET=...

NAVER_CLIENT_ID = ...
NAVER_CLIENT_SECRET = ...
GOOGLE_CLIENT_ID = ...
GOOGLE_CLIENT_SECRET = ...

edgeservers.ip=...
edgeservers.id=...
edgeservers.user.id=...
edgeservers.externalIp=...
edgeservers.password=...
edgeservers.memoryTotal=...
edgeservers.memoryUse=...
edgeserver.number = ...

KEY_STORE_PASSWORD = ...

SPRING_MAIL_USERNAME = ...
SPRING_MAIL_PASSWORD = ...

MAIN_SERVER_IP = ...
pay.secret_key = ...

BackEnd 실행

환결 설정 후, 아래 코드를 실행합니다.

cd web/back/
./gradlew bootrun

EdgeServer 실행

Edge Server에 게임 서버 도커 이미지를 만들어야 Edge Server에 게임 서버를 생성할 수 있습니다. 해당 Edge Server에 이동하고, 깃허브의 game-server/dockerGameServer/ 폴더에 있는 모든 데이터를 옮겨와서

 docker build -t mc1.16.5 -f Dockerfile_mc1.16.5 .
 docker build -t mc1.19.2 -f Dockerfile_mc1.19.2 .
 docker build -t mc1.20.4 -f Dockerfile_mc1.20.4 .
 docker build -t palworld -f Dockerfile_palworld .
 docker build -t terraria -f Dockerfile_terraria_vanila .

와 같이

docker build -t 폴더명 -f Dockerfile_폴더명 .

으로 도커이미지를 생성해줍니다.

7. 프론트엔드

• 프론트는 Framer를 이용하여 웹 디자인과 기능을 개발하였습니다.
• 특히 기능 부분은 Framer 안에서 React, Typescript, JSX를 통해 개발했습니다.

Framer 사용 이유

• 디지털 화면에서 디자인 요소들은 상호작용을 통해 바뀌는 특징이 있습니다.
• 일반 그래픽 툴을 이용하여 디자인하면 상호작용하는 화면 요소들을 하나하나 다 그려내야만 합니다.
• 하지만 Framer는 이 상호작용 과정을 코드를 사용하지 않고 쉽게 도와줍니다.
• 그리고 Framer 툴 내에서 협업할 수 있는 특징이 있어, 개발할 때 사용해야 하는 많은 툴들을 줄여줄 수 있습니다.

Framer 사용법

기본 화면

1) Pages/Layers/Assets

• Pages: 다양한 페이지를 만들고 볼 수 있습니다.
• Layers: 페이지 속 각각의 레이어들을 만들고 볼 수 있습니다.
• Assets: 페이지 속 각각의 레이어와 컴포넌트들에게 디자인이나 코드를 입힐 수 있습니다. 2) 작업 화면
• Pages/Layers/Assets이 보이는 화면입니다.
• 화면 크기에 따른 페이지의 변화를 나눠서 확인해 반응형 디자인을 하기에 용이합니다. 3) 선택 요소의 여러가지 설정
• 선택한 요소의 링크, 위치, 크기, 레이아웃, 이펙트, 오버레이, 커서 등의 디자인적 요소들을 쉽게 설정할 수 있고, Code Override도 가능합니다.

헤더

4) 삽입

• 여러 가지 기본 제공하는 페이지나 기능들을 삽입할 수 있습니다.
• 또한 Actions에서는 자기가 원하는 디자인 요청 사항을 쓰면, AI가 디자인을 구현해 줍니다. 5) 멤버 관리 및 프로젝트 관리
• 멤버 관리를 할 수 있고 프로젝트 미리보기, 도메인 대여 및 웹 페이지 배포를 쉽게 할 수 있습니다.

디자인 컴포넌트

• 어떤 버튼을 눌렀을 때 어떤 화면이 보이는 지 같은 디자인 요소를 설정할 수 있는 컴포넌트를 제작하고 이용할 수 있습니다.

코드 컴포넌트

• 코드로도 return되는 디자인이 존재하면, 컴포넌트로 제작하고 사용할 수 있습니다.

주요 컴포넌트

• Header: 상단 바 컴포넌트
• Footer: 하단 바 컴포넌트
• Login: 로그인 컴포넌트
• Signup: 회원가입 컴포넌트
• CreateServer: 서버 대여 컴포넌트
• MyPageVarient: 마이 페이지 컴포넌트
• MyServerlists: 내 서버 목록 페이지 컴포넌트
• OpenServerList: 공개 서버 목록 페이지 컴포넌트
• ManagerTool: 관리자 페이지 컴포넌트
• Question: 문의하기 컴포넌트
• Tutorial: 튜토리얼 컴포넌트

Framer URL

• https://framer.com/projects/NEO--H1Fqms6Su09vkk1kjXSR-6Qbvu