728x90
목차 1. AWS CLI 2. AWS CLI 설치하기 (macOS) 3. CLI를 이용하여 AWS EC2 인스턴스 생성하기 1. AWS CLI AWS-CLI는 터미널에서 다양한 AWS 서비스를 관리하고 상호 작용할 수 있도록 Amazon Web Services에서 제공하는 도구이다. 설치를 하고 나면 `aws` 명령어를 이용한 작업을 할 수 있다. 2. AWS CLI 설치하기 (macOS) mac OS 환경에서 AWS CLI 설치하기 1. curl 명령을 이용하여 파일을 다운로드한다. $ curl "https://awscli.amazonaws.com/AWSCLIV2.pkg" -o "AWSCLIV2.pkg" 2. 다운로드한 .pkg 파일을 소스로 지정하여 표준 macOS `installer` 프로그램을 실..
오늘 내가 배운 것 1. AWS EC2 2. AWS 계정 3. IAM 사용자 생성하기 4. 여러 IAM 사용자에게 동일한 권한 부여하기 1. AWS EC2 기존에 해본 방법은 AWS EC2 서비스를 이용한 방법으로 배포를 하기 가장 쉽고 기본적인 사항으로 진행했었다. EC2 서비스는 AWS에서 제공하는 서비스 중 하나로 가상화된 컴퓨터 리소스를 얻을 수 있는 서비스이다. 2. AWS 계정 IAM 서비스를 이용해야 한다. 배포를 하는 사람이 여러 명일 때 한 가지 Root 계정을 공유해서 사용하지 않는다. 보안상, 관리 및 추적을 위해서 Root계정을 공유하지 않고, IAM 서비스를 이용해서 사용자를 생성하여 필요한 권한만 부여해서 작업을 한다. AWS를 이용할 수 있는 계정은 2가지 종류가 있다. 1. ..
오늘 내가 배운 것 1. 전역 상태로 관리하기 2. Redux-persist 3. 중첩라우팅 1. 전역 상태로 관리하기 리액트에서의 상태는 쉽게 생각해 보면 자바스크립트의 변수일뿐이다. 변수이기 때문에 새로고침, 페이지를 이동하게 되면 상태가 초기화가 되어 다시 그 페이지를 봤을 때, 초기 상태로 되어있다. 이러한 특징 때문에 생기는 가장 큰 문제가 사용자가 이용 중에 새로고침을 하게 되면 로그인이 풀리는 상황이 있다. 이 문제를 해결하기 위해서 Redux를 사용해서 전역으로 상태를 관리하여 상태를 유지할 수 있었다. 하지만 Redux에서 store를 이용하여 해결하는 방법은 전역 페이지의 이동에 대해서는 해결할 수 있지만, 새로고침은 전체 파일을 다시 읽어서 재렌더를 하는 상황으로 번들링 된 파일들 다..
React의 트리구조를 쉽게 볼 수 있게 도와주는 확장 프로그램 https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=ko React Developer Tools Adds React debugging tools to the Chrome Developer Tools. Created from revision 1a88fbb67 on 2/16/2023. chrome.google.com 리액트를 이용하여 개발하는 사람들에게 필수 확장 프로그램이라고 할 수 있다. 주요 기능은 `컴포넌트 트리 구조 확인`과 `컴포넌트의 상태 및 속성을 확인`이다. 1. 컴포넌트 트리 구조를 확인할 수 있다. ..
오늘 내가 배운 것 1. Reducer action.type 관리하기 2. Redux middleware 3. Reducer action 만들기 1. Reducer action.type 관리하기 action의 type을 작성할 때, string으로 되어있기 때문에, 오타로 인해 원하는 결과를 얻지 못할 수 있다. 그렇기 때문에 이를 해결하기 위해서 변수로 관리하는 방법이 있다. /store/types export const CATEGORY_REQUEST_START = "CATEGORY/REQUEST_START" export const CATEGORY_REQUEST_SUCCESS = "CATEGORY/REQUEST_SUCCESS" export const CATEGORY_REQUEST_ERROR = "CAT..
오늘 내가 배운 것 1. npm package 2. 전역 상태 만들기 3. 초기 상태 만들기 1. npm package 1-1. Redux 상태 관리를 위한 라이브러리로, 하나의 객체(store)를 이용하여 전체 상태를 저장하고, 상태를 업데이트하기 위해 사용한다. 1-2. React-redux redux를 이용하여 만든 store를 react와 연결하기 위해서 사용하는 라이브러리이다. redux는 react 컴포넌트가 아니기 때문에 react-redux안에 있는 Provider 컴포넌트를 이용하여 하위 컴포넌트에게 store을 전달할 수 있게 해 준다. 1-3. Redux-thunk redux의 미들웨어 중 하나로, 액션의 인자값의 데이터타입이 함수 일 때, 그 함수를 실행하고, 그 결과를 다시 객체로..