일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- 착한코딩
- 웹개발
- 스컬킹점수
- 파티룸
- 보드게임점수계산
- 구로파티룸
- 개발자
- 부천공간대여
- 서울파티룸
- mysql
- 옥길동요거트
- 휴식
- 가장존경하는인물
- 일
- MBTI
- 스컬킹
- 스컬킹점수계산
- 취미
- 스페이스우일
- 코딩
- 옥길동파티룸
- 옥길요거트
- 보드게임점수
- 광명파티룸
- 해외여행
- 그릭요거트
- 옥길그릭요거트
- 부천파티룸
- 존경하는위인
- 옥길파티룸
- Today
- Total
SIMPLE & UNIQUE
1. create-react-app/EC2배포/ssh sftp 접속 본문
1. create-react-app 으로 프로젝트를 만들면 아래와 같은 디렉터리 구조가 생성된다.
로컬에서 http://localhost:3000/ 로 접속했을때, 개발한 화면이 보이는 상태면 된다. (이미지는 아래 더보기 버튼)
2. AWS 계정을 생성한다.
아래 AWS에서 제공해주는 한국어 가이드를 참고한다.
https://aws.amazon.com/ko/premiumsupport/knowledge-center/create-and-activate-aws-account/
3. EC2 인스턴스 생성
EC@ 대시보드에서 인스턴스 시작 클릭
4. ubuntu Server 16.04 선택
단계1 : ubuntu Server 16.04 선택 (이미지는 아래 더보기 버튼)
5. t2.micro 선택
단계2 : t2.micro 선택/ (이미지는 아래 더보기 버튼) > 하단 [다음:인스턴스 세부정보 구성] 버튼 선택
> 단계 5까지는 계속 다음 버튼만 누른다.
% 프리티어란 : 1년동안 무료제공
6. 포트 3000, 80추가
단계6 : [규칙추가] 버튼 클릭 > 3000포트와 80포트를 아래와 같이 추가한다.
3000포트는 리엑트 기본포트로 테스트할때 사용할 것이고, 80포트는 포트를 사용하지 않겠다는 의미이다.
도메인을 사서 ec2 ip를 연결할 때는 연결하려는 ip뒤에 포트가 있으면 안되기 때문에, 차후에 리엑트 내부에서 80포트를 쓰겠다고 설정할 것이다.
7. 키페어 다운로드
단계7 : 시작하기 클릭 > 키페이 생성 > 다운로드
키페어는 1번만 다운로드 받을 수 있으니 파일을 잘 관리한다.
인스턴스 시작을 누르고 인스턴스 상태가 running인 상태가 되면 아래 8번 시작
8. mobaxterm으로 ssh/sftp 접속
https://mobaxterm.mobatek.net/
mobaxterm와 같은 ssh/sftp를 접속할수있는 프로그램을 열고
8-1. ssh
화면에서 Seesion > SSH를 선택하고
아래와 같이 ip와 **.pem 확장자로 끝나는 키페어파일을 업로드 한다.
여기서 ip는 아래 화면(더보기 클릭)에서 IPv4 퍼블릭 IP이다.
%참고로 탄력적 IP를 세팅하지 않으면 서버를 재부팅할 때마다 IPv4 IP는 바뀐다. 실제 운영하는 서비스인 경우 무조건 탄력적 IP를 써서 도메인에 연결해야한다.
ssh 연결이 되면 login as라고 나오는데 아이디를 입력하라는 뜻이다.
디폴트 아이디는 ubuntu이고 패스워드는 아직 세팅하지 않았으니 아이디만 입력한다.
아래 명령어로 root권한으로 파일에 접근한다. home/ubuntu 경로로 이동한다.(cd.. > cd home/ubuntu)
sudo su - //root 계정으로 접근
8-2. sftp
sftp를 이용해 파일을 직접 서버에 올릴 것이다. git을 통해서 가져오는 법도 있지만 ftp를 이용하면 빠르게 필요한 파일만 수정해서 올릴 수 있다. 각각 장단점이 있겠지만, 초보자한테는 ftp를 이용해서 원시적 방법으로 서버 파일을 관리하는게 도움이 될 것이라 생각한다.
ssh 설정과 동일하게 아래와 같이 세팅해준다. Username도 ubuntu로 입력한다.
정상적으로 로그인하면 아래와 같이 왼쪽에 로컬 디렉터리, 오른쪽에 서버 티렉터리가 조회된다.
바탕화면에 있는 파일을 드레그해서 서버 디렉터리에 놓으면 쉽게 파일을 업로드 할 수 있다.
다음글 sftp로 파일을 전송하고 ssh터미널을 통해 서버에 node npm yarn을 설치 후 react 서버를 구동한다.
https://leejungyeoul.tistory.com/86?category=649936
'React & Node > Guide' 카테고리의 다른 글
3. 가비아 도메인을 AWS ec2 react 서버 ip에 연결한다. (0) | 2019.11.15 |
---|---|
2. AWS ec2 /sftp로 react 파일 전송/ssh로 서버세팅/ip로 서버 접속 (1) | 2019.11.15 |
node server/npm mysql/connection pool 구현 (0) | 2019.11.06 |
USER 정보 로그인 세션관리/react-cookies/jsonwebtoken (0) | 2019.11.05 |
JWT(JSON Web Token)/npm jsonwebtoken (0) | 2019.11.01 |