친환경 챌린지 도전
나의 일상 기록 다이어리
- 기획 : 박영선, 이지민
- 안드로이드 네이티브 : 정은정, 조예진
- 백엔드 : 김상인, 한채연 ( 🔗 백엔드 Repo )
📌 @eunjjungg : Native 기술 스택
- Android, Kotlin
- 디자인 패턴 - MVVM + Repository Pattern
- Live Data, Data Binding
- Android Compose
- Android KTX
- Retrofit
- Material Design 3
- Custom View
- Glide
- 소셜 로그인 - Kakao, Naver API
- 이슈 관리 - Jira, Github Issue
- 형상 관리 전략 - Gitflow
- 애니메이션 - Lottie
💻 @eunjjungg : Native 담당 부분
- 프로젝트 세팅
- 프로젝트 생성
- gitignore 생성
- layer 단위 패키지 분리
- base code 생성 (프래그먼트, 액티비티, Retrofit 관련)
- 디자인 관련 코드 생성 (색상, 사이즈…)
- 폰트 세팅 (사용하지 않는 텍스트들 제외하여 폰트 용량 줄이는 작업 포함)
- 앱 아이콘 세팅
- 커밋, 이슈, PR 템플릿
- 회원가입 관련 로직 (전체 로그인 흐름 함께 고려함)
- 카카오톡, 네이버 소셜 로그인
- 홈 화면 관련
- 챌린지 관련 로직
- 다른 유저 프로필 관련 로직
- base : boilerplate code를 줄이기 위해 재사용 가능한 클래스들 존재
- model : model 관련 코드 분리
- network : 서버 연결 Interface 및 소셜 로그인 관련 로직
- repository : 서버 연결 Repository
- ui : ui 관련 코드 분리
- adapter :
RecyclerView관련 어댑터 클래스 분리 - custom : custom view 관련 클래스 분리
- fragment :
fragment관련 클래스 분리 - interface : ui와 관련된 interface 분리
- view :
activity관련 클래스 분리- compose :
activity중 컴포즈로 구현한 것들 모음
- compose :
- adapter :
- util : 전체 앱에서 사용되는 유틸 클래스, 함수 분리
- viewmodel : 뷰모델 클래스 분리
🌱 @eunjjungg : 구현 화면 및 설명
-1.online-video-cutter.com.mp4
- 네이버, 카카오 API를 사용한 소셜 로그인 구현
- 웹뷰를 사용한 약관 동의 문구 노출
- 소셜 로그인에 필요한 노출되면 안 되는 정보
local.properties로 분리 - 토큰 기기내 저장은
Encrypted SharedPreference사용
-2.online-video-cutter.com.mp4
- 아이디 유효성 검사 - 정규식
- 아이디 중복 검사 - 서버로부터 응답
- 서버에 부하가 가지 않도록 사용자가 아이디 입력 후 1초 동안 더 이상의 입력이 없을 떄만 중복 검사 요청 후 로직 처리하도록 구현
- 디자인 - google material의
TextInputLayout사용
-3.online-video-cutter.com.mp4
- 각
fragment모두 같은viewmodel사용하도록 구현 - 마지막 다음으로 넘어가기 버튼 클릭 시 회원가입 절차 완료되고 서버로 가입 요청하도록 구현
- 가입 도중 끊긴다면 카카오 로그인에서 회원 삭제하도록 구현
_1.mp4
- Android Compose로 구현
- Lottie로 애니메이션 구현
_4.mp4
_4.mp4
- 각 대표 챌린지와 유저의 참여 챌린지 구현
- 아래 동영상은 유저가 현재 참여중인 챌린지의 상태를 참여하지 않음으로 변경하였을 때 홈 화면의 모습
_3._.mp4
- Shared Element 사용하여 화면 전환 사용
fab사용RecyclerView로 구현해야 하는데 전체 화면이 스크롤 되어야 하므로 화면의 모든 구성 요소 각각 컴포넌트화함- 재사용 가능하도록 일정 부분은 커스텀 뷰로 만듦
- 유저가 올린 이미지 정사각형으로 표시되도록 직접 사이즈 계산하여 크롭 (추가 라이브러리 사용 X)