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

104

풀스택 서버리스

)

}

export default ConfirmSignUp

다음 두 가지 양식은 잊어버린 비밀번호의 재설정을 처리하기 위한 것입니다. 첫 번째 양식인

ForgotPassword

컴포넌트는 사용자의 이름을 입력받고 확인 코드를 전송합니다. 사용자는

두 번째 양식인

ForgotPasswordSubmit

컴포넌트에서 전달받은 확인 코드를 사용하여 비밀

번호를 재설정할 수 있습니다.

5.2.4

ForgotPassword

컴포넌트

ForgotPassword

컴포넌트는 양식 상태 (

formState

)를 업데이트하는

updateFormState

함

수와 [

Reset

password

] 클릭 시 호출할

forgotPassword

함수를

props

로 전달받습니다.

/* src/ForgotPassword.js */

import React from 'react'

import Button from './Button'

import { styles } from './Form'

function ForgotPassword(props) {

return (

<div style={styles.container}>

<input

name='username'

placeholder='Username'

onChange={e => {e.persist();props.updateFormState(e)}} ...