기계 번역으로 제공되는 번역입니다. 제공된 번역과 원본 영어의 내용이 상충하는 경우에는 영어 버전이 우선합니다.

# GraphQL 변형을 사용하여 AWS AppSync 콘솔의 DynamoDB 테이블에 데이터 추가
<a name="add-data-with-graphql-mutation"></a>

다음 단계는 GraphQL 변형을 사용하여 빈 DynamoDB 테이블에 데이터를 추가하는 것입니다. 변형은 GraphQL의 필수 작업 유형 중 하나입니다. 스키마에 정의되어 있으며 데이터 원본의 데이터를 조작할 수 있습니다. REST API의 경우에는 `PUT` 또는 `POST`와 같은 작업과 매우 유사합니다.

**데이터 원본에 데이터 추가**

1. 아직 로그인하지 않은 경우에 로그인 AWS Management Console 하고 [AppSync 콘솔](https://console.aws.amazon.com/appsync/)을 엽니다.

1. 테이블에서 API를 선택합니다.

1. 왼쪽 탭에서 **쿼리**를 선택합니다.

1. 테이블 왼쪽의 **탐색기** 탭에는 쿼리 편집기에 이미 정의된 여러 변형 및 쿼리가 표시될 수 있습니다.  
![\[Explorer tab showing a dropdown menu with mutation and query options like createTodo and deleteTodo.\]](http://docs.aws.amazon.com/ko_kr/appsync/latest/devguide/images/explorer-example-1.png)
**참고**  
이 변형은 실제로 스키마에 `Mutation` 유형으로 존재합니다. 다음과 같은 코드가 있습니다.  

   ```
   type Mutation {
   	createTodo(input: CreateTodoInput!): Todo
   	updateTodo(input: UpdateTodoInput!): Todo
   	deleteTodo(input: DeleteTodoInput!): Todo
   }
   ```
보는 것과 같이 여기에서의 작업은 쿼리 편집기 내부의 작업과 유사합니다.

   AWS AppSync는 앞서 정의한 모델에서 이를 자동으로 생성했습니다. 이 예제에서는 `createTodo` 변형을 사용하여 *TodoAPITable* 테이블에 항목을 추가합니다.

1. `createTodo` 변형 아래에서 `createTodo` 작업을 확장하여 선택합니다.  
![\[Expanded createTodo mutation showing input fields like description, id, name, when, and where.\]](http://docs.aws.amazon.com/ko_kr/appsync/latest/devguide/images/explorer-example-2.png)

   위 그림과 같이 모든 필드의 확인란을 활성화합니다.
**참고**  
여기에 표시되는 특성은 변형의 여러 수정 가능한 요소입니다. `input`은 `createTodo`의 파라미터로 생각할 수 있습니다. 확인란이 있는 다양한 옵션은 작업이 수행된 후 응답에 반환될 필드입니다.

1. 화면 중앙의 코드 편집기에서 작업이 `createTodo` 변형 아래에 표시되는 것을 확인할 수 있습니다.

   ```
   mutation createTodo($createtodoinput: CreateTodoInput!) {
     createTodo(input: $createtodoinput) {
       where
       when
       name
       id
       description
     }
   }
   ```
**참고**  
이 스니펫을 제대로 설명하려면 스키마 코드도 살펴봐야 합니다. `mutation createTodo($createtodoinput: CreateTodoInput!){}` 선언은 작업 중 하나인 `createTodo`가 있는 변형입니다. 전체 변형은 스키마에 있습니다.  

   ```
   type Mutation {
   	createTodo(input: CreateTodoInput!): Todo
   	updateTodo(input: UpdateTodoInput!): Todo
   	deleteTodo(input: DeleteTodoInput!): Todo
   }
   ```
편집기의 변형 선언으로 돌아가면 파라미터는 `CreateTodoInput`의 필수 입력 유형이 `$createtodoinput`이라는 객체입니다. 참고로 `CreateTodoInput`(그리고 변형의 모든 입력)도 스키마에 정의되어 있습니다. 예를 들어, 다음은 `CreateTodoInput`에 대한 보일러플레이트 코드입니다.  

   ```
   input CreateTodoInput {
   	name: String
   	when: String
   	where: String
   	description: String
   }
   ```
여기에는 모델에서 정의한 필드인 `name`, `when`, `where` 및 `description`이 포함됩니다.  
편집기 코드로 돌아가면 `createTodo(input: $createtodoinput) {}`에서 입력을 `$createtodoinput`으로 선언하는데, 이는 변형 선언에도 사용되었습니다. 이렇게 하는 이유는 GraphQL이 제공된 유형에 대해 입력을 검증할 수 있게 하고 올바른 입력과 함께 사용되도록 하기 위함입니다.  
편집기 코드의 마지막 부분에는 작업 수행 후 응답에 반환될 필드가 표시됩니다.  

   ```
   {
       where
       when
       name
       id
       description
     }
   ```

   이 편집기 아래의 **쿼리 변수** 탭에는 다음 데이터를 포함할 수 있는 일반 `createtodoinput` 객체가 있습니다.

   ```
   {
     "createtodoinput": {
       "name": "Hello, world!",
       "when": "Hello, world!",
       "where": "Hello, world!",
       "description": "Hello, world!"
     }
   }
   ```
**참고**  
여기서 앞서 언급한 입력에 대한 값을 할당합니다.  

   ```
   input CreateTodoInput {
   	name: String
   	when: String
   	where: String
   	description: String
   }
   ```

   DynamoDB 테이블에 넣으려는 정보를 추가하여 `createtodoinput`을 변경합니다. 이 경우에는 미리 알림으로 사용할 몇 가지 `Todo` 항목을 만들려고 했습니다.

   ```
   {
     "createtodoinput": {
       "name": "Shopping List",
       "when": "Friday",
       "where": "Home",
       "description": "I need to buy eggs"
     }
   }
   ```

1. 편집기 상단에서 **실행**을 선택합니다. 드롭다운 목록에서 **createTodo**를 선택합니다. 편집기의 오른쪽에 응답이 표시됩니다. 다음과 같을 것입니다.

   ```
   {
     "data": {
       "createTodo": {
         "where": "Home",
         "when": "Friday",
         "name": "Shopping List",
         "id": "abcdefgh-1234-1234-1234-abcdefghijkl",
         "description": "I need to buy eggs"
       }
     }
   }
   ```

   DynamoDB 서비스로 이동하면 이제 다음 정보와 함께 데이터 원본의 항목이 표시됩니다.  
![\[TodoAPITable interface showing a completed scan with 1 item returned in a table format.\]](http://docs.aws.amazon.com/ko_kr/appsync/latest/devguide/images/explorer-example-3.png)

작업을 요약하자면 GraphQL 엔진이 레코드를 파싱하고 해석기가 이를 Amazon DynamoDB 테이블에 삽입했습니다. 다시 DynamoDB 콘솔에서 이를 확인할 수 있습니다. `id` 값에 전달할 필요는 없습니다. `id`가 생성되어 결과에 반환됩니다. 이 예제에서는 DynamoDB 리소스에 설정된 파티션 키에 대해 GraphQL해석기의 `autoId()` 함수를 사용했기 때문입니다. 해석기를 빌드하는 방법에 대해서는 다른 섹션에서 설명하겠습니다. 반환된 `id` 값을 기록해 두세요. 다음 섹션에서 GraphQL 쿼리로 데이터를 검색하는 데 사용할 것입니다.