dukDukz

21.07.20 AWS_front 본문

웹 개발/AWS

21.07.20 AWS_front

헤일리_HJ 2021. 7. 20. 14:09

# 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