이번 글은 교내 Github 기여도 순위를 표시한 DGIT 사이트를 개발한 과정과 1차 배포를 진행한 내용을 작성하겠습니다.
프로젝트 기획
사이드프로젝트를 못한지 거의 5개월이 넘어가며 개발에 나태해지기 시작했습니다. 어떤 사이드 프로젝트라도 해보자는 생각으로 개인 사이드프로젝트를 기획하게 되었습니다.
노션으로 간단하게 기획을 시작했고 사용해볼 기술스택을 정했습니다.
기술스택을 정하는 부분은 많이 고민했던 부분입니다. 평소 써보고 싶었던 새로운 기술들과 항상 썼던 기술들을 적절하게 섞어서 밸런스를 맞춰야됐기 때문입니다.
프론트엔드는 React + Mobx를 통해 개발하였습니다. React 사실 써본적이 없었지만 이번 프로젝트를 통해서 React를 공부해보고 싶었다는 생각이 들었습니다. 예전 Vue를 몇번 사용해본적이 있어서 어렵지 않게 배울 수 있다고 생각했습니다.
백엔드는 평소 사용하는 Express 바탕의 프레임워크인 NestJS를 선택하였습니다. 기본적으로 Typescript를 지원하기에 편하게 작업할 수 있을거 같았습니다. DB는 PostgreSQL을 사용하기로 했습니다.
개발, 구조
먼저 Github API를 매번 요청하여 사용하는건 속도도 느리며 Github API의 요청 제한도 있어 문제가 있어보였습니다.
그렇기에 서버에 하루한번씩 동기화를 시켜두는 방식으로 구조를 생각했습니다.
이런 구조를 통해 빠르게 데이터를 불러올 수 있도록 제작하였습니다.
현재는 총 기여도만을 표시하여 크게 느릴부분이 없어보이지만 추후 1주일의 순위, 1일 1커밋 등과 같은 기능을 기획하였기 때문에 이런기능을 구현하기 위해 최적화하였습니다.
기능
교내 학생들의 기여도 순서를 표시해줍니다.
하루 한번씩 동기화되며 현재의 1위가 몇일째 연속 1위 중인지 표시합니다.
본인의 Github 아이디를 신청합니다
교내 학생이 대상이기에 관리자의 승인이 필요합니다. 신청 후 관리자가 승인한다면 순위에 적용됩니다.
추후적으로는 아까 언급했던 일주일단위의 순위와 1일 1커밋을 표시하는 기능등을 지원할 생각입니다.
'프로젝트' 카테고리의 다른 글
| Playlist (0) | 2021.09.16 |
|---|---|
| 대소고인 - 교내 학생 사전 (0) | 2021.02.09 |