[React] AWS S3

노유성·2023년 5월 23일
0
post-thumbnail

🌞AWS S3에 배포하기

지금까지 TDD 실습을 하기 위해 만들었던 앱을 배포하기 위해 AWS S3를 이용해 배포를 하겠다.

⭐AWS S3란

AWS S3는 Amazon Web Services (AWS)의 객체 스토리지 서비스입니다. S3는 Simple Storage Service의 약자로, 클라우드 환경에서 데이터를 안전하게 저장하고 검색할 수 있는 스토리지 솔루션을 제공합니다.
S3는 인터넷을 통해 접근할 수 있는 스토리지 서비스로, 기업이나 개인이 파일, 이미지, 동영상, 데이터베이스 백업 등을 저장하고 관리할 수 있습니다. S3는 매우 확장 가능한 서비스이며, 업계 표준 암호화 기술을 사용하여 데이터의 보안을 보장합니다.
-chatGPT

🪐AWS S3를 이용해서 배포하는 과정


먼저 개발자가 깃허브에 code를 배포하고 github와 aws s3를 연결하면 테스트 케이스를 확인후에 테스트 케이스가 다 통과하면 코드가 배포된다.

⭐실습

🪐깃허브에 연결하기

🪐workflow 생성하기

깃허브에 가서 로컬과 연결을 했으면 repository의 카테고리 중 action에 들어간다.

그럼 다음과 같은 화면이 나오는데 검색창에 node를 검색해서 선택한다.


그러면 다음과 같은 코드가 기본적으로 작성이 되어있다.

# This workflow will do a clean installation of node dependencies, cache/restore them, build the source code and run tests across different versions of node
# For more information see: https://docs.github.com/en/actions/automating-builds-and-tests/building-and-testing-nodejs

name: Node.js CI

on:
  push:
    branches: [ "main" ]
  pull_request:
    branches: [ "main" ]

jobs:
  build:

    runs-on: ubuntu-latest

    strategy:
      matrix:
        node-version: [14.x, 16.x, 18.x]
        # See supported Node.js release schedule at https://nodejs.org/en/about/releases/

    steps:
    - uses: actions/checkout@v3
    - name: Use Node.js ${{ matrix.node-version }}
      uses: actions/setup-node@v3
      with:
        node-version: ${{ matrix.node-version }}
        cache: 'npm'
    - run: npm ci
    - run: npm run build --if-present
    - run: npm test

node-version: [14...] 부분은 node의 각각 14 version, 16 version, 18 version의 node로 테스트를 진행하겠다는 코드이다.

🪐AWS S3 버킷 생성하기



🪐S3로 앱 자동 배포를 위한 yml파일 완성하기

https://github.com/awact/s3-action
위 주소로 가면은 workflow 파일에 추가적으로 작성해야 하는 내용에 대해서 설명하고 있다.

사진의 아래에 key_id와 access_key는 발급받아야하며, secrets 객체에 AWS_ACCESS_KEY_ID, AWS_SECRET_ACCESS_KEY를 key값으로 각각 발급받은 key값을 저장하면 된다.

🪐IAM


이렇게 IAM사용자를 만들어서 key값들을 발급받고 나서

깃허브의 Setting 카테고리에 가서

secrets -> actions로 들어가면 key, value를 추가할 수 있다. 발급받은 값들을 등록하고 action의 yml파일을 재빌드하면은 웹사이트가 적절하게 배포된다

profile
풀스택개발자가되고싶습니다:)

0개의 댓글