본문 바로가기
CLOUD/AWS

[Amplify photo] GraphQL api 생성하기

by Rainbound-IT 2021. 9. 1.
반응형

APPSYNC 세팅

이제 인증된 사용자를 가지고 앨범을 만들기 위한 API를 만들어 봅시다.

이 앨범에는 아직 사진이 없고 단순히 이름과 앨범을 생성한 사용자 이름만 있을 것입니다.

 

AWS AppSync를 사용하여 API를 구현하고, 데이터 기반 어플리케이션을 구현하기 위하여 관리형 GraphQL 서비스를 사용합니다. 아직 GraphQL이 익숙하지 않다면 워크샵 단계를 진행하기 전에 시간을 내어 다음 자료를 살펴 보세요. https://graphql.github.io/learn/ 단계를 계속하는 동안에도 질문이 생긴다면 위 자료를 참조하시기 바랍니다.

 

 

 

AWS AppSync API 추가하기

다음 명령어를 수행합니다.

amplify add api

 

GraphQL Schema 정의

앨범과 사진을 저장하고 조회하기 위한 스키마 정의입니다.

 

 

 

 

photo-albums/amplify/backend/api/photoalbums/schema.graphql 에 다음을 저장합니다.

# amplify/backend/api/photo-albums/schema.graphql

type Album @model @auth(rules: [{allow: owner}]) {
    id: ID!
    name: String!
    photos: [Photo] @connection(name: "AlbumPhotos")
}

type Photo @model @auth(rules: [{allow: owner}]) {
    id: ID!
    album: Album @connection(name: "AlbumPhotos")
    bucket: String!
    fullsize: PhotoS3Info!
    thumbnail: PhotoS3Info!
}

type PhotoS3Info {
    key: String!
    width: Int!
    height: Int!
}

그리고 amplify push를 하여 수정사항을 반영합니다.

 

 

QUERIE 수행하기

 

콘솔에 appsync에서 쿼릴르 수행합니다.

사용자 풀을 사용하여 로그인에 전에 만들었던 계정을 입력하여 로그인합니다.

여기서 aws_user_pools_web_client_id를 선택하여 위에 로그인합니다.

 

그리고 아래쿼리를 하나씩 붙여넣어 주황색 화살표를 클릭하면 해당쿼리가 수행됩니다.

 

새로운 앨범 추가하기

mutation {
    createAlbum(input:{name:"First Album"}) {
        id
        name
    }
}

 

다른 앨범 추가하기 

mutation {
    createAlbum(input:{name:"Second Album"}) {
        id
        name
    }
}

 

앨범 목록 조회하기

query {
    listAlbums {
        items {
            id
            name
        }
    }
}

 

AWS AppSync의 대화형 쿼리 실행 영역인 이곳에서 쿼리를 작성하거나 변경하고, 쿼리를 실행하여 결과를 볼 수 있습니다. 이는 Resolver들이 우리가 예상한 대로 잘 작동하는지 테스트하기 위한 좋은 방법입니다.

 

 

 

보다시피, GraphQL 쿼리와 mutation으로 데이터를 읽고 작성할 수 있습니다. AppSync는 데이터 조회와 데이터 보존(Persisting)을 담당합니다.(이 예시는 DynamoDB에 해당).

 

 

 

 

 

Reference

 

GraphQL learn

https://graphql.github.io/learn/ 

 

 

반응형

댓글