웹 개발 프로젝트 를 하신 분들은 웹 개발 프로젝트에서 코드를 작성한 것은 시작에 불과하는 것에 공감 하실 것입니다.

Flask 를 이용해서 원하는 기능을 개발하고, 최적화를 시킨 이후에
HTMLCSS 그리고 Java Script 를 이용해서 사용자 인터페이스(UI)와 디자인, 기능들을 구현해야 합니다.

이런 과정들을 겪고 나면 최종적으로 배포 (Deployment)를 진행해야 합니다.

지금까지는 개발 서버 (ex. localhost:5000)를 이용해서 우리의 웹사이트에 접근을 하고 서비스를 이용할 수 있지만 다른 사람들이 접근하려면 배포하는 과정을 거쳐야 합니다.

이번 포스팅은 저의 웹사이트의 배포과정이 담겨 있습니다.

AWS (Amazon Web Service)

우선 저는 AWS(Amazon Web Service) 를 이용해서 배포를 했습니다.
AWS와 같은 클라우드 서비스를 이용하는 대표적인 이유는 배포를 위해선 서버가 필요한데, 서버를 위탁하지 않고 직접 관리하는 On-Premise 방식을 사용하면 직접 서버를 설치하고 관리해야 하기 때문에, 이러한 과정을 생략하기 위해 Off-Premise 방식을 사용했습니다.

image

대표적인 클라우드 서비스로는 Microsoft의 Azure, Google의 Google Cloud 그리고 제가 사용하는 Amazon의 AWS가 있습니다.

AWS EC2

서버를 열기 위해선 클라우드 서비스에서 제공하는 서버 리소스인 인스턴스가 필요합니다.

AWS에서 인스턴스를 여는 과정은 다음과 같습니다.

1. AWS 접속 후 회원가입

AWS 계정에는 핵심인 Route와 여기서 파생되는 IAM으로 나눠져 있는데, 이는 추후에 다루겠습니다.

2. AWS EC2

image

이 곳에서 저희의 인스턴스와 관련된 주된 작업을 수행합니다.

3. Launch Instance

image

그후 인스턴스를 생성하시면 됩니다. 원하는 리전(region), 운영체제(OS), 용량(Volume) 등을 설정하시면 되는데, 저는 Ubuntu 를 사용했습니다.
또한, AWS는 첫 1년간 프리티어 를 사용할 수 있습니다. 좋은 스펙의 서버를 주지는 않지만, 개인 프로젝트로는 충분한 용량입니다.

4. Connect Instance

image

인스턴스에 접속했을 때 뜨는 커널입니다. 선택한 운영체제에 따라서 다르게 뜹니다

Server Construction

이제 인스턴스 생성이 완료되었으니, 이제 본격적인 서버 구축을 해야 합니다.
지금부터 나오는 내용은 모두 저의 운영체제인 Ubuntu 기준 입니다.

1. apt-get update

$ sudo apt update
$ sudo apt upgrade


2. python3 & pip3

python3.x 부터는 python3를 사용 하셔야 합니다

$ sudo apt install python3
$ sudo apt install python3-pip


올바르게 설치되었는지 확인합니다

$ python3 --version
$ pip3 --version


3. 패키지 설치

저의 웹사이트는 Flask 웹 프레임워크를 사용해서 설치해주었습니다.

$ pip3 install flask

image

그 과정에서 error: externally-managed-environment 오류로 인해 다음 명령어로 해결해주었습니다.

$ sudo rm /usr/lib/python3.12/EXTERNALLY-MANAGED

image

Git Clone

패키지 세팅이 완료 되었으니 이젠 저의 파일을 옮겨와야합니다.
GitHubgit clone 을 사용해서 편하게 옮겨주겠습니다.

1. git 설치

마찬가지로 git을 설치해줍니다.

$ sudo apt install git


똑같이 올바르게 설치되었는지 확인해줍니다.

$ git --version


2. git clone

image

사진의 링크를 복사한다음 다음 명령어에 붙여줍니다

$ git clone [복사한 링크]


이후 GitHub 아이디와 패스워드를 입력해주시면 완료입니다.

3. gh 설치

수정사항이 생겼을때 빠르게 push를 할수있는 gh 를 깔아주었습니다

$ sudo apt install gh


수정한 후 파일을 push할때 다음 명령어만 입력해주면 됩니다

$ gh repo sync


최초 사용할 경우 personal access token을 넣어서 로그인 해주셔야 합니다.

$ gh auth login


image

다음 빈칸에 토큰을 넣어주시면 되는데 방법은 다음과 같습니다.

image

GitHub 에 들어가서 Settings에서 Developer Settings에 들어가준 후에 토큰을 발행해줍니다.

image

다음과 같이 권한을 준 후에 발행해 줍니다.
expiration은 원하는 기간만큼 설정해 주시면 됩니다.

그후 토큰을 아까 그곳에 입력해주면 완료입니다.

Running

이제 임시적으로 잘 작동되는지 테스트를 해보겠습니다.

$ python3 [파일 명]


image

잘 작동합니다. 하지만 아직 포트설정과 도메인, Ip설정을 아무것도 안했기 때문에 Ip와 포트번호를 모두 입력해서 접속해야 합니다.
Flask같은 경우에는 포트번호가 5000번이기 때문에 5000 포트를 열어준 후에 접속해야 합니다.

Inbound rules

image

다음과 같이 5000포트를 열어주었습니다. 마찬가지로 추후 접속할 HTTP 의 80포트, HTTPS 의 443번 포트까지 열어주었습니다.
다음 포스팅에서는 도메인설정과 Nginx 를 이용하여 포트경로를 수정해보겠습니다.