풀스택 서버리스: 리액트, AWS, 그래프QL을 이용한 최신 애플리케이션 개발

73

3

장

첫 번째 애플리케이션 만들기

3.4.3

노트 삭제(그래프

QL

뮤테이션)

다음으로 노트를

삭제

하는 방법에 대해 알아보겠습니다. 노트 삭제를 위해서는 다음과 같은 것

들이 필요합니다.

1

.

그래프

QL

API

와

UI

에서 노트를 삭제하는

deleteNote

함수

2

.

각 노트에

deleteNote

함수를 호출하는 버튼

먼저

deleteNote

뮤테이션을 가져오겠습니다.

import {

createNote as CreateNote,

deleteNote as DeleteNote

} from './graphql/mutations'

그 후

App

함수 안에

deleteNote

함수를 만들겠습니다.

async function deleteNote({ id }) {

const index = state.notes.findIndex(n => n.id === id)

const notes = [

...state.notes.slice(0, index),

...state.notes.slice(index + 1)

]

dispatch({ type: 'SET_NOTES', notes })

try {

await API.graphql({

query: DeleteNote,

variables: { input: { id } }

})

console.log('successfully deleted ...