58. mylog 통계

Vue로 PWA 개발 - 그랜파 개발자

 

나의 마이로그를 얼마나 많은 사람이 보았을지가 궁금합니다. 통계 기능을 구현해 봅시다. 통계는 여러 기능이 있습니다. 별도의 통계 메인 페이지를 만들고 이 페이지에서 각 통계 기능을 선택할 수 있도록 합니다.

 

다음과 같은 통계 기능을 구현하려고 합니다.

1. 일별 조회 현황 : 날짜별로 나의 마이로그 조회수 집계를 합니다. 기간을 입력하면 날짜 단위로 나의 마이로그 조회수 집계를 보여줍니다.
2. 마이로그 조회 현황 : 나의 마이로그에 대해 조회수가 높은 순으로 마이로그 리스트를 보여 줍니다. 입력 사항은 없습니다. 메뉴를 클릭하면 마이로그 리스트를 조회순으로 나타냅니다.

먼저 조회 통계를 위하여 조회수 컬렉션의 구조에 대해 알아 봅시다.

1. views 컬렉션 구조

/views/{mylogId}/users/{userId or anonymousId}

1. views 컬렉션 : 각 마이로그에 대한 조회 기록을 저장하는 최상위 컬렉션입니다.
2. mylogId(Document) : 각 게시글의 고유 ID입니다.
3. users 서브 컬렉션 : 마이로그를 조회한 사용자들의 컬렉션으로 회원은 userId를, 비회원은 고유한 anonymousId를 사용하여 사용자별로 문서를 만듭니다.
4. userId or anonymousId (Document) : 회원인 경우, userId는 사용자의 고유 ID입니다
5. 조회 기록 필드 lastViewed: 사용자가 마이로그를 조회한 시간을 저장합니다.

2. 예시 데이터:

/views/s4stpEErC7d80RJOTHcX/users/e68ffaa1-fe5c-4b47-87a8-d8873d0d7b38 { ["2024-09-24", "2024-09-25", "2024-09-29"] }

1. s4stpEErC7d80RJOTHcX: mylogId
2. e68ffaa1-fe5c-4b47-87a8-d8873d0d7b38: 회원 사용자 ID입니다.(비회원은 고유한 anonymousId)
3. { ["2024-09-24", "2024-09-25", "2024-09-29"]} : lastViewed: 사용자가 마이로그를 조회한 날짜입니다.

3. 일별 조회 현황

1. 조회를 위한 시작일과 종료일을 입력합니다.
2. 입력한 기간 동안의 각 날짜를 구합니다.
3. views 컬렉션에서 나의 mylogId 가진 문서를 찾습니다.
4. lastViewed 배열 필드 안에 입력한 각 날짜가 있으면 조회수를 카운트 합니다.
5. 각 날짜별 마이로그 전체 조회수를 화면에 나타냅니다. 날짜별 조회수는 날짜, 조회수의 구조를 가진 객체의 배열입니다.

4. 마이로그 조회 현황

1. 입력은 없습니다.
2. views 컬렉션에서 나의 mylogId 가진 문서를 찾습니다.
3. 각 문서에 대해 lastViewed 배열 필드의 크기를 카운트 합니다.
4. 이렇게 얻은 조회수에 대해 정렬을 하여 보여 줍니다.