aws cognito3 [React] 서버리스 메모앱-4 해당 글은 [React] 서버리스 메모앱-3와 이어집니다. 이번 글에서는 React Custome Hook, 회원가입 구성, 메모관련 구성에 대해서 작성을 하였습니다. 백엔드 배포 시작하기전에 앞서 이제 본격적으로 API를 사용해야하므로 프로젝트 루트에서 터미널 명령어로 API를 배포해주고 시작하자 npx sst deploy --stage stage React Custom Hook 우리는 회원가입에서 로그인 페이지에서 사용하는 필드와 비슷한 기능을 필요로 한다. 따라서 이 프로세스를 단순화하고 필드 구성요소를 공유하여 사용하기 위해 공통화를 진행해보자. Custom React Hooks의 대표적인 특징으로 컴포넌트 간에 상태 로직을 재사용하는 방법을 제공한다. src/lib/hooksLib.tsx 파일을.. 2022. 5. 7. [React] 서버리스 메모앱-3 해당 글은 [React] 서버리스 메모앱-2와 이어집니다. 이번 글에서는 AWS Cognito 로그인, 세션, 로그인&로그아웃에 대해서 작성을 하였습니다. AWS Coginto로 로그인 이전에 설치해둔 AWS Amplify를 통하여 Cognito 설정에 로그인을 진행해보자. src/containers/Login.tsx 파일에서 Auth 모듈을 추가해주자. import { Auth } from "aws-amplify"; // 상단에 추가 다음은 handleSubmit() 함수를 아래처럼 변경해주자 async function handleSubmit(event: any) { event.preventDefault(); try { await Auth.signIn(email, password); alert("로그인.. 2022. 4. 24. [AWS] 서버리스 스택-4 해당 글은 [AWS] 서버리스 스택-3와 이어집니다. 이번 글에서는 사용자 인증 및 API 보안 등에 대해서 작성을 하였습니다. 서버리스 앱에서 인증 여태가지 작성한 서버리스 REST API를 만들었지만, 몇 가지 빠진 것이 있다. 안전하지 않다. 그리고 특정 사용자와 연결되어 있지 않다. 사용자가 메모 앱에 가입하고 인증된 사용자만 액세스 할 수 있도록 하는 방법이 추가로 필요하다. AWS 서비스를 통해 인증 및 액세스 제어가 작동하는 방식을 살펴보도록 하자. 위에 그림은 사용자가 메모 앱에 등록하고 인프라를 보호할 수 있도록 다음과 같은 아키텍처로 변경한 모습이다. Cognito 사용자 풀 사용자의 가입 및 로그인 기능을 관리하기 위해 Amazon Cognito User Pool 이라는 AWS 서비스.. 2022. 4. 6. 이전 1 다음
