iwinv - ubuntu) react spa 배포하기 (nginx)

1. iwinv에 들어가 서버를 생성하고 terminal로 접속한다.

- 비밀번호는 가입한 이메일로 정보가 온다. 

 

 

2. 터미널 접속 후 다음 명령어를 통해 비밀번호를 변경하자 (추후 개인키 공개키로 바꾸기)

passwd

 

3. nginx 설치하기

sudo su -

apt update

apt install nginx

 

3-1. nginx 켜기

sudo service nginx start

 

3-2. nginx 켜졌나 확인하기

 

sudo service nginx status

 

acitve 뜨면 성공

 

 

 

3-3. nginx 기본 페이지 접속해보기

 

호스트 주소로 들어가보면 다음과 같은 화면이 나옴

 

---

4. react cra 프로젝트 build하기

 

5. 빌드한 파일 서버에 올리기 

 

5-1. 파일질라 켠 후 호스팅 주소로 접속

호스트명은 주소명이고 

아이디는 이메일로 온다.

비밀번호도 따로 변경하지 않았다면 이메일에 있는 비밀번호로 접속하면 됨

 

5-2. 호스팅 주소에 nginx로 사용할 디렉토리 생성하기

 

etc, var, home 등의 기본 디렉토리가 있는 곳에

원하는 아무 폴더명으로 디렉토리 생성한다.

 

5-3. 생성한 디렉토리에 배포한 build파일을 넣어준다.

 

---

6. nginx로 접근시 빌드파일 html을 보여주도록 설정하기

 

6-1. nginx 설정파일로 이동

cd /etc/nginx

 

해당 디렉토리로 이동하면 

아래와 같은 디렉토리,파일들이 있다.

 

여기서 

nginx.conf 파일 안에

3가지 디렉토리의 파일들을 포함하고 있다.

 

nginx.conf 

- sites-enabled/*

- conf.d/*.conf

- modules-enable/*.conf

 

 

 

 

 

 

 

 

난 sites-enable/default 파일에 적용했다. 

 

6-3. default 설정파일에서 기본 값을 만들어준 디렉토리의 html로 접근하게 하기

cd sites-enable

vi default

 

server {
        listen 80 default_server;
        listen [::]:80 default_server;

        # SSL configuration
        #
        # listen 443 ssl default_server;
        # listen [::]:443 ssl default_server;
        #
        # Note: You should disable gzip for SSL traffic.
        # See: https://bugs.debian.org/773332
        #
        # Read up on ssl_ciphers to ensure a secure configuration.
        # See: https://bugs.debian.org/765782
        #
        # Self signed certs generated by the ssl-cert package
        # Don't use them in a production server!
        #
        # include snippets/snakeoil.conf;

        
        #root /var/www/html;
        #>>>>>>>>>>>>>>>> 여기가 바뀜 <<<<<<<<<<<<<<<<<
        # 기존디렉토리 설정 내용 주석처리하고
        root 내가만든디렉토리명

        # Add index.php to the list if you are using PHP
        index index.html index.htm index.nginx-debian.html;

        server_name _;

        location / {
                # First attempt to serve request as file, then
                # as directory, then fall back to displaying a 404.
                try_files $uri $uri/ =404;
        }

        # pass PHP scripts to FastCGI server
        #
        #location ~ \.php$ {
        #       include snippets/fastcgi-php.conf;
        #
        #       # With php-fpm (or other unix sockets):
        #       fastcgi_pass unix:/run/php/php7.4-fpm.sock;
        #       # With php-cgi (or other tcp sockets):
        #       fastcgi_pass 127.0.0.1:9000;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #       deny all;
        #}
}

 

수정 후 저장 명령어를 하고 나옴

:wq!

 

 

6-4. nginx 재시작

sudo service nginx restart