AWS Amplify + react + vite 튜토리얼 (2)
·
AWS
이번에는 cli가 아닌 Amplify console에서 백엔드 환경을 연결해보자. 1. Amplify Studio 시작 Get Start를 누르면 몇 초 후 아래와 같은 화면이 나온다 2. authentication service 만들기 인증 부분을 구현하기 위해 Authentication 탭 클릭 인증 방식에 대한 설정을 할 수 있다. email을 id로 할 것인지, username을 id로 할 것인지 비밀번호 구성은 어떻게 할 것인지 등 설정을 해 준뒤 Deply이 버튼을 누르고 배포가 완료되면 아래 그림처럼 가이드가 나온다. (Deployment successful - click for next steps클릭) 복사해서 Amplify Cli로 작업을 해보자. 아래처럼 설정을 완료한 다음 amplif..
AWS Amplify + react + vite 튜토리얼 (1)
·
AWS
amplify에 vite로 번들링한 리액트 앱을 배포하다가 자꾸 에러가 나서 처음부터 천천히 다시 해보기로 했다. 1. vite-react 만들기 이번엔 yarn으로 만들어보자 yarn create vite amplify-react-vite 2. amplify로 배포하기 이번에는 백엔드 환경 설정하지 않고 바로 배포해보자. https://wonillism.tistory.com/274 AWS Amplify + React 튜토리얼(1) 1. AWS 계정 만들기 AWS 계정 만드는 방법은 생략. 프로젝트 진행은 루트 계정이 아닌 IAM 계정으로 진행하는 것을 권장한다. 2. Amplify CLI 설치 우선은 amplify cli를 전역적으로 설치해주고, amplfiy 설정 wonillism.tistory.co..
AWS Amplify + React 튜토리얼(2)
·
AWS
이번에는 AWS Amplify로 인증부분을 연결해보자. 1. authentication service 만들기 amplify add auth 진행하던 프로젝트에서 위 명령어를 입력 가이드에따라 자신이 원하는 방식으로 설정하면 amplify에서 자동으로 aws cognito와 연결해준다. amplify push 추가한 서비스를 배포하기위해 위 명령을 입력하면 인증 서비스가 배포된다. amplify console 프로젝트에 배포된 서비스를 확인하려면 위 명령어를 입력하면된다. amplify status cli에서 연결된 서비스를 확인하려면 위 명령어를 입력 2. 로그인 UI 생성 우선 최초에 프로젝트에 만들어진 필요없는 파일들을 지우자. npm install aws-amplify @aws-amplify/ui-..
AWS Amplify + React 튜토리얼(1)
·
AWS
1. AWS 계정 만들기 AWS 계정 만드는 방법은 생략. 프로젝트 진행은 루트 계정이 아닌 IAM 계정으로 진행하는 것을 권장한다. 2. Amplify CLI 설치 우선은 amplify cli를 전역적으로 설치해주고, amplfiy 설정을 해준다. npm i -g @aws-amplify/cli amplify configure amplfiy configure을 입력하면 aws console에 로그인하라는 창이 뜬다. 로그인. Specify the AWS Region ? region: # Your preferred region Specify the username of the new IAM user: ? user name: # User name for Amplify IAM user Complete the ..
AWS Amplify
·
AWS
AWS Amplify란 AWS Amplify는 안전하고 확장 가능한 모바일 및 웹 애플리케이션을 구축하기위한 개발 플랫폼이다. 간단하게 요약해보자면 EC2, RDS, Cognito, Lambda 등과 같은 독립적인 서비스는 아니다. Amplify CLI로 다수의 독립적인 서비스를 자동으로 생성하고 연결해 준다. 프로젝트 내에서 Amplify 객체로 생성된 AWS 서비스에 접근할 수 있다. Amplify의 장점으로는 클릭 몇번으로 Github, Gitlab 등의 리포지토리에 있는 프로젝트를 배포할 수 있다. 여러 브랜치르 띄워서 본인의 브랜치가 배포됐을때 어떻게 보이는지 확인할 수 있으며, 대쉬보드를 통해 현재 상황이 어떤지 알 수 있고 빌드에 실패하더라도 이전 버전의 빌드가 계속 유지되고있기 때문에 운영..
AWS IAM(Identify and Access Management)
·
AWS
IAM 이란 IAM이란 Identify and Access Management의 약자로 AWS 리소스를 사용하는 유저, 그룹 사용권한 등을 전체적으로 관리하는 서비스이다. 모든 서비스에 걸쳐 영향을 미치기 때문에 AWS를 잘 사용하기 위해서나 특히 팀이나 여러명이 작업하는 프로젝트라면 필수적으로 알고 넘어가야 하는 부분이다. AWS 계정을 처음 생성하는 경우에는 전체 AWS 서비스 및 계정 리소스에 대해 완전한 액세스 권한을 지닌 단일 로그인 자격증명으로 시작한다. 이 자격 증명은 AWS 계정 루트 사용자이다. 일상적인 작업, 관리작업의 경우에도 루트 사용자를 사용하지 않는 것을 AWS는 강력히 권장한다. IAM 사용자를 처음 생성할 때만 루트 사용자를 사용하는 모범 사례를 준수한다. 그런 다음 루트 사..
[AWS] AWS Lambda & Amazon API Gateway
·
AWS
AWS Lambda를 API Gateway를 통해 연결을 해보자. AWS Lambda 함수 생성 클릭을하면 아래와 같은 화면이 나온다. 적절한 함수 이름을 정하고, 함수 작성시 사용할 언어를 선택해준다. 나는 Python을 이용해서 만들었다. 위와 같은 예제 코드가 나온다. 기본적으로 Lambda는 event와 context를 파라미터로 가진다. 테스트를 위해 body에 json을 넣지 않고 hello를 넣어 반환해보자. 코드를 완성하고 베포를 누르면 함수 작성이 완성된다. 미리 만들어둔 API Gateway > 경로 탭으로 이동하면 위와같은 페이지가 나온다. Lambda 함수와 연결을 위해 Create버튼을 누르고 Get 방식으로 루트 경로에 생성해보자. 그런 다음 위에서 만든 Lambda와 통합연결을..
[AWS] Amazon API Gateway
·
AWS
Amazon Web Service에서 제공하는 Amazon API Gateway에 대해 알아보자. API는 3종류로 구분할 수 있다. HTTP API REST API WebSocket API HTTP API와 REST API는 거의 같은 의미로 사용되지만 조금 디테일하게 들어가면 두 API는 차이가 있다. HTTP API HTTP를 통신 방식으로 사용하는 API를 HTTP API라고 한다. HTTP API는 endpoint를 API gateway로 활용하여 HTTP 요청을 통해서 서버에 접근할 수 있도록 만둘어준다. 대부분의 Web API가 HTTP API로 이루어지고 있다. REST API REST는 웹 서비스의 구조를 만드는데 활용되는 패턴이다. RESTful API가 되려면 CRUD 방식의 메소드,..
WONILLISM
'AWS' 카테고리의 글 목록