돌아오신 것을 환영합니다
이번 영상에서는 우리만의 앱을 만들 것입니다
그렇기 때문에 바라는 결과물을 영상 끝에 보여드리는 것이 아닌
먼저 보여드리겠습니다
여기 보시면 우리가 만들게 될 앱이 있습니다
소고기, 닭고기, 양고기 등등 보입니다
이것들은 우리가 표시하고 싶은 카테고리가 되겠습니다
오늘의 결과물로서 일단 카테고리를 표시하고 싶습니다
이번 영상에서는 해당 레시피에 관한 실질적인 세부 사항까지 들어가지는 않겠습니다
그렇지만 사용가능한 카테고리에 대해 집중할 것이고
보시면 이것들이 전부 사용가능한 카테고리들입니다
거기서 더 나아가진 않을 것이고 우리가 표시된 항목들을 스크롤하면서 볼 수 있도록
lazy column이 필요하기에 충분히 배울 것이 많습니다
이미지 표시하는 법과 데이터를 로드하는 법을 배울 것입니다
자 저 모든 것을 시작하기에 앞서 프로젝트를 생성해 줍니다
그러므로 텅 빈 activity application을 생성해 줍니다
My recipe app이라고 부를 것이고 나머지는 그대로 바꾸지 않고 둡니다
Finish를 눌러주면
App이 생성이 되었습니다
예전 앱은 종료해 주겠습니다
아시다시피 조금 걸리니까 로딩이 될 때까지 잠시 기다려줍시다
좋습니다 이제 로딩이 완료 되었으니 필요하게 될 implementation(구현)을 설정하겠습니다
Gradle script 안을 보시면, 참고로 우리가 다뤄본 적 없는 것입니다
build.gradle 파일이 있습니다 프로젝트용, 모듈용 말입니다
파일 module :app을
열어줍시다
좋습니다
다른 거 말고 말씀드린 파일을 여는 것이 중요합니다
여기 보시면 버전 8.2.0-beta06의 플러그인이 추가되었습니다
그리고 id 버전 1.9.0입니다
제 생각엔 여러분의 경우, beta06이라고 되어 있으면 안 되지만 뭐 일단 Build.gradle.kts로 가봅시다
이 파일 내 제게 필요한 것은, 쭉 내려보시면 종속성이 있습니다
여기 보시면 여러 가지의 종속성이 보입니다
기본적으로 이들은 여러분의 앱에 어떤 항목 또는 어떤 라이브러리를 사용할 수 있는 지에 대한
implementation입니다
제가 말씀드렸듯이, 여기 보이시는 것처럼 이 라이브러리들은 저희 주요 파일에
항상 직접적으로 불러올 수 있습니다
But those are dependent on what we have here. 그러나 저것들은 여기 있는 내용에 의존합니다
그래서 여기 import 내에 구현한 것들만 추가할 수 있습니다
그래서 우리가 사용하고 싶은 것을 위해 몇 가지 항목을 추가할 필요가 있습니다
여기에 복사 붙여넣기를 진행할 것입니다
제가 여기 붙여 넣기 한 내용을 그대로 작성해 주셔야 합니다
Compose ViewModel에
implementation이고
(Androidx.lifecycle:에다가
lifecycle-Viewmodel-compose:2.6.2)라고 적으시면 됩니다
영상 시청 시점으로는 최신의 버전이 있겠지만 이번 강의에서는
저와 같은 것을 사용하기를 추천해 드립니다
그렇지 않은 경우 에러가 뜨거나 문제가 생길 수 있습니다
그리고 저는 미래의 일어나는 에러를 다루는 법을 가르쳐드릴 수 없지 않습니까
좋습니다, 이제 네트워크 호출을 하기 위해서, 간단하게 말하면 인터넷에 연결하고 데이터를 수집하는 것입니다
이번 경우, JSON의 유형인 문자열만 필요하기 때문에 DB 웹사이트로부터 이를 수행할 것입니다
그렇지만 여전히 로딩할 필요가 있습니다
그리고 이미지 또한 로딩해야 합니다
자 그래서 이미지를 다운로드하기 위해서 딱 필요한 라이브러리를 사용할 수 있도록 설정해야 합니다
그렇게 하면 아주 쉬워질 것입니다
그렇게 하지 않으면 같은 기능을 얻기 위해 상당한 양의 코드를 작성해야 합니다
그래서 기본적으로, 외부 당사자로 생각할 수 있습니다
개발자 집단이 우리에게 많은 양의 코드를 작성해 주면 데이터 다운로드를 위한 시간과
코드를 절약할 수 있게 되는 것입니다
그것이 retrofit의 역할입니다
네크워크에 요청해 데이터를 가져오는 네트워크 요청을 하게 해주고
그리고 Json이라는 것으로
이 또한 retrofit에서 온 것인데
JSON 파일을 변환하도록 해줍니다
JSON 객체를 말입니다
JSON이 어떻게 생겼는지 확인하기 위했던 영상에서 본 코드 말입니다
그래서 여기 JSON 객체를 모드 Kotlin 객체로 변환할 수 있다고 말할 수 있습니다
그래서 Kotlin 프로젝트 내에서 속성에 바로 액세스할 수 있도록
다룰 수 있게 변환합니다
그래서, 그것은 기본적으로 클래스가 어떤지와 어떤 데이터가 필요한지에 대한
정의를 내려야겠지만 Kotlin 객체처럼, 클래스처럼 다뤄질 것이고
그러면 인터넷으로부터 로드할 수 있고 프로젝트 내 객체로써 사용할 수 있도록 하고
속성에 직접적으로 액세스할 수 있도록 하는데, 예를 들어, 이미지를 다운로드할 수 있도록
이미지에 이름과 링크를 표시할 수 있도록 말입니다.
실질적으로 이미지를 다운로드하고 화면에 표시하기 위해 또 다른 implementation(구현)을 사용할 것입니다
그래서 보이는 것처럼 io.coil-kt:coil-compose:2.4.0을 작성해 줍니다
이것은 JSON 파일로 변환하는 용도입니다
그리고 이것은 이미지를 로딩하는 용도입니다
그래서 JSON 파일 대신에 어떤 이미지를 로딩해야 할지를 알아내야 합니다
그리고 실질적으로 이미지를 로딩할 것입니다
그리고 이것은 우리의 일을 매우 쉽게 해주는 또 다른 제삼자입니다
이게 아니면 모든 것을 작성해야 하는 코드가 더 많을 것입니다
그래서 Gradle 파일을 수정하고 나면 project에 동기화해야 합니다
Sync Now 버튼을 눌러주시면 Gradle project가 동기화될 것입니다
동기화하지 않겠지만 동기화할 것입니다(농담?)
그다음 우리 프로젝트 클래스에 사용할 수 있게 됩니다
이제 Gradle을 구축이 끝나면 Viewmodel lifecycle을 사용할 수 있습니다
JSON 파일을 Kotlin 객체로 변환하게 해주고 직접 매핑하는 변환기에 더불어
retrofit 네트워크 요청을 사용할 수 있습니다
동기화 되도록 해주고 MealDB 웹사이트로부터 가져오고 싶은 데이터를 살펴봅시다
좋습니다
제 경우에서는 몇 분 걸렸습니다
그러니까 시간이 조금 걸려도 걱정하지 않아도 됩니다
많은 작업이 있기 때문에 오래 걸리는 것은 당연합니다