Create Week8 Mission 1

[umckee5696]

📌 미션 번호

8주차 Mission 1

---

📋 구현 사항

• RecyclerView + Adapter 코드를 Compose Lazy 컴포넌트로 Migration
• items() 함수를 이용한 리스트 항목 표시
• 각 아이템 레이아웃을 Composable 함수로 작성
• 각 아이템에 고유 key 지정하여 성능 최적화

---

📷 스크린샷

---

✅ 체크리스트

• Merge 하려는 브랜치가 올바르게 설정되어 있나요?
• 에뮬레이터 또는 실제 기기에서 정상 동작하나요?
• 불필요한 주석 및 Log가 제거되었나요?

---

🔥 질문 사항

[Dawon-Y]

안녕하세요! 8주차 과제 진행하시느라 고생 많으셨습니다💚

Week08/Yido 8주차(Compose Migration) 코드 리뷰

1) 총평

• 앱 엔트리포인트가 MainActivity.setContent { MainScreen() }로 Compose로 구동되고 있고, 화면 내 리스트도 LazyRow, LazyVerticalGrid 등으로 구성되어 있어 RecyclerView/Adapter 의존은 없어 보입니다(적어도 현재 열람한 범위에서는).
• 다만 8주차 미션 핵심 요구사항인 “각 아이템에 고유 key 지정” 부분에서, 현재 key = { it.name }를 쓰고 있어 상태 안정성 관점에서 위험할 수 있습니다.
  (name이 유니크하다는 보장이 없거나, 향후 데이터 변경 시 중복 가능성이 높음)

---

2) 미션 요구사항 체크리스트(기본 구현)

2-1) items() 함수로 동일 리스트 데이터 표시

• Home: LazyRow { items(products, ...) } 사용
• Shop: LazyVerticalGrid { items(uiState.filteredProducts, ...) } 사용

2-2) 아이템 레이아웃을 Composable 함수로 새로 작성

• Home: HomeProductItem(product)로 분리
• Shop: ShopProductItem(product, onWishClick)로 분리

2-3) 고유 key 지정

• Home: items(products, key = { it.name }) → key가 불안정
• Shop: items(..., key = { it.name }) → 동일 이슈

권장: id(Int/Long/UUID) 같은 “절대 유니크” 키로 변경
지금 구조에서 Product에 id가 없다면, 이번 주차 과제 취지상 id를 추가하는 편이 가장 정석입니다.

---

3) 파일별 리뷰

3.1) ui/main/MainActivity.kt

• setContent { MaterialTheme { MainScreen() } }로 Compose 진입점 구성 좋습니다.
• Hilt EntryPoint(@AndroidEntryPoint) 유지 좋습니다.

개선(선택)

• 테마를 프로젝트 공용 Theme(예: YidoTheme)로 통일하면 DesignSystem 관리가 쉬워집니다.

---

3.2) ui/home/HomeScreen.kt

잘한 점

• 화면 구성 자체는 7주차와 유사하지만, 리스트가 Lazy 기반이라 “마이그레이션 방향”은 맞습니다.
• HomeProductItem 분리로 컴포넌트 재사용/테스트성 좋습니다.
• LazyRow의 contentPadding, spacedBy 설정이 깔끔합니다.

개선 포인트 (중요)

1. key를 name으로 쓰는 건 위험

   items(products, key = { it.name }) { ... }

   • name 중복 가능성 높고, 변경 가능성도 큼
   • key 충돌 시: 스크롤 중 상태가 섞이거나, 아이템이 “점프”하는 문제가 생길 수 있음
     → key = { it.id } 같은 방식 권장

2. collectAsState()는 동작은 하지만, 가능하면 collectAsStateWithLifecycle()가 더 안전합니다(리컴포지션/백그라운드 등 생명주기 이슈 방지).

3. Column + verticalScroll 조합은 리스트가 커질수록 비효율적일 수 있습니다.

   • 지금은 Row 리스트만 Lazy이고, 전체는 Scroll Column인데
   • “화면 전체가 리스트 성격”이면 LazyColumn 안에 섹션(item{}) + 내부 LazyRow를 넣는 구조가 더 정석입니다.
     (LinLin이 이 패턴을 사용)

---

3.3) ui/home/HomeViewModel.kt

• 데이터 스트림 collect 후 empty면 default 세팅하는 흐름은 이해하기 쉽습니다.
• 다만 UI에서 collectAsStateWithLifecycle로 받으면 더 안정적.

---

3.4) ui/shop/ShopScreen.kt

잘한 점

• LazyVerticalGrid로 리스트/그리드를 Compose스럽게 구현 잘 하셨습니다. (RecyclerView 대체로 충분히 인정)
• ShopProductItem 분리 + onWishClick을 ViewModel로 올린 구조 좋습니다.
• 탭은 커스텀 Row로 구현되어 있고 상태는 ViewModel이 들고 있어 MVVM 흐름 좋습니다.

개선 포인트 (중요)

• 여기서도 key = { it.name }는 동일하게 위험
• 위시 토글을 name 기준으로 찾는 로직도 함께 위험합니다:

  if (it.name == product.name) ...

  → id 기반으로 바꾸는 게 안전합니다. (이건 key 문제와도 연결)

---

3.5) ui/shop/ShopViewModel.kt

잘한 점

• ShopUiState(allProducts, filteredProducts, currentTabIndex) 설계 깔끔합니다.
• 탭 선택 → 필터 적용 흐름이 명확.

개선 포인트

• toggleWish에서 name으로 매칭하는 부분은 데이터 정합성 위험(동명이인 상품, 번역명 바뀌는 경우 등).
  → productId로 매칭하도록 변경 권장.

---

3.6) ui/navigation/AppDestination.kt

• sealed interface + bottomNavItems 리스트 구성 Good.
• 네비/탭 정의가 한 곳에 모여 있어 유지보수 좋습니다.

---

4) 결론 (합격/보완 포인트)

• Compose Lazy 기반으로 리스트를 구성한 점과 아이템 컴포저블 분리는 요구사항을 잘 충족합니다.
• 다만 과제의 핵심 중 하나인 **“고유 key 지정으로 상태 안정성 확보”**에서,
  • 현재 name을 key로 쓰는 것은 요구사항 취지에 맞게 “고유”하다고 보기 어렵기 때문에 보완이 꼭 필요합니다.

가장 추천되는 수정 1줄 요약

• Product에 id: Int(또는 Long) 추가 → key = { it.id }로 변경 → ViewModel 토글/저장 로직도 id 기반으로 변경

---

워크북 진행하시느라 수고하셨습니다! 궁금한 점 있으시면 언제든 말씀해 주세요!