스파르타코딩클럽 웹개발종합반 강의 후기
본격적으로 항해99를 시작하기 전, 사전강의로 4종의 강의를 제공받았다.
그 중 2회독 필수인 '웹개발종합반'강의에 대한 회고록을 작성하려한다.
배운 것을 정리하는 위주로 글 작성.
5주차
5주차에선 4주차에 배운 것을 복습하고 인터넷 상에 실제로 배포하는 것을 실습했다.
파이참으로 서버와 클라이언트 파일을 만들고, AWS ec2 서버를 Gitbash로 접속해
Filezilla로 서버 파일을 업로드하고, Flask 서버를 실행 해
가비아로 구입한 도메인으로 웹페이지를 배포했다.
서버
- 웹 페이지가 언제나 켜져있도록 하려면
- 컴퓨터가 항상 켜져있고 프로그램이 실행되어 있어야하고
- 모두가 접근할 수 있는 공개 주소인 공개 IP 주소(Public IP Address)로 나의 웹 서비스에 접근할 수 있도록 해야한다.
- 본 실습에서는 AWS라는 클라우드 서비스로 항상 켜놓을 수 있는 EC2로 서버 사용.
AWS
-
AWS : 본 실습에서는 AWS라는 클라우드 서비스로 항상 켜놓을 수 있는 컴퓨터인 EC2로 서버 사용.
-
AWS의 OS로 리눅스의 Ubuntu를 사용.
-
SSH(Secure Shell Protocol) : 다른 컴퓨터에 접속할 때 쓰는 프로그램으로 EC2에 접속하기 위해 필요.
GitBash
- GitBash : Windows에서 ssh를 사용하기 위해 설치 필요.
간단한 리눅스 명령어
ls: 내 위치의 모든 파일을 보여준다.
mkdir: 내 위치 아래에 폴더를 하나 만든다.
cd [갈 곳]: 나를 [갈 곳] 폴더로 이동시킨다.
cd .. : 나를 상위 폴더로 이동시킨다.
sudo [실행 할 명령어]: 명령어를 관리자 권한으로 실행한다.
sudo su: 관리가 권한으로 들어간다. (나올때는 exit으로 나옴)
- Gitbash 서버 세팅 방법
ssh -i 받은키페어를끌어다놓기 ubuntu@AWS에적힌내아이피
# python3 -> python 파이썬3말고 파이썬이라고 치고 명령내림
sudo update-alternatives --install /usr/bin/python python /usr/bin/python3 10
# pip3 -> pip pip라는 패키지 설치에 도움주는 마법사 설치
sudo apt-get update
sudo apt-get install -y python3-pip
sudo update-alternatives --install /usr/bin/pip pip /usr/bin/pip3 1
# port forwarding 80포트로 오는 요청을 5000포트로 포트포워딩
sudo iptables -t nat -A PREROUTING -i eth0 -p tcp --dport 80 -j REDIRECT --to-port 5000
#gitbash꺼도 계속 웹이 돌아가게하는 명령어
nohup python app.py &
# nohup으로 계속 켜둔 웹페이지 작동 끄는 명령어
ps -ef | grep 'python app.py' | awk '{print $2}' | xargs kill-
지금은 5000포트에서 웹 서비스 진행중인데 매번 5000붙은걸 떼기 위해 80포트로 오는 요청을 5000포트로 전달해주는 포트 포워딩 사용.
-
http에선 80이 기본 포트라서 :80안붙여도 된다.
-
다른거 올릴땐 gitbash로 가서 서버 끄고 서버에 작업한거 지우고 다시 업로드하면 된다.
Filezilla
Filezilla 연결법
좌측이 내 컴퓨터 폴더, 우측이 서버 폴더. 새 사이트를 만들고프로토콜 : SFTP
호스트 : AWS의 퍼블릭 IPv4 주소(숫자만)
포트 : 22
로그온 : AWS키파일
사용자 : ubuntu
OK
도메인 설정
- 가비아로 가서 dns설정
호스트이름 : @
값/위치 : AWS의 퍼블릭 IPv4 주소(숫자만)
확인 – 저장.
정리!
-
파이참에서 서버와 클라이언트 파일 작업
-
AWS로 가서 인스턴스 시작
-
Filezilla로 서버 폴더에 1에서 작업한
static templates app.py업로드 -
Gitbash 켜서 세팅 후 nohup으로 서버 실행
-
가비아에서 구입한 도메인으로 아이피 연결
메타태그(OG) 사용법
- HTML의
<Head>에 밑에 내용 붙여넣기
<meta property="og:title" content="내 사이트의 제목" />
<meta property="og:description" content="보고 있는 페이지의 내용 요약" />
<meta property="og:image" content="이미지URL" />실습내용 & 어려웠던 점
-
Flask 실습. 버킷리스트.
Post : 버킷리스트 작성한 것을 DB에 저장.
Get : 웹페이지에 버킷리스트 붙이기.
Post2 : 완료버튼 눌러 완료상태로 만들기. -
AWS 실습. 만들어진 팬명록 사이트 배포.
-
Gitbash에서 AWS EC2 연결에 오류 발생해 해결에 시간을 꽤 소요.
문제점과 추정 원인
EC2 인스턴스와 SSH를 연결할 때 "Connection timed out" 에러 발생.
구글링을 통해 EC2 인바운드 규칙 수정, 공유기 포트 추가 등록 등
여러 솔루션 진행해봤지만 다 실패.
계속 검색 결과 SK브로드밴드 인터넷 환경에서
EC2에 필요한 포트22를 닫아놓는다는 정보를 알게 됨.
하필 이 날 이사로 인해 인터넷을 KT에서 SK로 바꿔서 진행이 안 되었던 것. ㅠㅠ해결책
다른 사정으로 인해 집이 아닌 숙박업소에서 인터넷을 쓸 수 있는 환경이 조성되어
그 곳에서 서버를 켜보니 문제 없이 해결 완료.
만약 집에서 할 경우 sk브로드밴드가 아닌 스마트폰 테더링이나 다른 인터넷 환경으로
진행 시 문제 해결 예상.
해결책블로그링크
링크2
