Skip to content

Latest commit

 

History

History
146 lines (101 loc) · 6.75 KB

README.md

File metadata and controls

146 lines (101 loc) · 6.75 KB

💽 Wafflemate

TodoMate 어플을 참고하여 Wafflemate 어플을 제작했습니다.

기존 앱에 없는 팔로우차단 기능, 시간체크 기능을 추가하여 SNS 기능을 강화하고 일정관리 사용성을 높혔습니다.


👭"와플메이트" 는 어떤 앱인가요?

친구들과 함께하는 일정관리, 와플메이트!

일정관리와 더불어 팔로우 팔로잉이 가능한 SNS 기능을 제공합니다.
일정/일기 공유를 통해 효과적인 일정관리를 경험하세요.

🔀 워크플로우

image

🚀 기술스택

image

🔨 만든 사람

| 송건우(Gitsgwoo) | 진채연(hzlcodus) | 오동건(ho2921ho) |

📄 페이지 설명


송건우(Gitsgwoo)

1. 시작 페이지

슬라이드1

2. 회원가입 페이지

슬라이드2

3. 이메일 인증 페이지

슬라이드3

4. 로그인 페이지

슬라이드4

자동 로그인

  • 사용자 로그인 요청 처리 시에 앱의 shared preference에 access token, refresh token, 사용자 정보를 저장합니다.
  • 인증 정보를 나타내는 data class AuthInfo 를 만들고 인증 정보를 AuthStorage class의 변수 authInfo에 StateFlow의 형태로 저장합니다.
  • 앱의 startdestination을 메인페이지로 설정해놓고, 메인페이지의 lifecycle 중 OnViewCreated 에서 사용자의 authInfo 값이 null인지 확인합니다.
  • 값이 null이라면 로그인 요청을 처리하는 중첩그래프 login_graph로 navigate 됩니다.

login_graph : 시작 페이지, 회원가입 페이지, 이메일 인증 페이지, 로그인 페이지로 구성

5. 구글 로그인 페이지

슬라이드5

6. 카카오 로그인 페이지

슬라이드6

7. 메인 페이지

슬라이드7


진채연(hzlcodus)

8. 탐색 페이지

슬라이드8

9. 팔로잉 목록 페이지

슬라이드9

10. 팔로워 목록 페이지

슬라이드10

11. 차단 목록 페이지

슬라이드11

12. 슬라이드 메뉴

슬라이드12


오동건(ho2921ho)

13. 계정 페이지

슬라이드13

14. 프로필 페이지

슬라이드14

15. 비밀번호변경 페이지

슬라이드15


진채연(hzlcodus)

16. 할일 목록 및 달력 페이지

슬라이드16

17. 할일 작성 페이지

슬라이드17

18. 할일 수정 페이지

슬라이드18


송건우(Gitsgwoo)

19. 일기 달력 페이지

슬라이드19

20. 일기 목록 페이지

슬라이드20

21. 일기 작성 페이지

슬라이드21

22. 일기 세부정보 페이지

슬라이드22

23. 댓글 목록 페이지

슬라이드23

헤더에 토큰 자동 추가 및 자동 refresh 기능

토큰 자동 추가

  • retrofit 및 okhttp3의 interceptor 기능을 활용하여 사용자의 access token을 자동으로 Authorization 헤더에 넘겨주는 기능을 추가하였습니다.
  • 최초 로그인 또는 재로그인 시에는 access token을 넘겨줄 필요가 없기 때문에 if 문을 통해서 Authorization 헤더에 빈 String을 넘겨주도록 처리했습니다.

토큰 자동 refresh

  • access token의 유효기간이 만료되면 발생하는 401 에러를 catch하여, sharedPreference에 저장된 refresh token을 사용해 access token을 재발급 받도록 했습니다.
  • sharedPreference에 재발급된 토큰을 저장한 후 chain 의 Request 객체를 복사해 재발급한 토큰을 헤더에 넣고 다시 요청을 보내도록 했습니다.
  • refresh token으로 access token을 재발급하는 로직은 Request.Builder()를 사용해 refreshRequest를 생성하여 OkHttpClient().newCall(refreshRequest).execute()를 통해 직접 서버에 요청을 넘기도록 구성하였습니다.