본문 바로가기

CRA2

[React] 서버리스 메모앱-2 해당 글은 [React] 서버리스 메모앱-1와 이어집니다. 이번 글에서는 리액트 라우터에, AWS Amplify, 로그인 폼에 대해서 작성을 하였습니다. React 라우터 설치 Create React App은 기본적으로 많은 것을 설정해주지만 경로를 처리하는 방법은 제공되지 않는다. 현재 구성중인 React 앱은 단일 페이지로 동작하기 때문에 React Router 를 사용하여 이를 처리해보자. React Router를 사용하면 /login 처럼 경로를 지정할 수 있으며 사용자가 해당 페이지로 이동할 때 로드되어야 하는 React Component를 지정할 수 있다. 터미널에서 frontend/ 경로가 맞는지 확인 후 아래 명령어를 실행하자 npm install react-router-dom@5.2.0 .. 2022. 4. 18.
[React] 서버리스 메모앱-1 해당 글은 [AWS] 서버리스 스택-4와 이어집니다. 이번 글에서는 리액트 프론트엔드 구성에 대해서 작성을 하였습니다. 우리는 React.js를 사용하여 SPA 웹 애플리케이션을 생성할 계획이다. Create React App 프로젝트를 사용하여 기초적인 설정이 되어있는 상태에서 진행한다. Create React App은 React팀이 공식적으로 지원하며, React.js 프로젝트의 모든 의존성을 편리하게 미리 패키징 해준다. 터미널에서 프로젝트의 최상위 경로에서 아래 명령어를 실행하여 Create React App(CRA) 프로젝트를 생성해주자. npx create-react-app frontend --scripts-version 4.0.3 --template typescript --use npm cd.. 2022. 4. 17.