라이징캠프 (2주차)-4

Do_Doolly·2022년 2월 18일

라이징캠프

목록 보기

6/14

부트캠프 상세내용은 아래 링크[1] 참고.

테스트 서버(AWS 인스턴스)에 Sub Domain과 Redirection을 적용해봤다. 그 전에 앞으로 AWS의 우분투를 자주 사용할 거 같아 쉘을 zsh로 변경하고 플러그인들을 설치했는데 적용하는 과정에서 많이 헤맸다 😭 이번에 적용한 경험으로 다음에는 시간 낭비 하지 말아야겠다!

📖 강의 주제

- Server & Client

Protocol, IP, Port Forwarding, Domain 등의 전반적인 네트워크 인프라 개념 구축

📝 목표

- 로컬 서버 운영

Bitnami 설치 (MAMP)
포트 포워딩

- AWS 서버 운영

AWS 인스턴스 생성
인스턴스 및 OS (Ubuntu) 설정
LEMP 설치
MySQL 외부 접속
Domain 적용
HTTPS 적용

▶️ 개발 일지

8. zsh

1) zsh 설치

zsh은 쉘 스크립트를 위한 강력한 명령 줄 인터프리터다.
bash, ksh, tcsh등 기존 쉘의 일부 기능을 포함해 수많은 개선 사항이 갖추어진 확장형 본 쉘(sh)이다.
Ubuntu 20.04는 default로 bash를 사용한다. 계정에 따라서 쉘을 다르게 설정할 수 있으므로, 사용하고 있는 계정에다 설치하자. 패키지 매니저로 설치하기 전에 update와 upgrade는 필수다!
bash에서 zsh로 변경하고 로그아웃 했다가 다시 들어가면, 아래와 같이 zsh 설정 창이 나온다. 0을 눌러 가볍게 무시하고 설정을 완료한다.

$ sudo apt install zsh
# 현재 사용중인 계정만 적용됨. chsh는 change shell의 약자다.
$ chsh -s /usr/bin/zsh

2) oh-my-zsh 설치

zsh하면 빼놓을 수 없는 프레임워크인 oh-my-zsh을 설치해야 한다. 공식 홈페이지에서 curl이나 wget 명령어로 다운받을 수 있지만, 그러면 자꾸 루트 계정에만 설치돼서 다른 계정으로 사용중이면 직접 설치파일을 받아야 한다.
oh-my-zsh (Github)에 나와있는 manual 설치 방법을 참고한다. 현재 내 위치는 사용 계정의 기본 위치이어야 한다. oh-my-zsh 로고가 보이면 설치 완료다.

$ git clone https://github.com/ohmyzsh/ohmyzsh.git ~/.oh-my-zsh
# zsh config 파일에는 별 내용이 없으니 삭제한다.
$ rm .zshrc
# 새로운 zsh config 파일을 만든다.
$ cp ~/.oh-my-zsh/templates/zshrc.zsh-template ~/.zshrc

3) oh-my-zsh 플러그인

이제 유용한 플러그인을 설치하고 테마를 적용하면 되는데, 내용이 길어져서 Github 링크만 남겨놓는다. 패키지 매니저로 설치하지 말고 직접 다운 받아서 적용해야 한다.
(1) autojump : 이전에 다녀간 디렉토리로 바로 이동하는 기능
(2) zsh-autosuggestions : zsh의 자동완성 기능 확장 버전
(3) zsh-syntax-highlighting : 명령어를 치면 올바른 것인지 확인
(4) zeta 테마 : 현재 사용중인 테마. 깔끔하니 좋은데 이건 취향껏

9. Sub Domain

1) Sub Domian 개념

서브 도메인은 사전적 의미로 도메인에 발급되는 보조 도메인이다.
서브 도메인을 이용하면 다중의 사이트를 한 도메인 아래서 독립적으로 접속할 수 있다. 예를 들어 naver.com은 네이버 메인 홈페이지로 이동하지만, cafe.naver.com이나 blog.naver.com은 네이버에서 관리하는 각기 다른 페이지로 연결된다.
www도 원래 서브 도메인 이었으나 인터넷 초창기부터 널리 보급되면서 지금은 루트 도메인에 연결된 주소로 연결해주는 보조 역할을 하고 있다.

2) Sub Domain 설정

도메인 서비스 홈페이지의 DNS 관리 페이지를 들어간다. 레코드 추가를 누르고 타입을 선택한 뒤 호스트에는 서브 도메인 이름을, 값 위치에는 연결될 서버 주소를 입력한다. TTL은 기본적인 3600으로 두고 저장한다.
여기서 A타입은 IP 주소만, CNAME타입은 URL 주소만 허용한다.
입력한 서브 도메인으로 주소창에 입력하면, 서버로 잘 접속함을 알 수 있다. 처음에 접속하면 위장 사이트일 수 있다는 경고가 뜰텐데 확인 누르고 진행하면 된다.

3) Sub Domain 페이지 추가

보통은 서브 도메인을 추가하는 이유가 다른 기능의 페이지를 보여주기 위함이므로, 새로운 html 파일을 작성해서 연결해놓자. nginx 기본 디렉토리 폴더에 dev와 prod 폴더를 생성하고 각각 html 파일을 만든다.

$ sudo mkdir /var/www/html/dev
$ sudo mkdir /var/www/html/prod
$ sudo vim /var/www/html/dev/dev.html
$ sudo vim /var/www/html/prod/prod.html

html 파일은 아주 기본적인 단어만 입력했다.

<html>
  <!-- prod.html은 Dev 대신에 Prod 입력 -->
  <body>Hello, It's Dev page!</body>
</html>

ngind의 서브 도메인 연결을 설정해줘야 한다. 설정 파일에 들어가서 아래와 같이 작성한다.

# default 말고 다른 config 파일을 만들었다면 그걸로 작성
$ sudo vim /etc/nginx/sites-available/default

######### default 파일 내 #########
# dev 서브 도메인 서버 추가 (prod 서버도 마찬가지)
server {
   listen 443 ssl;
   server_name dev.sosocamp.shop;
   root /var/www/html/dev;
   
   index dev.html;
   
   location / {
      try_files $uri $uri/ =404;
   }
}
######### default 저장 후 종료 #########
$ sudo vim service nginx restart

웹 브라우저에서 서브 도메인을 입력하고 접속하면 아래와 같이 작성한 html 내용이 보인다.

10. Redirection

인터넷 쇼핑 후 결제를 하려다가 인터넷 연결이 끊겼다. 인터넷은 곧바로 연결 됐지만, 한 번 내 아이디로 접속한 세션은 사라졌기 때문에 다시 로그인해서 결제를 진행해야 한다. 이 때 보통 결제창에서 다시 로그인 창으로 넘어간다. 이렇게 서버에서 클라이언트를 특정 서버(페이지)로 보내는 것을 리다이렉션 이라고 한다.
내가 만든 서버에서 IP 주소를 입력하면 도메인으로 접속하도록 리다이렉션 해보겠다. nginx 설정 파일을 먼저 수정하자.

$ sudo vim /etc/nginx/sites-available/default

######### default 파일 내 #########
# Redirection
server {
   listen 443 ssl;
   server_name [AWS 인스턴스 IP 주소];
   return 301 https://www.sosocamp.shop$request_uri;
}
######### default 저장 후 종료 #########
$ sudo vim service nginx restart

(추가) 보안이 걱정되면 http로 접근했을 때 자동으로 https로 리다이렉트 할 수 있다. nginx config 파일에서 http 서버 블럭을 리다이렉션 시키도록 수정하자.

$ sudo vim /etc/nginx/sites-available/default

######### default 파일 내 #########
# HTTP Redirection
server {
   listen 80;
   server_name sosocamp.shop www.sosocamp.shop;
   root /var/www/html
    
   index index.html index.htm index.php;
   
   location / {
      return 301 https://www.sosocamp.shop$request_uri;
   }
}
######### default 저장 후 종료 #########
$ sudo vim service nginx restart