Wadiz Tech Blog

Compose Multiplatform 첫걸음 떼기

thumbnail

Compose Multiplatform 첫걸음

  • Compose Multiplatform은 JetBrains에서 제공하는 UI 프레임워크입니다.
  • Kotlin과 Compose를 사용하여 데스크탑 앱과 모바일 앱을 동시에 개발할 수 있습니다.
  • iOS, Android, Desktop, Web을 모두 지원합니다.
  • iOS 앱 개발을 위해서는 macOS, Java, Android Studio, Xcode, Cocoapods가 필요합니다.

Compose Multiplatform 프로젝트 생성

  • New Project → Compose Multiplatform을 선택하여 프로젝트를 생성합니다.
  • Multiple platform 옵션을 선택하여 다중 플랫폼을 지원할 수 있습니다.
  • common 모듈과 각 플랫폼 모듈이 있으며 각각의 플랫폼 의존적인 코드는 각각의 모듈에 작성됩니다.
  • common 모듈은 플랫폼에 종속되지 않는 공통 코드를 포함합니다.

플랫폼별 코드 작성

  • commonMain 패키지에 대부분의 코드를 작성할 수 있습니다.
  • 일부 플랫폼 의존적인 기능들은 각 플랫폼 모듈에 작성해야 합니다.
  • 사용하는 라이브러리 추가도 각 플랫폼에 맞게 작성합니다.

코드 작성 예시

  • 화면에 UI 컴포넌트를 추가하는 기능을 만들었습니다.
  • remember 변수를 생성하고, 아이템을 클릭했을 때 openDialog를 변경합니다.
  • expect 함수를 정의하고 각 플랫폼에 맞게 actual 함수를 작성합니다.
  • 각 플랫폼에 따라 다이얼로그를 지원하고 옵션 화면도 동일하게 사용합니다.

Server Driven UI

  • Server Driven UI에서 사용하는 JSON을 활용하여 UI 변경이 가능합니다.
  • '웰 컴 쿠폰' 페이지를 더 편리하게 운영할 수 있습니다.
  • UI를 관리하는 누구나 쉽게 UI를 변경할 수 있도록 관리자 도구를 개발했습니다.
  • 미리 보기 화면을 통해 Server Driven UI 화면을 구성할 수 있습니다.