esports fullstack app

e스포츠 풀스택 앱

• 에 대한
• 웹 클라이언트
• 웹 서버/API
• 모바일 클라이언트
• 설치
• 추가 메모

에 대한

이 애플리케이션을 통해 사용자는 자신의 가용성을 게시하고 동일한 게임을 플레이하는 다른 사용자를 찾아 연결하여 함께 플레이할 수 있습니다.

이 프로젝트에서는 클라이언트-서버 아키텍처의 기본을 탐구하는 것이 전제였습니다. 백엔드는 들어오는 요청을 기반으로 리소스를 제공하고 생성하기 위한 간단한 REST API를 노출합니다. 클라이언트 측에서 웹 및 모바일 앱은 서버와의 통신을 담당할 뿐만 아니라 사용자 상호 작용을 처리하기 위한 인터페이스를 제공합니다.

웹 클라이언트

ReactJS로 구축된 웹 클라이언트. 주요 기능에는 게임 나열 및 광고 작성이 포함됩니다.

도구

• 타입스크립트
• ReactJS
• 순풍CSS
• 기수 UI
• 액시오스

웹 서버/API

리소스 나열 및 생성을 위한 경로가 포함된 Rest API입니다.

도구

• NodeJS
• ExpressJS
• 프리즈마 ORM
• SQLite
• 타입스크립트

모바일 클라이언트

크로스 플랫폼 모바일 클라이언트는 React Native로 구축되었습니다. 주요 기능에는 광고 탐색 및 플레이어 찾기가 포함됩니다.

도구

• 타입스크립트
• 리액트 네이티브
• 엑스포

설치

• 애플리케이션 루트 디렉터리(모바일, 서버 또는 웹)로 이동합니다.
• npm install 실행하여 종속성 설치
• npm run dev 로 애플리케이션 실행

명심해야 할 두 가지 사항:

• 클라이언트 앱을 실행하기 전에 서버를 설치하고 실행할 수 있습니다.
• 현재로서는 이 프로젝트의 어떤 애플리케이션도 배포할 준비가 되어 있지 않습니다.

추가 메모

• 이 프로젝트는 위에 언급된 도구/기술/개념에 대한 나의 기술을 개발 및/또는 보여주기 위한 순전히 실용적인 연습입니다. 완전한 생산 준비 솔루션을 의미하는 것은 아닙니다. 궁금한 점이 있거나 이야기를 나누고 싶으시면 언제든지 연락주세요!
• 이 연습은 Rocketseat의 Ignite ReactJS 프로그램의 교훈을 따라 작성되었습니다. 제가 수정/재설계했을 수도 있고 아닐 수도 있습니다.