Skip to content

Latest commit

 

History

History
139 lines (97 loc) · 4.92 KB

README.md

File metadata and controls

139 lines (97 loc) · 4.92 KB
Raw

☘️ GREME: Green With Me!

친환경 챌린지 도전
나의 일상 기록 다이어리


🔫 Team Shoot It

  • 기획 : 박영선, 이지민
  • 안드로이드 네이티브 : 정은정, 조예진
  • 백엔드 : 김상인, 한채연 ( 🔗 백엔드 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 템플릿
  • 회원가입 관련 로직 (전체 로그인 흐름 함께 고려함)
  • 카카오톡, 네이버 소셜 로그인
  • 홈 화면 관련
  • 챌린지 관련 로직
  • 다른 유저 프로필 관련 로직

📁 layer 단위 패키지 분리 방식

image

  • 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 중 컴포즈로 구현한 것들 모음
  • util : 전체 앱에서 사용되는 유틸 클래스, 함수 분리
  • viewmodel : 뷰모델 클래스 분리



🌱 @eunjjungg : 구현 화면 및 설명

🙋‍♀️ 회원가입

1. 소셜 로그인을 통한 회원가입 및 로그인

-1.online-video-cutter.com.mp4
  • 네이버, 카카오 API를 사용한 소셜 로그인 구현
  • 웹뷰를 사용한 약관 동의 문구 노출
  • 소셜 로그인에 필요한 노출되면 안 되는 정보 local.properties로 분리
  • 토큰 기기내 저장은 Encrypted SharedPreference 사용

2. ID 입력

-2.online-video-cutter.com.mp4
  • 아이디 유효성 검사 - 정규식
  • 아이디 중복 검사 - 서버로부터 응답
    • 서버에 부하가 가지 않도록 사용자가 아이디 입력 후 1초 동안 더 이상의 입력이 없을 떄만 중복 검사 요청 후 로직 처리하도록 구현
  • 디자인 - google material의 TextInputLayout 사용

3. 추가 정보 입력

-3.online-video-cutter.com.mp4
  • 각 fragment 모두 같은 viewmodel 사용하도록 구현
  • 마지막 다음으로 넘어가기 버튼 클릭 시 회원가입 절차 완료되고 서버로 가입 요청하도록 구현
  • 가입 도중 끊긴다면 카카오 로그인에서 회원 삭제하도록 구현

🏆 챌린지

1. 도움말

_1.mp4
  • Android Compose로 구현
  • Lottie로 애니메이션 구현

2. 홈 화면 대표 챌린지, 참여 챌린지

_4.mp4
_4.mp4
  • 각 대표 챌린지와 유저의 참여 챌린지 구현
  • 아래 동영상은 유저가 현재 참여중인 챌린지의 상태를 참여하지 않음으로 변경하였을 때 홈 화면의 모습

3. 챌린지 등록 & 제외

_3._.mp4
  • Shared Element 사용하여 화면 전환 사용
  • fab 사용
  • RecyclerView로 구현해야 하는데 전체 화면이 스크롤 되어야 하므로 화면의 모든 구성 요소 각각 컴포넌트화함
  • 재사용 가능하도록 일정 부분은 커스텀 뷰로 만듦
  • 유저가 올린 이미지 정사각형으로 표시되도록 직접 사이즈 계산하여 크롭 (추가 라이브러리 사용 X)