RxJS로 산성비 만들기(1) - 프로젝트를 시작하며

왜 이 프로젝트를 시작하게 되었는가?

---

나는 게임을 좋아하다 보니, 새로운 기술이나 개념을 익힐 때 주로 게임의 개념을 대입하거나, 실제로 간단한 게임을 만들어본다. 최근 들어 관심이 생긴 RxJS 역시 문서를 읽어보고 API들을 조금 사용해 본 후, 이를 게임에 가장 잘 활용할 수 있는 방법이 없을까 생각해 보았다. 정말 뜬금없지만, 그 당시에 한글과컴퓨터 채용 공고가 올라온 것을 보았고, 의식의 흐름대로 어릴 적 즐겁게 했던 한컴 산성비 게임이 떠올라 그대로 이를 프로젝트 주제로 삼았다.

프로젝트 목적

---

RxJS를 활용해 프로젝트를 하는 것은 좋은데, 이것 만으로는 프로젝트 볼륨이 너무 작은 느낌이었다. 그래서 프로젝트 진행에 몇 가지 목적을 세워, 스스로 챌린지를 주기로 했다. 목적들은 다음과 같다.

1. RxJS 활용하기
2. 최소한의 라이브러리만 사용하기
3. 웹 컴포넌트 구현하기
4. 생성자 함수와 프로토타입 활용하기
5. SQL로 데이터베이스 조작하기

RxJS 학습은 프로젝트의 가장 기본적인 목적이었고, 더불어 이를 활용해, 전부터 직접 구현해보고 싶었던 나만의 웹 컴포넌트를 구현해볼 것을 목표로 삼았다.

 

프로토타입은 최근 진행 중인 Deep Dive 스터디에서 배운 프로토타입을 확실히 이해하기 위해 은근슬쩍 끼워두었다. 다만, 생산성이 너무 떨어지고 VSCode의 intellisense가 작동하지 않는 등의 이슈가 있어, 이후 다시 은근슬쩍 지워버릴 수도 있다😅

 

마지막으로, SQL문을 자꾸 잊는 것 같아 이번 기회에 다시 상기하고자 마지막 목적으로 추가했다. DB는 정말 간단한 작업밖에 하지 않을 테니, ORM을 사용하지 않고 모든 쿼리문을 직접 작성할 예정이다.

이렇게 하면 프런트엔드에서는 RxJS, 백엔드에서는 express, mysql2 정도의 라이브러리만을 사용하게 될 것 같다.

MVP 기능

---

현재까지 생각한 MVP기능은 아래와 같다.

1. 산성비 게임 정답 입력 시 점수 획득
2. 단어 색깔마다 고유 능력 부여
3. 랭킹 시스템
4. SPA 구현

사실 이미 프로젝트를 꽤나 진행해서 MVP가 어느 정도 나오긴 했는데, SPA 구현 때문에 상당히 애를 먹고 있다. 아직 완성되지 않은 프로젝트를 벌써 포스팅하는 것도, SPA가 언제 완성될지 모르기 때문... 차라리 블로그를 통해 프로젝트 진행 중에 겪는 시행착오 과정을 모두 공유해보려 한다.

 

어느 정도 완성된 모습. 이제보니 점수 때문에 하트가 밀리는게 킹받는다.