BLOG

Android 및 iOS용 AWS Amplify 라이브러리를 소개합니다!
작성일: 2020-06-26

모바일 애플리케이션을 개발할 때는 각 프로젝트별로 클라우드 기반 기능 세트를 개발해야 합니다. 예를 들어 대부분의 응용 프로그램은 사용자 인증이나 상세한 인 앱 분석을 필요로 합니다. 응용 프로그램이 REST 또는 GraphQL API을 호출하면 오프라인 시나리오 및 데이터 동기화를 지원해야 하는 경우가 대부분입니다. 이 때 AWS Amplify 를 사용하면 모바일 및 웹 애플리케이션에서 이러한 기능을 쉽게 통합할 수 있습니다.

 

AWS Amplify는 안전하고 확장 가능한 모바일 및 웹 애플리케이션을 구축하기 위한 개발 플랫 폼입니다. 이 서비스는 클라우드 전원 기능을 추가하기 위한 오픈 소스 라이브러리 및 UI 구성 요소, 클라우드 백엔드를 생성 및 관리하기 위한 명령줄 인터렉티브 툴체인, 전체 스택 서버 없는 웹 애플리케이션을 배포 및 호스팅하기 위한 AWS 서비스인 AWS Amplify Console 등 3가지 요소로 구성됩니다.

 

이의 일환으로 오늘 메가존 테크블로그에선 모바일 애플리케이션 개발자들이 안전하고 확장 가능한 클라우드 기반 애플리케이션을 쉽게 구축할 수 있도록 지원하는 Amplify iOSAmplify Android라이브러리와 도구를 소개해 드리겠습니다.

 

지금까지 클라우드 기반 모바일 애플리케이션을 개발할 때 백엔드를 생성 및 관리하기 위해 SDK와 도구의 조합을 사용해 왔습니다. 예를 들어 백엔드를 생성 및 관리하기 위해 Amplify CLI를 사용했고, 백엔드에 액세스하기 위해 하나 또는 여러 개의 AWS Mobile SDK를 사용했습니다. API 세부사항을 이해하고 객체(de)시리얼라이제이션, 에러처리 등 구분되지 않은 코드의 여러 줄을 작성해야 하는 경우가 대부분입니다.

 

iOS나 Android를 증폭하면 이 작업이 단순해집니다. 먼저, 인증, 데이터 스토리지, 액세스, 머신러닝 예측 등 사용 사례를 중심으로 한 네이티브 라이브러리가 제공됩니다. 이들은 선언적 인터페이스를 제공하여 추상적 개념으로 모범 사례를 프로그래밍 방식으로 적용할 수 있도록 합니다. AWS 서비스 대신 사용 사례 측면에서 생각하면 더 높은 수준의 추상화, 더 빠른 개발 주기, 더 적은 코드 라인이 발생하게 되는 것 입니다. 두 번째로, iOS용 XCode 와 Android용 Gradle이라는 기본 IDE 툴체인과 통합되는 도구가 제공됩니다.

 

따라서 모바일 애플리케이션에 클라우드 기반 백엔드 통합을 위한 방법으로는 Amplify iOS 또는 Amplify Android를 사용하실 것을 권장하고 있습니다.

 

 

사용 방법

시작하는 방법을 보여주기 위해 2개의 간단한 모바일 애플리케이션(iOS와 Android에서 각각 하나씩)을 구축했습니다. 본 예제의 출처는 저의(원문의 저자: Seb) GitHub에서 확인할 수 있습니다. 보시다시피 저는 그래픽 디자이너가 아니기 때문에 응용 프로그램에는 다른 흐름을 트리거하는 UI 버튼 목록이 있고, 결과는 콘솔에서만 보실 수 있습니다.

 

 

모바일용 증폭 라이브러리는 Auth, API(REST 및 GraphQL), Analytics, File Storage, DataStore, Predictions 범주를 중심으로 구성됩니다. 본 예제에서는 세 가지 범주를 사용합니다. Auth는 로그인, Facebook 로그인 플로우를 구현하기 위해 사용했고, DataStore는 쿼리 가능한 장치의 영구 스토리지 엔진을 위해 사용했습니다. 이는 내장된 버전 관리, 충돌 감지 및 해결 기능으로 앱과 클라우드 간의 데이터를 원활하게 동기화합니다. 또한 영어와 프랑스어 사이의 자동 번역 기능을 추가하기 위해 Predictions 카테고리를 사용했습니다.

 

각 플랫폼에서 시작할 4가지 주요 단계와 코드 라인을 검토해보겠습니다. 단계별 상세 튜토리얼을 보시려면 Amplify iOS 또는 Amplify Android 설명서를 확인해 주시기 바랍니다.

 

첫 번째 단계는 프로젝트를 설정하고, 필요한 종속성 및 빌드 단계를 추가하는 것입니다.

 

iOS에서는 Podfile 에 몇 개의 라인을 추가하고, 프로젝트의 빌드 단계에서는 AWS Amplify 빌드 스크립트를 추가합니다.
Android에서는 모듈 및 앱에 대해 Gradle 파일에서 동일한 작업을 수행합니다.

 

// iOS Podfile

target ‘amplify-lib-ios-demo’ do

  # Comment the next line if you don’t want to use dynamic frameworks

  use_frameworks!

 

  # Pods for amplify-lib-ios-demo

    pod ‘Amplify’, ‘1.0.0’

    pod ‘Amplify/Tools’, ‘1.0.0’

    pod ‘AmplifyPlugins/AWSAPIPlugin’, ‘1.0.0’

    pod ‘AmplifyPlugins/AWSDataStorePlugin’, ‘1.0.0’

    pod ‘AmplifyPlugins/AWSCognitoAuthPlugin’, ‘1.0.0’

    pod ‘AWSPredictionsPlugin’, ‘1.0.0’

 

// Android build.gradle fragment (Module: app)

compileOptions {

    sourceCompatibility JavaVersion.VERSION_1_8

    targetCompatibility JavaVersion.VERSION_1_8

}

dependencies {

    implementation ‘com.amplifyframework:core:1.0.0’

    implementation ‘com.amplifyframework:aws-datastore:1.0.0’

    implementation ‘com.amplifyframework:aws-api:1.0.0’

    implementation ‘com.amplifyframework:aws-predictions:1.0.0’

    implementation ‘com.amplifyframework:aws-auth-cognito:1.0.0’

}

// Android build.gradle fragment (Project: My Application)

repositories {

    mavenCentral()

    google()

    jcenter()

}

dependencies {

        classpath ‘com.amplifyframework:amplify-tools-gradle-plugin:1.0.0’

}

apply plugin: ‘com.amplifyframework.amplifytools’

 

iOS에서는 당신의 빌드 스텝에 amplify-tools.sh을 반드시 수동으로 추가해야 합니다.

 

이 작업이 완료되면 iOS용 pod install을 입력하거나 Gradle과 프로젝트를 sync합니다.

 

두 번째 단계는 응용 프로그램 초기화 시 증폭에 각 범주의 플러그인을 추가하는 것입니다. iOS에서는 AppDelegate의 didFinishLaunchingWithOptions를 사용하고 있고, Android에서는 onMainActivity에서 만들기를 사용하고 있습니다. 앱의 어느 단계에서든 증폭을 초기화할 수 있고, 앱의 시작 시간에 반드시 사용자가 있을 필요는 없습니다.

 

// iOS AppDelegate class

    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {

       

        do {

            try Amplify.add(plugin: AWSAPIPlugin())

            try Amplify.add(plugin: AWSDataStorePlugin(modelRegistration: AmplifyModels()))

            try Amplify.add(plugin: AWSCognitoAuthPlugin())

            try Amplify.add(plugin: AWSPredictionsPlugin())

           

            try Amplify.configure()

            print(“Amplify initialized”)

        } catch {

            print(“Failed to configure Amplify \(error)”)

        }

}

 

// Android MainActivity class (Kotlin version)

   override fun onCreate(savedInstanceState: Bundle?) {

        // …

 

        try {

            Amplify.addPlugin(AWSDataStorePlugin())

            Amplify.addPlugin(AWSApiPlugin())

            Amplify.addPlugin(AWSCognitoAuthPlugin())

            Amplify.addPlugin(AWSPredictionsPlugin())

            Amplify.configure(applicationContext)

            Log.i(TAG, “Initialized Amplify”)

        } catch (error: AmplifyException) {

            Log.e(TAG, “Could not initialize Amplify”, error)

        }

    }

 

세 번째 단계는 범주마다 다릅니다. 일반적으로 백엔드를 프로비저닝하고 구성하기 위해 AWS Arempify 명령줄을 사용하는 것이 포함됩니다. 범주를 구성하려면 amplify add auth (인증 추가) 또는 amplify add predictions (예측 추가)와 같은 명령을 입력하십시오.

 

예를 들어, Amazon Cognito 및 Login With Facebook과 같은 소셜 ID 제공업체와의 사용자 인증을 구성하려면 다음과 같은 내용을 입력하십시오. 이 단계는 클라우드 백엔드를 생성하고 구성하는 iOS와 Android의 경우와 동일합니다.

 

Facebook, Google 또는 Amazon과 같은 소셜 ID 제공업체와 Single Sign-On을 구성하는 방법에 대해 알아보려면 제가 Amplify iOS 워크샵에서 작성한 ‘단계별 설명서’를 참고해 주시기 바랍니다.

 

DataStore를 구성하려면 데이터에 대한 GraphQL 스키마를 만들어야 합니다. Amplify는 앱에서 데이터를 나타내기 위해 기본(Swift 또는 Java) 코드를 생성합니다. 네트워크 연결이 가능할 때 데이터를 저장하고 백엔드와 동기화하기 위해 오프라인 데이터스토어를 투명합니다.

 

마지막인 네 번째 단계는 실제로 Amplify의 라이브러리 코드를 런타임에 호출하는 것입니다.

 

예를 들어 Amazon Cognito 호스트 웹 사용자 인터페이스를 사용하여 인증을 트리거한다고 하면 다음과 같은 코드를 사용합니다.

 

// iOS (swift) in AppDelegate object

    func signIn() {

        _ = Amplify.Auth.signInWithWebUI(presentationAnchor: UIApplication.shared.windows.first!) { (result) in

            switch(result) {

                case .success(let result):

                    print(result)

                case .failure(let error):

                    print(“Can not signin \(error)”)

            }

        }

    }

 

 

// Android (Kotlin) in MainActivity

    fun signIn(view: View?) {

        Amplify.Auth.signInWithWebUI(

            this,

            { result: AuthSignInResult -> Log.i(TAG, result.toString()) },

            { error: AuthException -> Log.e(TAG, error.toString()) }

        )

    }

 

위의 명령문은 아래와 같은 화면을 트리거합니다.

 

 

마찬가지로 Datastore에 항목을 생성(GraphQL을 통해 Amazon DynamoDB로 유지)하려면 다음의 코드가 필요합니다.

 

// iOS

    func create() {

        let note = Note(content: “Build iOS application”)

        Amplify.DataStore.save(note) {

            switch $0 {

            case .success:

                print(“Added note”)

            case .failure(let error):

                print(“Error adding note – \(error.localizedDescription)”)

            }

        }

    }

 

// Android

    fun create(view: View?) {

        val note: Note = Note.builder()

            .content(“Build Android application”)

            .build()

 

        Amplify.DataStore.save(

            note,

            { success -> Log.i(TAG, “Saved item: ” + success.item.content) },

            { error -> Log.e(TAG, “Could not save item to DataStore”, error) }

        )

 

예측 범주로 텍스트 변환을 트리거하려면 다음의 코드만 있으면 됩니다.

 

// iOS

    func translate(text: String) {

        _ = Amplify.Predictions.convert(textToTranslate: text, language: LanguageType.english, targetLanguage: LanguageType.french) {

            switch $0 {

            case .success(let result):

           // update UI on main thread

                DispatchQueue.main.async() {

                    self.data.translatedText = result.text

                }

            case .failure(let error):

                print(“Error adding note – \(error.localizedDescription)”)

            }

        }

    }

 

// Android

    fun translate(view: View?) {

        Log.i(TAG, “Translating”)

 

        val et : EditText = findViewById(R.id.toBeTranslated)

        val tv : TextView = findViewById(R.id.translated)

 

        Amplify.Predictions.translateText(

            et.text.toString(),

            LanguageType.ENGLISH,

            LanguageType.FRENCH,

            { success -> tv.setText(success.translatedText) },

            { failure -> Log.e(TAG, failure.localizedMessage) }

        )

    }

 

 

굉장히 짧지 매끄럽지 않나요?

 

 

 

가격 및 구매 방법

AWS Amplify는 무료로 제공되며, 무료 티어 이상의 애플리케이션에서 사용하는 백엔드 서비스에 대해서만 비용이 청구됩니다.

Amplify iOS 및 Amplify Android는 현재 CocoaPodsMaven Central 코드 저장소에서 구입할  수 있습니다. 소스 코드는 GitHub(iOS또는 Android)에서 사용할 수 있습니다.

 

고객 여러분들이 AWS Amplif로 만드실 모바일 앱은 어떤 모습일지 매우 기대가 됩니다. 해당 서비스에 대한 여러분의 경험을 공유하고 싶으시다면 언제든 망설이시지 말고 스크린샷이나 앱스토어 링크에 남겨 주시기 바랍니다.

 

 

원문URL: https://aws.amazon.com/ko/blogs/aws/new-aws-amplify-libraries-for-android-and-ios/

** 메가존 클라우드 TechBlog는 AWS BLOG 영문 게재 글 중에서 한국 사용자들에게 유용한 정보 및 콘텐츠를 우선적으로 번역하여 내부 엔지니어 검수를 받아서, 정기적으로 게재하고 있습니다. 추가로 번역 및 게재를 희망하는 글에 대해서 관리자에게 메일 또는 SNS 페이지에 댓글을 남겨주시면, 우선적으로 번역해서 전달해드리도록 하겠습니다.