Amazon EC2를 이용한 MVC1 패턴 프로젝트 배포
미니 프로젝트 'My Universe'
- 나만의 홈페이지 만들기
- 작업기간 2023.04.12 ~ 2023.05.02
- MVC1 패턴으로 구현
[홈화면]
- 학원 javascript 공부 시간에 배웠던 사진 스크롤 이용하여 하단부 장식
- moment.js 사용하여 화면 중앙부에 현재 시간 보여주기
- 상단 오른쪽 로그인 버튼 부분 → 로그인 상태일 때 로그아웃으로, 로그아웃 상태일 때 로그인으로 화면 출력
[답글형 게시판]
- rownum 이용하여 글 번호 출력
- 메인 글에 달린 댓글 갯수 출력
- 오늘 날짜의 게시글이 있을 경우 해당 게시글 제목 옆에 new 이미지 출력
- 일정 조회수 이상 조회된 게시글일 경우 게시글 제목 옆에 hot 이미지 출력
- 페이징 작업
- 검색 기능
[공지사항 게시판]
- 로그인한 계정이 관리자일 경우 오른쪽 상단에 글쓰기 버튼 출력
- 상단고정 구현
- rownum 이용하여 글 번호 출력
- 오늘 날짜의 게시글이 있을 경우 해당 게시글 제목 옆에 new 이미지 출력
- 페이징 작업
- 검색 기능
[파일 첨부형 게시판]
- 썸네일 구현
- rownum 이용하여 글 번호 출력
- 오늘 날짜의 게시글이 있을 경우 해당 게시글 제목 옆에 new 이미지 출력
- 일정 조회수 이상 조회된 게시글일 경우 게시글 제목 옆에 hot 이미지 출력
- 페이징 작업
- 검색 기능
[이메일 보내기 페이지]
- 정규 표현식을 이용하여 이메일 주소 유효성 검사 구현
[로그인 페이지]
- 로그인 : 로그인 시 세션에 아이디 저장 구현
- 회원가입 : 회원가입 유효성 검사 구현, 회원가입 주소 입력란에 카카오 우편번호 API 사용
- 아이디/비밀번호 찾기 : 임시 비밀번호 10자리 이메일 전송 구현
AWS EC2 서비스를 이용한 호스팅
학원에서는 cafe24를 이용한 호스팅을 진행하고있으나, aws 서비스를 이용한 배포를 직접 부딪쳐보는게(?) 좋을것같다는 개발자 지인의 추천으로 진행해보았다.
아래의 과정으로 진행했다.
AWS 프리티어 생성 후 EC2 서비스를 이용하여 인스턴스(가상의 컴퓨터)를 생성 → 인스턴스에 연결 → 프로젝트와 일치하는 버전의 jdk설치 → jdk 환경변수 설정 → 프로젝트와 일치하는 버전의 tomcat 설치 → 배포할 war파일을 tomcat의 해당 경로에 저장 → tomcat restart → 배포한 페이지로 접속하여 확인
aws 프리티어 생성 후 EC2 서비스를 이용하여 인스턴스 생성
1. 검색하여 이런 저런 사이트의 정보들을 확인해본 후 Ubuntu 20.04 버전을 선택 (프리티어 사용가능인지 확인 해야함)
2. 인스턴스 유형은 무료버전이 하나만 존재하여(나머지 유형은 유료) t2.micro를 선택
3. 인스턴스 용량을 설정 할 수 있음 → 인스턴스 용량은 최대가 30GB 이므로 30GB로 설정했음
4. 키 페어 생성하여 로컬 PC의 안전한 위치에 저장함
인스턴스에 연결
가능한 연결 방법이 2가지가 있는데 SSH 클라이언트 방식으로 해보니 잘 안되어서 EC2 인스턴스 연결 방식으로 진행하였다.
jdk 설치
1. $sudo apt-get install openjdk-17-jdk 명령어를 이용하여 jdk 다운로드
2. 모든 설치가 완료되면 java --version 명령어로 자바 버전 확인한다.
3. Java 환경변수 설정 → $readlink -f /usr/bin/java 명령어로 설치된 jdk의 위치를 찾는다.
4. ubuntu 계정으로는 파일수정이 되지 않으므로 root 계정으로 접속해야한다.
// root로 로그인
su -
// root 계정의 password 초기 비밀번호 설정 명령어
$sudo passwd
// root 계정에 환경변수를 등록
vim /etc/profile5. 위의 명령어로 profile 파일을 연 뒤, i를 눌러 insert모드로 바꾼 후 아래의 내용(export~ 부분)을 추가한다. (4번에서 찾아놓은 jdk의 위치를 추가하면됨)
6. esc를 눌러 insert 모드에서 나온 후 :wq를 입력하여 vim에디터에서 저장 후 종료한다.
7. logout 명령어를 입력하여 root계정에서 로그아웃한다.
8. $echo $JAVA_HOME 명령어를 입력하여 환경변수 설정이 잘 되었는지 확인한다.
tomcat 설치
1. $sudo apt-get install tomcat9 명령어를 입력하여 톰캣 설치 (프로젝트에 맞는 톰캣 버전 설치)
2. 설치 완료 후 $sudo /usr/share/tomcat9/bin/version.sh 명령어를 입력하여 설치된 톰캣 버전 확인
배포할 war 파일을 가상 컴퓨터의 톰캣의 webapps 파일로 이동
필자는 FileZilla 라는 간편한 프로그램이 있다는것을 배포 후에 알게됐다.(ㅠㅠ)
그리하여 필자는 FileZilla 없이 배포한 방법을 설명하겠다.
처음에 구글링 했을때는 배포하고자 하는 war 파일을 가상컴퓨터의 톰캣의 webapps 파일안에 넣어주면 된다라고 하여 war파일 자체를 깃허브를 이용해 넣었다. 하지만 아무일도 일어나지 않았고, 왜 실행되지 않는것인지 고민해 보았다. 일단 톰캣에서 프로젝트를 실행할 때 어떤방식으로 실행되는지를 알아보기위해 로컬컴퓨터의 톰캣파일에 들어가서 webapps 파일을 확인해 보았다.
확인해보니 war 파일이 들어가있는것이 아니라 war파일을 압축해제한 폴더가 들어가있었다. 그리하여 war를 압축 해제한 파일을 톰캣의 webapps 폴더 안에 넣는 방법을 이용하여 배포해 보았다.
1. 배포할 war파일의 압축을 풀어서 깃에 올린다. (프로젝트명 폴더 그대로 올림)
2. $sudo apt-get install git 명령어를 입력하여 패키지 리스트를 업데이트한다.
3. $sudo apt install git 명령어를 입력하여 깃을 설치한다.
4. 설치 완료 후 $git --version 명령어를 입력하여 설치한 git의 버전을 확인한다.
5. 깃 초기값 설정을 해준다. (git config --global user.name [이름] / git config --global user.mail [메일주소])
6. git clone [url 주소] 를 입력하여 가상 컴퓨터의 자신이 원하는 프로젝트를 깃으로부터 내려받는다.
7. clone받은 파일을 $sudo mv [프로젝트명폴더이름] /var/lib/tomcat9/webapps 명령어를 이용해 폴더를 이동시킨다.
8. cd /var/lib/tomcat9/webapps 명령어로 경로 이동 후 ls 명령어를 이용하여 webapps 폴더안의 폴더 및 파일들의 리스트를 확인한다.
9. 폴더이동 확인 후 $sudo service tomcat9 restart 명령어를 이용하여 변경된 부분을 반영시킨다.
배포한 페이지로 접속하여 확인
1. 확인하기 전에 EC2 서비스로 들어가서 인스턴스 → 보안 그룹으로 이동한다.
2. 인바운드 규칙에 8080포트를 설정한다 (tomcat으로의 접근 포트)
3. url 창에 http://[퍼블릭IPv4주소]:8080/[프로젝트명] 을 입력하여 웰컴페이지가 잘 뜨는지 확인한다.
첫 배포에 성공🎉
미니 프로젝트 후기
학원에서 알려준 부분만 구현하지 않고 그 이상 더 구현해 보는것을 목표로 하여서 세부적인 부분을 더 구현시켜 보았다. (공지사항 상단고정, rownum 이용하여 글번호 보여주기, 정규 표현식을 통한 유효성 검사, 세션을 이용하여 로그인 계정마다 다르게 페이지 보여주기, AWS 배포 등)
MVC1 패턴이라 코드가 굉장히 지저분하고, 목적에 맞게 패키지를 나눈다던가 하는 부분이 없어서 다른 사람이 나의 코드를 분석하거나 또는 내가 다른 사람의 코드를 분석할 때 어려움이 있을것 같다는 생각이 들었다. 미니프로젝트로 볼륨이 작은 페이지라서 MVC1 패턴이 가능하다는 생각이 들었다.
이후 진행될 MVC2 패턴의 프로젝트가 기대된다.