dukDukz
21.07.20 AWS_front 본문
# backend 설치 해야 할 것들
node js
mysql
# front end 설치해야 할 것들
node js
nginx
# webpack 부분에 대해 잘못 알고 있는것
webpack 은 서버가 아니다!!!
이것은 단순히 build 만 해주는 녀석이고
다양한 js css 같은 파일을 하나의 js와 css 파일로 묶어주는 녀석이지 서버가 아니다.
그저 dev server 개발서버 일 뿐이다.
즉 생성을 해주는 녀석이다.
# nginix
80번 포트를 열어서 html 가져와서 link rel 읽어서 css 까지 가져오게 해주는 녀석이 nginx 이다.
실무에서 많이 씀
환경설정만 하면 된다.
# front-end 설정 - node js 까지는 설치 해줘야 함
$ sudo apt-get update
$ sudo apt-get install -y build-essetial
$ sudo apt-get install curl
$ curl -sL http://deb.nodesource.com/setup_14.x | sudo -E bash --
$ sudo apt-get install -y node.js
확인 방법
$ node -v
$ npm -v
# nginx 설치
$ sudo apt-get install nginx
도중에 [y/n] 나오면 y 눌러주기
이로써 설치는 끝이다.
이제 환경만 잡아주면 된다.
# [환경설정]
$ cd /etc/nginx
$ ls -al
1. nginx.conf : 설정파일 ( 단순히 text 파일이다. )
$ vi nginx.conf
-> 여기 안에서 http 부분
#은 주석이다.
2. sites-available :(폴더) - 설정 파일 저장소
ex )
변수 선언해서 내용을 입력만 받은 상태
arr = [1,2,3,4,5,6,7,8,9]
3. sites-enabled : (폴더) - 설정 파일을 실행시키는 녀석
ex)
arr[0] // 1
arr[2] // 3
arr[4] // 5
[심볼릭 링크]
윈도우로 치면 - 바로가기로 만들어서 실행시킨다.
# 스텝
1. sites-available > 설정 파일을 만들고
2. sites-enabled > 바로가기 세팅하기
3. nginx 실행
vi 많이 실행할거임
# 명령어
cp : 폴더나 파일을 복사
mv : 폴더나 파일을 이동시킴
unix, linux, window
유료 무료 유료
<- 이거의프리웨어
그래서 거의 흡사함
계정에 따른 권한 들이 잘 설정 되어있다.
root 라고 되어있으면 최고 관리자(sudo)만 접근 가능
cp -r [기존디렉토리] [변경할디렉토리]
$ sudo cp -r /etc/nginx/sites-available/ /etc/nginx/sites-available-backup
$ ls -al
// 하면 우리가 만든 폴더[sites-available-backup]가 생성됨
$ sudo cp -r /etc/nginx/sites-enabled/ /etc/nginx/sites-enabled-backup
$ ls -al
// 하면 우리가 만든 폴더[sites-enabled-backup]가 생성됨
이제 저 두 폴더를 각각 들어갈건데
현재 내 디렉토리가
/etc/nginx
에서
$ cd sites-available
$ ls -al
여기서 default 폴더 지울거임
$ sudo rm default
나와서
$ cd ..
$ cd sites-enabled
$ ls
여기서 default 폴더 지울거임
$ sudo rm default
끝나면 cd .. 나오기
# 환경설정
1. sites-available > 설정 파일을 만들고
$ cd sites-available // 이 폴더에 들어와서
$ sudo vi myapp.conf // 파일 없으므로 생성됨
server {
listen 80; // 포트 실행번호
location /{ // uri 가 뭐냐 '/'
root /home/ubuntu/www; // 내가 실행시킬 파일 경로
index index.html index.htm; //내가 실행시킬 파일명
try_files $uri /index.html; // http://localhost:3000/about - 링크 이동을 막아줌
}
}
esc 누르고 :wq!
2. sites-enabled > 바로가기 세팅하기
cp [기존디렉토리] [변경할디렉토리]
mv [기존디렉토리] [변경할디렉토리]
ln -s [기존디렉토리] [바로가기만들디렉토리]
/etc/nginx/sites-available
$ ls
기존 디렉토리 : ./myapp.conf
$ sudo ln -s /etc/nginx/sites-available/myapp.conf /etc/nginx/sites-enabled/myapp.conf
/etc/nginx 로 이동
cd ..
$ cd ./sites-enabled
lrwxrwxrwx 1 root root 12 Jul 20 03:38 myapp.conf -> ./myapp.conf
cd ..
잘 되는지 테스트
$ sudo nginx -t
# [바로가기 만들 때 : 상대경로로 잘못 쓴 경우 - 지우고 다시 만들어야 함]
/etc/nginx
$ cd sites-enabled
$ sudo rm myapp.conf
$ sudo ln -s /etc/nginx/sites-available/myapp.conf /etc/nginx/sites-enabled/myapp.conf
$ cd ..
$ sudo nginx -t
successful 뜨면 성공
3. nginx 실행
$ sudo systemctl start nginx
$ sudo systemctl stop nginx
'웹 개발 > AWS' 카테고리의 다른 글
React Next 프로젝트 배포 후 수정 시 (0) | 2021.08.19 |
---|---|
0805 Next 배포 + https (0) | 2021.08.05 |
21.07.20 AWS 남의 것 clone 받아왔을때 (0) | 2021.07.20 |
21.07.19 Restful API + post man (0) | 2021.07.20 |
21.07.19 AWS background 에서 server 돌리기 (0) | 2021.07.20 |