프로젝트: 서가 앱 만들기

1. 시작하기 전에

기본 요건

  • Android 스튜디오에서 프로젝트를 만들고 실행하는 능력
  • Jetpack Compose에서 레이아웃을 만드는 기능
  • Kotlin에서 코루틴 사용 경험
  • Retrofit, Coil, Gson 관련 작업 경험

빌드할 항목

  • 웹 서비스에 여러 요청을 보내고 비동기식으로 다운로드된 이미지를 표시하는 Android 앱

필요한 항목

  • Android 스튜디오가 설치된 컴퓨터

2. 개요

5단원을 완료했습니다.

코루틴, Retrofit, Gson을 비롯하여 이 단원에서 배운 개념을 연습하기 위해 Google Books API의 이미지가 포함된 도서 목록을 표시하는 앱을 직접 빌드해 볼 것입니다.

앱은 다음 작업을 실행해야 합니다.

  • Retrofit을 사용하여 Google Books API에 요청 전송
  • Gson을 사용하여 응답 파싱
  • 도서와 함께 비동기식으로 다운로드된 도서 이미지를 세로 그리드에 표시
  • 저장소를 사용하여 UI와 데이터 영역을 분리하는 권장사항 구현
  • 종속 항목 삽입을 사용하여 네트워크 서비스가 필요한 코드의 테스트 작성

이 프로젝트의 목표는 두 가지입니다. 먼저 이 단원에서 배운 모든 개념을 연습하는 것입니다. 또한 전문 Android 개발자와 마찬가지로 새로운 REST API로 작업하고, 문서를 읽고, 배운 기술을 새 앱에 적용하는 것입니다.

완성된 서가 앱 예시는 다음 스크린샷에 나와 있습니다. 앱에 표시되는 정확한 레이아웃과 책은 개발자가 결정합니다. 다음 섹션에서 도서 데이터를 검색하는 방법을 자세히 알아봅니다.

9335665e21b79da1.png

3. 앱 계획하기

UI 계획하기

앱의 UI를 원하는 대로 디자인할 수 있습니다. 다양한 기기 폼 팩터에 맞게 앱 레이아웃이 조정되는 방식을 고려해야 합니다.

이미지의 스크롤 그리드를 사용하고 있기 때문에 화면에서 여러 이미지를 동시에 로드해야 합니다. 이미지의 URL을 가져온 후에는 Coil 라이브러리에서 제공하는 AsyncImage 컴포저블을 사용하여 백그라운드에서 데이터를 다운로드할 수 있습니다. 가능한 경우 앱에서 네트워크를 사용 중일 때 사용자에게 알리세요.

네트워크 계층 계획하기

이 단원의 개발자 과정 1에서는 네트워크에서 데이터를 가져오고 JSON 응답을 파싱하는 방법을 알아봤습니다. 서가 앱의 경우 데이터 영역에서 다음 세 가지 작업을 실행해야 합니다.

  • Retrofit 서비스를 만들어 Google Books API에서 데이터를 가져옵니다.
  • 서비스에서 도서 목록을 가져오고 특정 도서에 관한 정보를 가져오는 메서드를 추가합니다.
  • Gson을 사용하여 API에서 반환한 JSON 응답에서 의미 있는 데이터를 추출합니다.

이 프로젝트에 필요한 Google Books API의 메서드를 간단히 살펴보겠습니다.

도서 검색

Google Books API는 API 사용에 설명된 대로 특정 검색어를 기반으로 도서 목록을 반환하는 메서드를 제공합니다.

예를 들어 이 URL은 '재즈 역사'라는 검색어에 대한 검색 결과를 반환합니다.

https://www.googleapis.com/books/v1/volumes?q=jazz+history

검색을 필터링하는 쿼리 매개변수가 몇 개 있습니다. 서가 앱의 경우 q 매개변수(쿼리의 약어)로 충분합니다.

이 문서에는 예상 JSON 응답도 표시됩니다. 서가 앱의 경우 도서의 id를 추출해야 합니다.

특정 도서 정보 요청

특정 도서에 관한 정보를 가져오려면 요청해야 합니다. 이 엔드포인트는 이전 응답에서 추출한 ID를 사용합니다.

https://www.googleapis.com/books/v1/volumes/<volume_id>

volumeInfo 객체의 imageLinks 객체에서 썸네일 링크를 찾을 수 있습니다. 이 앱의 경우 다운로드하려는 이미지는 thumbnail 키 아래에 있습니다.

...
    "imageLinks": {
      "smallThumbnail": "http://books.google.com/books/publisher/content?id=EPUTEAAAQBAJ&printsec=frontcover&img=1&zoom=5&edge=curl&imgtk=AFLRE734s3CngIs16gM_Ht6GeGF4ew664I7oOGghmfk4pgfFcDYb4GlYCYdjtqqXluL2KUyfq_Ni5MSyv4JxEJ8W679zQ2Ib3okUKau3I1ruqBGrWOt2_haUauWC8sXEgjN7JHm4uOjS&source=gbs_api",
      "thumbnail": "http://books.google.com/books/publisher/content?id=EPUTEAAAQBAJ&printsec=frontcover&img=1&zoom=1&edge=curl&imgtk=AFLRE71N0ldzv6rliUV_K5ZACa9yPNcT8Ino6YKXJUMje_z4GsC9cp6gFql5TxlmqMoYN3CDhM3XAIO2riFeMXUnFVr5pTLq91htTtG1DDyvOdiR4yI6xu3yEEAn0dRbvNFZ5m7dUC9E&source=gbs_api",
      "small": "http://books.google.com/books/publisher/content?id=EPUTEAAAQBAJ&printsec=frontcover&img=1&zoom=2&edge=curl&imgtk=AFLRE71HmTwpoe3KR0AISYk5sDgV2Fz-F-6CDKJtFdvlXSZv3jEzFtsSXGJnEGjtCuoDMxP_6sgP8au1yadB7OmI2MhIBquel7ivcDB8e9ieLyh4HNoXnX3zmxfF_CfIfnNXDv0WHuyA&source=gbs_api",
      "medium": "http://books.google.com/books/publisher/content?id=EPUTEAAAQBAJ&printsec=frontcover&img=1&zoom=3&edge=curl&imgtk=AFLRE72LMPH7Q2S49aPeQ3Gm8jLEf6zH4ijuE0nvbOyXBUAgyL816pXzaw0136Pk8jXpfYYFY0IsqL7G7MMDMgKcJhnaoHojWNZpljZmGHeWLL_M7hxkOpmdmO7xza8dfVfPbFmBH4kl&source=gbs_api",
      "large": "http://books.google.com/books/publisher/content?id=EPUTEAAAQBAJ&printsec=frontcover&img=1&zoom=4&edge=curl&imgtk=AFLRE71w0J9EOzUzu1O5GMbwhnpI8BLWzOEtzqc9IfyxEDqimZ--H4JlNAZh_1zx8pqPNRf1qDt7FPb57lH5ip-LBlK3zjMC-MCBYcciuoPjTJOFmLv7pp5B6_-UFBap1KRfC0eG7P4d&source=gbs_api",
      "extraLarge": "http://books.google.com/books/publisher/content?id=EPUTEAAAQBAJ&printsec=frontcover&img=1&zoom=6&edge=curl&imgtk=AFLRE73t0gcxT-jzEETp8Yo5Osr15nVL7ntKL2WSe2S8kRSio7w0CGgErAq4WbPWIsH4TmOdP_EO6ZoPNSP-YGSOwqfPMw8_IlYE6hy9IKeAs5V_xaHy7drZleF0eizAQiEVg5ci7qby&source=gbs_api"
    },
...

도서 썸네일 다운로드

썸네일 URL이 생긴 후 각 그리드 항목의 AsyncImage 컴포저블에 썸네일 URL을 제공할 수 있습니다.

테스트 가능성을 위한 설계

네트워킹 개념 외에도 데이터 영역에 저장소 클래스를 사용하도록 앱을 리팩터링하는 방법도 배웠습니다. 이 앱의 경우 데이터 소스를 종속 항목 삽입으로 쉽게 교체하기 위해 저장소를 사용하여 테스트 가능성을 염두에 두고 설계해야 합니다.

  • 도서 서비스를 위한 저장소 인터페이스를 포함합니다.
  • Retrofit 서비스에 액세스하는 저장소 클래스를 구현합니다.
  • Google Books API에 실제로 요청하지 않는 가짜 서비스를 구현합니다.
  • 가짜 서비스를 사용하여 저장소 테스트를 작성합니다.

저장소를 사용하여 네트워크에서 도서 데이터를 가져와야 하므로 데이터 소스를 종속 항목 삽입으로 쉽게 교체할 수 있습니다.

4. 서가 앱 빌드

Google Books API에 대해 대략적으로 살펴봤으므로 이제 Bookshelf API를 빌드해 보겠습니다. 다른 웹 서비스를 사용하는 경우에도 이 프로젝트를 완료하는 데 필요한 모든 개념을 배웠습니다. 복습이 필요하면 언제든지 이 단원의 이전 Codelab과 샘플 앱을 참고할 수 있습니다. 이 단원의 Codelab은 프로젝트 작업을 할 때 유용하게 사용할 수 있습니다.

이 과정의 모든 프로젝트를 완료하는 것이 좋습니다. 이 단원에서 배운 모든 내용에 자신이 있더라도 생각보다 더 자주 Codelab을 참고해야 할 수 있습니다. 이 과정의 강사를 비롯하여 누구나 마찬가지입니다. 그러니 이 프로젝트를 즐기시고 다음 단원으로 넘어가기 전에 학습한 내용을 연습하시기 바랍니다.