왕초보 시작반 - 05주 개발일지

01. 내 프로젝트를 서버에 올리기

• 10) "웹서비스 런칭" 에 필요한 개념 소개

  이제 내가 만든 프로젝트를 배포해봅니다. 배포는 누구나 내 서비스를 사용할 수 있게 하기 위해서 작업들이에요. 웹 서비스를 런칭하는 거죠!

  • 웹 서비스를 런칭하기 위해 클라이언트의 요청에 항상 응답해줄 수 있는 서버에 프로젝트를 실행시켜줄 거에요.

  • 언제나 요청에 응답하려면,
    1) 컴퓨터가 항상 켜져있고 프로그램이 실행되어 있어야하고,
    2) 모두가 접근할 수 있는 공개 주소인 공개 IP 주소(Public IP Address)로 나의 웹 서비스에 접근할 수 있도록 해야해요.

  • 서버는 그냥 컴퓨터라는거 기억나시죠? 외부 접속이 가능하게 설정한 다음에 내 컴퓨터를 서버로 사용할 수도 있어요.

  • 우리는 AWS 라는 클라우드 서비스에서 편하게 서버를 관리하기 위해서 항상 켜 놓을 수 있는 컴퓨터인 EC2 사용권을 구입해 서버로 사용할 겁니다.

  • [열 걸음 더 🏃] IP 주소와 포트

    • 사실 우리가 접속하는 컴퓨터는 숫자로 되어있는 주소(IP 주소)가 붙어있어요. 우리가 아는 URL 은 우리가 알아보기 쉽게 하는 등의 이유로 IP 주소를 알파벳으로 바꾼 거에요. 이렇게 변환해주는 시스템을 DNS 라고 합니다.

      

    • IP 주소(줄여서 IP라고 부릅니다)

      : 컴퓨터가 통신할 수 있도록 컴퓨터마다 가지는 고유한 주소라고 생각하면 됩니다. 정확히는 네트워크가 가능한 모든 기기가 통신할 수 있도록 가지고 있는 특수한 번호입니다. 서버는 하나의 주소를 가지고 있습니다.

    • 포트(port)

      : 하나의 IP에 여러 포트가 있습니다. 하나의 포트에 하나의 프로그램을 실행시킬 수 있습니다.
      

02. AWS 서버 구매하기

• 11) EC2 서버 구매하기

• 12) EC2 서버 종료하는 방법 (1년 후 자동결제 방지!)

• 13) EC2에 접속하기

• 14) 간단한 리눅스 명령어 연습하기

  • 리눅스는 윈도우 같지 않아서, '쉘 명령어'를 통해 OS를 조작한다. (일종의 마우스 역할)

    [가장 많이 쓰는 몇 가지 명령어]

  • 팁! 리눅스 커널에서 윗화살표를 누르면 바로 전에 썼던 명령어가 나옵니다.

    ls: 내 위치의 모든 파일을 보여준다.
    
    pwd: 내 위치(폴더의 경로)를 알려준다.
    
    mkdir: 내 위치 아래에 폴더를 하나 만든다.
    
    cd [갈 곳]: 나를 [갈 곳] 폴더로 이동시킨다.
    
    cd .. : 나를 상위 폴더로 이동시킨다.
    
    cp -r [복사할 것] [붙여넣기 할 것]: 복사 붙여넣기
    
    rm -rf [지울 것]: 지우기
    
    sudo [실행 할 명령어]: 명령어를 관리자 권한으로 실행한다.
    sudo su: 관리가 권한으로 들어간다. (나올때는 exit으로 나옴)

03. 서버 세팅하기

• 15) filezilla를 이용해서, 간단한 python 파일을 올려봅니다.

  • 서버에 업로드 할 간단한 파일을 다운로드 받습니다.

    • [코드스니펫] - test.py

      [test.py](https://s3-us-west-2.amazonaws.com/secure.notion-static.com/593aa12f-0c04-40dc-9573-40e1b641c2c1/test.py)

      예) test.py

      # 아주 간단하게, 이 정도만 적어볼까요?
      # 그리고 적당한 곳에 파일을 저장해봅니다.
      print('hello sparta!!')

  • 파일질라 실행, 다음과 같이 설정

    

  • 정보들을 입력하고, ok 누르면 서버의 파일들을 볼 수 있음
    (Host: 내 EC2서버의 ip // User: ubuntu 로 입력)

    ![https://s3-us-west-2.amazonaws.com/secure.notion-static.com/c91661f0-1274-4f35-b9c2-3a09879a0b09/Untitled.png](https://s3-us-west-2.amazonaws.com/secure.notion-static.com/c91661f0-1274-4f35-b9c2-3a09879a0b09/Untitled.png)

  • 마우스로 드래그 해서 파일을 업로드/다운로드하면 됩니다!
    (자, 그럼 이제 간단한 파이썬 파일을 하나 만들어서 업로드 해볼까요?)

    ![https://s3-us-west-2.amazonaws.com/secure.notion-static.com/47a40685-1be7-421f-939f-0fdad19c7d81/Untitled.png](https://s3-us-west-2.amazonaws.com/secure.notion-static.com/47a40685-1be7-421f-939f-0fdad19c7d81/Untitled.png)

04. 원페이지쇼핑몰 업로드해보기

• 25) Robo3T를 이용해서, "내 컴퓨터에서"→"서버에 있는 mongoDB"에 접속하기

  • 좌측 상단 빨간 상자 내 아이콘을 클릭합니다.

    

  • Create 클릭!

    

  • 접속 정보를 세팅합니다.

    

  • 상단 Authentication 탭을 클릭합니다.

    1. Perform authentication 체크박스를 클릭합니다.

    2. 생성한 계정의 아이디와 비밀번호를 입력하고, 'save'를 클릭합니다.

       

• 26) 원페이지쇼핑몰 완성본을 filezilla로 EC2에 업로드해봅니다.

  • 그 전에! MongoDB 접속 세팅을 바꿔주세요!

    AWS의 MongoDB에 아이디와 비밀번호를 추가했으니, 우리의 pymongo에도 아이디와 비밀번호를 입력해주어야 합니다! 그래야 pymongo가 올바르게 DB에 접근할 수 있습니다.

    app.py 파일을 열어서,
    아래 처럼 가운데 한 줄을 바꿔주세요!

    • [코드스니펫] - pymongo 계정 접속

      ```python
      client = MongoClient('mongodb://test:test@localhost', 27017)
      ```

      아래와 같은 뜻이에요!

      client = MongoClient('mongodb://아이디:비밀번호@localhost', 27017)

  • 파일질라에서 homework 폴더 째로 드래그 드롭으로 EC2 인스턴스의 home/ubuntu 폴더에 업로드합니다.

• 27) 완성본을 실행해봅니다.

  • 실행하려고 시도하기

    # home 디렉토리로 이동
    cd ~
    
    # 해당 폴더로 이동해서 아래 코드를 실행합니다.
    python app.py

  • 에러가 나죠? 패키지를 설치하지 않았기 때문입니다.

    # 설치하기
    pip install pymongo

  • 다시 실행해봅니다

    python app.py

• 28) 접속해봅니다!

  • 브라우저에서 접속하기

    http://내AWS아이피:5000/

05. 포트포워딩

• 29) 포트 번호를 떼고 접속해봅니다!

• 30) 포트 번호 없애기 - 기본 개념

  우리는 이미 포트포워딩 세팅을 해뒀기 때문에, 여기서는 개념만!

  • 지금은 5000포트에서 웹 서비스가 실행되고 있습니다. 그래서 매번 :5000 이라고 뒤에 붙여줘야 하죠. 뒤에 붙는 포트 번호를 없애려면 어떻게 해야할까요?

  • http 요청에서는 80포트가 기본이기 때문에, 굳이 :80을 붙이지 않아도 자동으로 연결이 됩니다.

  • 포트 번호를 입력하지 않아도 자동으로 접속되기 위해, 우리는 80포트로 오는 요청을 5000 포트로 전달하게 하는 포트포워딩(port forwarding) 을 사용하겠습니다.

  • 리눅스에서 기본으로 제공해주는 포트포워딩을 사용할 것입니다. 그림으로 보면 아래와 같습니다.

    
    

06. nohup 설정하기

• 31) SSH 접속을 끊어도 서버가 계속 돌게 하기

  • 현재 상황

    Git bash 또는 맥의 터미널을 종료하면 (=즉, SSH 접속을 끊으면) 프로세스가 종료되면서, 서버가 돌아가지 않고 있습니다. 그러나 우리가 원격접속을 끊어도, 서버는 계속 동작해야겠죠?

  • 원격 접속을 종료하더라도 서버가 계속 돌아가게 하기

    # 아래의 명령어로 실행하면 된다
    nohup python app.py &

  • 서버 종료하기 - 강제종료하는 방법

    # 아래 명령어로 미리 pid 값(프로세스 번호)을 본다
    ps -ef | grep 'app.py'
    
    # 아래 명령어로 특정 프로세스를 죽인다
    kill -9 [pid값]

  • 다시 켜기

    nohup python app.py &

• 32) SSH 접속을 종료한 뒤, 접속해봅니다!

  • 브라우저에서 접속하기

    http://내AWS아이피/

07. og 태그

• 37) og 태그 만들기

  • 나홀로메모장에서 배웠던 og:image, og:title, og:description 태그 기억하시나요?

    내 프로젝트도 카톡/페이스북/슬랙에 공유했을 때 예쁘게 나오도록,
    미리 꾸며봅시다!

    

  • static 폴더 아래에 이미지 파일을 넣고, 각자 프로젝트 HTML의 ~ 사이에 아래 내용을 작성하면 og 태그를 개인 프로젝트에 사용할 수 있습니다.

    1. "내 사이트의 제목" 입력하기
    2. "보고 있는 페이지의 내용 요약" 입력하기
    3. 적당한 이미지를 만들거나/골라서 static폴더에 ogimage.png로 저장하기!
       (사이즈 800x400인 이미지를 구글에서 검색!)

    • [코드스니펫] - og태그 넣기

      <meta property="og:title" content="내 사이트의 제목" />
      <meta property="og:description" content="보고 있는 페이지의 내용 요약" />
      <meta property="og:image" content="{{ url_for('static', filename='ogimage.png') }}" />

  • 참고! 이미지를 바꿨는데 이전 ogimage가 그대로 나와요!

    그것은 페이스북/카카오톡 등에서 처음 것을 한동안 저장해놓기 때문입니다.

    • 페이스북 og 태그 초기화 하기: https://developers.facebook.com/tools/debug/
    • 카카오톡 og 태그 초기화 하기: https://developers.kakao.com/tool/clear/og