소개

코로나 바이러스 감염증 대책 사이트에 공헌하고 싶었습니다만,
이 기회에 AWS의 Cloud9를 사용해 볼까라고 생각했으므로 비망록입니다.
의견, 개선점이 있으면 알려주세요.

또한 내용의 대부분은 @FPC_COMMUNITY
도쿄도 신형 코로나 바이러스 대책 사이트에의 공헌 방법을 해설
의 기사를 참고로 하겠습니다.

사전 준비

준비가 필요한 것은 AWS Cloud9 회원 등록입니다.
이하의 기사를 참고로 했습니다.
Cloud9의 사용법과 편리한 기능! 최강 프로그래밍 개발 환경(IDE)
우선은 작업 공간의 작성까지 할 수 있으면 OK입니다.
EC2의 인스턴스는 메모리가 큰 것을 선택하면 무난합니다.
기본 t2.micro는 메모리 부족으로 향후 작업에 영향을 줄 수 있습니다.

그리고는 Git hub 는 등록해 주세요.

환경 구축

Git에서 프로젝트 포크

Cloud9가 준비되면 Git에서 소스를 가져옵니다.

도쿄도 신형 코로나 바이러스 대책 사이트의 GitHub 페이지를 열어 주세요.
htps : // 기주 b. 코 m / 토키 메 t 로포 탄 - 고 v / 코 ぃ d19


↑ 화면이 표시되면 화면 오른쪽 상단의 빨간색 테두리로 둘러싸인 [Fork] 버튼을 누릅니다.


↑ 자신의 계정에 Fork 해 온 프로젝트가 표시됩니다.

Cloud9에 Clone 해 온다

Fork 하고 싶은 프로젝트의 [Clone or Download] 버튼을 누릅니다. (↑ 화면 우측 빨간색 프레임 부분)


↑ 화면이 나오면 빨간색 테두리로 둘러싸인 버튼을 눌러 링크를 복사합니다.

Cloud9로 이동하여 자신의 작업 공간을 엽니다.


↑화면의 터미널(빨간색 테두리 부분)에 다음 명령을 입력합니다.

$ git clone コピーしたGithubリポジトリのURL

그러면 ↓과 같이 Github에서 소스가 복사됩니다 (빨간색 테두리).

yarn 소개

Clone한 디렉토리로 이동하여 터미널에서 다음 명령을 입력합니다.

$ npm install -g yarn

$ yarn install

마지막으로 서버를 시작합니다.
터미널에서 다음 명령을 입력합니다.

$ yarn dev

터미널에 ↑의 빨간색 프레임과 같은 설명이 나오면 준비는 OK

마지막으로 Cloud9 화면 상단의 [Preview] → [Preview Running Application]을 누릅니다.



미리보기가 표시되면 환경 구축이 완료됩니다 👏
후에는 삶아지고 구워져 좋아하게 해주세요!
오늘은 여기까지.