[Challenge / day-26] 개발환경 구축

오늘의 공부범위 : 46,47강 내용(Part4. ch1. 1-2강)

 

목차

1. AWS amplify

2. 개발환경 셋업

 

#1. AWS amplify

 

저번에 소개한 AWS amplify를 제대로 활용하기 위해서는 amplify CLI를 설치해야한다고 해서 설치하려고 하였다. 나는 몇 달 전에 가입해둔 것이 있기 때문에 가입하는 것은 생략하고 바로 강사님 따라서 console 화면까지 잘 들어갔다. 그런데, AWS 홈에서 amplify를 직접 검색해서 들어가보니 다음과 같은 화면이 나와서 잠시 당황했다.

 

어라..? 저는 CLI 설치하고 싶은데요..? 스튜디오랑 호스팅은 아직 안할건데 ㅠㅠ 어떻게 하는지 헤메다가 링크를 강의자료에서 주신 것 같아서 주신 링크로 들어오니 AWS docs 쪽이랑 연결되어서 다행히도 원하는 페이지에 들어올 수 있었다. 그런데, 잘 생각해보니 이렇게 헤멜일이 전혀 아니고,,, 윈도우 파워쉘을 열어서 그냥 설치하면 되는거였다. 나는 부트캠프하면서 노드랑 npm은 이미 설치되어 있기에 그냥 설치하면 되는건데..!!!

 

그래서 바로 설치해봤다.

npm install을 하면서 found 0 vulnerabilities를 본 것이 처음인 것 같다.. AWS god..😝😝

 

amplify CLI를 제대로 사용하려면 내 AWS 계정과 연결해야한대서 바로 해주었다.

이미 연결되어 있어서 그대로 넘어갔다 그런데, 갑자기 Region을 specify 하라그래서 당황했지만 ap가 Asia-percific이겠지 싶어서 남동 아시아로 선택했는데 문제가 있거나 잘못 고른거면 바꿀수 있겠지 싶어서 일단 이것으로 선택했다..!!

강의에서는 이 부분은 안했는데 왜 이렇게 갑자기 넘어왔나 싶다..ㅋㅋㅋ

 

무엇인지도 모르고 만드는게 내 특기지만... 아무생각없이 사용자이름만들고 액세스키 만들기 싫어서 일단 취소하였다..!!

그리고서는 강의를 따라서 amplify command 에는 어떤 것들이 있는지 살펴보았다. amplify help를 입력하면 다음과 같이 리스트가 쭉 나온다.

 

내 파워쉘은 깃 명령어가 안되는줄 알았는데 잘 된다..?!

강의에서는 로컬파일을 만든다음에 깃허브에 연동하는 방법을 사용했는데, 나는 레포지토리부터 만들고 그 안에 파일을 채우는 방식이 익숙해서 그렇게 했는데 다음에는 로컬파일 만들고 레포지토리 만들어서 연결하는 방식을 사용해야겠다. 아마 내가 git 명령어가 안되는 경험이 반복되어서 github Desktop에 의존해왔는데 그것 때문에 깃허브 홈페이지에서 레포지토리를 미리만들고 편하게 깃허브 데스크탑 앱으로 클론을 해오는 방식을 이용해서 강사님이 하신 방식과 반대 방식이 익숙해져있는 것 같다.

 

자 이제 클론도 했으니 amplify와 github 연동을 해야한다.

연동을 하면 배포과정에서도 branch마다 커밋현황을 살펴서 이제 커밋할 때가 되었다 하고 알려준다는데 좀 더 사용해보고 과연 그게 어떤 편리한 과정인지를 살펴보도록 하자.

저번에 막혔던 부분에서 이제는 진행할 수 있게 되었다. 프론트엔드 부분을 진행하는 것이므로 백엔드 부분이 아니라 웹 앱 호스팅 부분으로 들어가서 다음과 같이 내 파일들이 저장되어 있는 곳이 어디인지 선택해준다.

음... 나 왜 Northeast-2지..? 분명 Southeast1 골랐는데...

일단 권한 설정은 해준다. 지역은 나중에 바꾸더라도.

 

그리고나서 전체 레포지토리에 설치하지말고..!! 선택된 레포지토리에만 설치하도록 설정해준다. 찐 프로젝트들만 amplify로 관리해주어야지 코딩테스트 준비용 거의 dummy에 가까운 레포지토리들까지 다 설치하는 것은 좋은 아이디어는 아니다.

 

 

그리고 더치페이 서비스 만들 레포지토리 선택해주고 다음 버튼을 누르고,

 

여기서도 현재에는 빌드 설정을 할 것이 없기때문에 다음을 눌러준다.

그런데...?

여기를 체크 안하면 안넘어가지는데... 왜 나만 이러지 일단은 체크하고 넘어간다..! 혹시 이 부분에 관해서 문제가 있다면 다음에 다시 찾아와서 수정하도록 하겠다.

 

그리고서는 뜬금.. 갑자기 배포를 처음으로 하게된다. 아무것도 안만들었는데..?!ㅋㅋㅋㅋ

 

 

짜잔!!

 

배포 중에 강사님께서 하나하나 설명해주셨는데, 먼저 1번 항목은 여러 stage 중 어떤 stage가 선택되었는지를 보여주는 것이라고 하셨다. product stage 와 dev/sandbox stage 로 실제 사용되는 제품과 테스팅하는 곳이 구분되어서 바로 배포하면 위험부담이 있을 경우 테스팅을 해야하는데 테스트하는 stage를 선택해서 배포해서 사용해보고 안전하면 product stage로 이식해서 배포하는 과정을 말하는 것 같았다.

 

2번 항목은 메인에 마지막 커밋항목이 무엇인지 깃허브 기준으로, 알려주고 Auto-build라 되어있는 것은 커밋이 되면 자동으로 빌드를 해주도록 설정되어있다는 말이라고 하셨다. 그리고 3번에서 프로비젼, 빌드, 배포, (verify - 왜 나는 이 단계가 안보이는지는 모르겠다.. 아까 설정 안한 IAM 때문일지도..?) 각 단계에서 어떤 코드들로 실행이되는지 로그를 확인할 수 있고 실패 시 어느 부분에서 실패했는지 알 수 있어서 디버깅하기도 너무 좋은 도구임을 알 수 있다.

 

3번항목을 눌러서 나오는 화면에서 빌드기록 보기를 누르면 

다음과 같이 해당 앱에서 몇번의 빌드과정이 있었는지 기록을 볼 수 있다.

 

일단은 이 정도로 셋업은 끝났다.. 의문사항이 몇 개 있지만 해보면서 해결하는 것도 나름의 재미가 아닐까.. ㅎㅎㅎ

 

다음 시간은 바로 코딩을 한다는데 강의 목차상으로는 디자인 레이아웃을 만든다. 다음 시간도 ㅎㅇㅌ!!

 

관련링크

패스트캠퍼스 : http://bit.ly/3Y34pE0

패스트캠퍼스 [직장인 실무교육]

 

본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성되었습니다.

 

#패스트캠퍼스 #패캠챌린지 #수강료0원챌린지 #환급챌린지 #직장인인강 #직장인자기계발 #패캠인강후기 #패스트캠퍼스후기 #오공완 #사이드프로젝트10개기술스택으로구현하는풀스택서버리스프로젝트withReact