프로젝트/플러터 프로젝트

생산성을 높이는 할 일 관리 앱에 Daily Streak 추가하기

roquen4145 2024. 11. 3. 14:54

지난 포스팅에서는 뽀모도로 타이머까지 추가했습니다.

https://roquen4145.tistory.com/282

 

생산성을 높이는 할 일 관리 앱에 뽀모도로 타이머 추가하기

https://roquen4145.tistory.com/279 생산성을 높이는 할 일 관리 앱 만들기 MVP 소개https://roquen4145.tistory.com/278 생산성을 높이는 할 일 관리 앱 만들기 계획 (Flutter)자주 개인 프로젝트를 시작했다가 오래

roquen4145.tistory.com

 

이번에는 Daily Streak를 추가해보겠습니다.

Daily Streak란?

제가 이걸 한글로 뭐라고 표현해야될 지 고민이 돼서 영어로 일단 써놨는데요.

여러 가지 학습 앱을 보면 X일 연속 달성을 기록하는 것이 있습니다.

deepstash daily streak

위 사진은 Deepstash라는 앱의 daily streak입니다.

하루에 하나라도 게시물을 보면 체크가 되고 며칠동안 연속으로 활동을 했는지 기록합니다.

활동을 하는 것도 기분이 좋은데 오랜 기간동안 했다고 기록이 되면 더 성취감이 납니다.

이 기능을 제 생산성 앱에도 추가하려고 합니다.

 

Daily Streak 디자인하기

daily streak를 제 앱에 추가하기 위해서는 다음과 같은 일들이 필요합니다.

1. 일별 활동 기록을 위한 데이터베이스 변경하기

2. 최근 일주일의 daily streak UI 추가하기

3. UI와 데이터베이스 연동하기

4. 월별 기록 조회를 위한 UI 추가하기

5. UI와 데이터베이스 연동하기

6. daily streak 기준 설정

 

우선 지금 데이터베이스에는 완료된 날짜를 기록하는 부분이 없습니다.

task table에 id, title, description, isCompleted, estimatedMinutes, order 정보만 있는데요.

그러나 여기에 완료된 날짜를 추가한다고 해서 daily streak를 그릴 때 효율적으로 그 정보를 조회하기 힘들 것 같습니다.

11월 1일에 task를 했는지 안했는지 확인하려면 모든 task를 돌아보며 확인을 해야되기 때문이죠.

그래서 아예 새로 테이블을 만드려고 합니다.

completedTask table을 만들어서 완료 날짜, task id 이렇게

두 개 column을 갖도록 하면 특정 날짜에 완료한 task가 있는지 쉽게 확인할 수 있습니다.

 

현재 데이터베이스를 isar를 쓰고 있는데 foreign key를 사용할 수 있는지 확인해보고

task id에 foreign key를 적용해주면 될 것 같습니다.

 

그래서 해야할 일을 다시 정리하면

1. isar foreign key 관련해서 알아보기

2. database table 코드추가 (completedTask)

3. isar code generator 수행

4. 최근 일주일의 daily streak UI 추가하기

5. UI와 데이터베이스 연동하기

6. 월별 기록 조회를 위한 UI 추가하기

7. UI와 데이터베이스 연동하기

8. daily streak 기준 설정

 

이렇게 되겠습니다.

daily streak 기준 설정이 무엇을 뜻하느냐면 매일매일 하는 것을 기록하는 것이

daily streak의 기본 개념이긴 한데 메인 잡이 있어서 주말에만 해야된다거나

반대로 평일에만 해야된다거나 하는 경우를 고려할 지에 대한 설정입니다.

습관 앱이랑의 차이를 둬야될 것 같은 생각이 들어서 추가해두었습니다.

 

기본은 매일 하나씩 하는 것으로 하고 나중에 사용자의 의견을 받아서 수정하도록 하겠습니다.

 

Daily Streak 구현하기

구현 후 수정하겠습니다.

반응형