Randomly 프로젝트 - 카테고리별 균등 분배 기능 구현

 

드디어 카테고리 기능을 구현하였다!!! 

 

 

 

✔️ 기능 설명

이 기능이 필요한 사용자는 다음과 같다. 

- 질문의 종류가 여러개인경우 (ex. React , Js, CS...)
- 위 질문들을 무작위로 받는 것이 아닌 각 종류마다 균등하게 분배받고자 하는 사용자들 

 

 

활용 예시는 다음과 같다. 

 

ex)

팀원 A, B, C는 기술면접 스터디를 진행하고자 한다.
등록한 질문은 React 관련 질문 3개, Js 관련 질문 3개, CS 관련 질문 3개로 총 9개의 질문이 등록되어있다. 

스터디 진행시 질문을 각자 3개씩 분배하게 하였는데, 무작위 분배 기능을 사용하면 어떤 팀원이 React 질문만 3개 받아 버리는 경우가 생겼다. 

각 팀원들은 이런 방식이 아닌 React, Js, CS관련 질문글을 각각 1개씩 개인마다 분배 받고싶다.


이럴때 사용하는 기능이 '카테고리별 분배 기능'이다 

해당 기능을 사용하기 위해 카테고리별 분배 기능 checkbox를 체크한다. 

이후 질문 분배를 다시 누르면 각 팀원마다 React, Js, CS관련 질문글을 각각 1개씩 랜덤하게 분배 받게된다. 

재분배를 누르면 다시 동일하게 새로운 질문들을 분배 받게 된다.

 

 

실제 적용 예시

 

 

현재 폴더 내에 3명의 팀원과 React 관련 질문 3개, Js 관련 질문 3개, CS 관련 질문 3개로 총 9개의 질문이 등록되어있습니다.

 

기존 방식으로 분배를 해보겠습니다.

 

 

루비 라는 팀원에게 js 1번 문제, react 3번 문제, react 1번 문제가 배분된 것을 확인할 수 있습니다.

 

이 값은 전체 9개의 질문중에서 랜덤으로 3개를 뽑아온 값입니다.

 

전체에서 랜덤값을 구한 값이다보니, 9C3 의 조합 값을 구한 것과 같으며 react는 2문제나 나왔지만, CS는 한 문제도 분배 받지 못한 것을 확인할 수 있습니다.

 

물론 이런 방식이 상관 없다면 기존 방식대로 그대로 진행하면 됩니다.

 

 

 

하지만 이런 배분이 아닌 Js, React, CS 에서 각각 1문제씩을 분배 받고싶습니다.

 

JS 3문제 중 1개, React 3문제 중 한개, CS 3문제 중 한개, 조합으로 나타내면, 3C1 + 3C1 + 3C1 과 같죠.

 

해당 기능을 사용하려면, 상단에 카테고리별 균등 분배 카테고리를 체크합니다.

 

 

 

체크를 하고 재 분배를 해본 결과 의도한대로 각 카테고리에서 한문제씩 배분을 받은 것을 확인할 수 있습니다.

 

 

 

해당 기능의 이점

 

• 자칫 편향된 질문 종류들이 쏠리는 것을 방지할 수 있다.
• 카테고리의 갯수, 질문의 갯수, 팀원의 수가 일정한 비율로 유지된다면 더 효과적으로 사용할 수 있다.

 

 

 

 

기존의 방식과 다른 방식이므로 사용자의 활용도에 따라 요구되는 사항이 다를 것이라고 봅니다.

 

따라서, 두 가지 방식의 분배를 모두 제공하기 위해 체크박스를 도입하였습니다.

 

사용자는 원하는 분배에 맞게 선택하고 분배기능을 사용할 수 있습니다.

 

 

어려웠던 점

위 기능들을 구현하면서 어려웠던 점. 

각 질문들을 종류별로 분배하기 위해 완전탐색 알고리즘을 사용하였다. 각 질문들을 모두 순회하여 등록된 카테고리들에 맞는 질문 인덱스 정보들을 파악하고 

재 순회하며 각 카테고리에 맞게 질문들을 팀원들에게 골고루 분배해주었다. 

위 구현 사항은 크게 어렵지 않게 구현할 수 있었으나 폴더간 이동을 할 시 orderNumber 라는 팀원 순서 상태값이 비동기적으로 처리되어 오류를 계속 유발하였다. 

PlayInterview 페이지의 컴포넌트 분리로 인해 비동기 코드가 아직 원할하게 작동하지 않은 탓이 큰 것 같다. 우선, 조건문을 사용하여 임시방편은 해두었지만 더 효율적인 코드 작성이 요구된다.

 

 

 

후기

카테고리 기능을 구현함으로써 질문 분배 기능의 활용도가 더욱 높아졌다! 

위 기능은 내가 진행하고 있는 스터디에서 실제로 사용되는 기능이라 급히 필요하였는데, 잘 구현된 것 같아 만족스럽다 ㅎㅎ 이제 리팩터링과 스타일을 입혀 사용자의 경험을 더욱 향상시키도록 하겠다.

 

---

다음 구현 사항 

 

- 팀원 피드백 기능
- 카테고리 수정 가능
- 카테고리 삭제 기능
- 폴더 명 수정 기능
- 폴더 삭제 기능
- 질문 전체 삭제 기능
- 질문 슬라이더
- manage 페이지에서 질문 카테고리별로 보기 및 전체보기
- 질문 입력 길이 제한
- 카테고리 입력 길이 제한
- 빈 질문입력시 입력 안되게 구현
- 일반 로그인 기능 구현