goorm.io 에서 서비스 배포 연습하기!

 

 

IDE ?

 

 

IDE (Integrated development environment) 통합 개발 환경 이란 코딩, 디버그, 컴파일, 배포 등 프로그램 개발에 관련된 모든 작업을 하나의 프로그램 안에서 처리하는 환경을 제공하는 소프트웨어다. 최근의 통합 개발 환경(IDE)은 그래픽 사용자 인터페이스(GUI) 응용 프로그램 개발용 고속 개발 도구가 많다.

 

 

자세한 내용은 아래 링크에 기재되어 있다.

https://ko.wikipedia.org/wiki/%ED%86%B5%ED%95%A9_%EA%B0%9C%EB%B0%9C_%ED%99%98%EA%B2%BD

통합 개발 환경 - 위키백과, 우리 모두의 백과사전

 

 

 

이번 수업에서는 goorm 의 서비스를 이용해서 간단하게 서비스를 배포해보는 시간을 가졌다. 지금 이런 정규 교육을 받은 지 20일쯤 되어 가는데 부끄럽지만 서버 관련해서 무언가를 하는 건 다 백엔드(back-end) 분야인 줄 알았고 리눅스나 우분투 aws 들어만 봤지 한 번도 제대로 본 적이 없었다... 그리고 vi...

 

 

 

 

 

 

 

https://namu.wiki/w/vi#s-4

 

vi 매뉴얼

 

 

◆ vi(visual editor) 파일의 내용을 보여줌과 동시에 파일의 내용을 편집할 수 있는 텍스트 에디터 프로그램,

• vim(vi improved) 리눅스의 메인 에디터로 vi에 없던 다양한 기능들을 추가한 상위 호한 버전 같지만 다른 느낌의 프로그램.

 

 

 

아무튼 일단 우리가 해본 실습은 vi(visual editor) 환경에서 이루어졌는데 느낌은 윈도 창에 cmd와 크게 봤을 때는 cli(Command-line interface)로 비슷하게 보이지만 cmd(command)는 명령 또는 명령어의 준말로 시스템의 명령 줄 해석기이다. gui 가 없었을 때 키보드로 컴퓨터로 무언가 요청할 때 명령을 내려야 하는데 그럴 때 사용했던 명령 프롬프트이고 vi는 위에 설명했듯이 문서 편집 프로그램이다.

 

 

 

우리는 구름 io 에 회원가입을 하고 콘솔로 가서 컨테이너를 먼저 생성했다. 컨테이너는 일종의 가상 환경(가상 pc)을 대여? 해준다는 느낌이다.

Ec2 (Amazon Elastic Compute Cloud(Amazon EC2)는 안전하고 크기 조정이 가능한 컴퓨팅 용량을 클라우드에서 제공하는 웹 서비스입니다.)  구름은 아마존에서 EC2를 이용하고 있으며 도커 컨테이너를 사용해서 빠르게 개발환경을 구축할 수 있게 지원하고 있다.

 

컨테이너를 생성할 때 옵셥들은 모두 기본으로 잡혀져 있는걸 사용했고(우분투{ubuntu}) 컨테이너의 이름은 ide 에서 연습을 할때 좀 더 편하게 하려고  test라고 지어서 했다. 그리고 약간의 시간이 지나면 컨테이너가 생성되는데 아래와 같은 이미지다.

 

 

 

짜잔 여긴어디..

 

 

 

그리고 실행하면 가슴이 웅장 해지는 인터페이스 화면이 나온다. 선생님 말씀으로는 어느 곳에서는 마우스가 전혀 필요도 없는 vi 환경이 있는 곳도 있어서 모든 걸 키보드 하나로만 처리해야 한다고 하셨다... 하지만 구름 ide에서는 편의 기능을 많이 지원하는 거 같아서 처음 사용해봤는데도 생각보다 빠르게 적응할 수 있었던 거 같다.

 

 

 

 

 

 

기본적인 사용 명령어들

mkdir  + 이름 = 폴터 만들기
mrdir + 이름 = 폴더 삭제하기
rm 은 파일 삭제
touch 는 파일 생성
pwd 현재 폴더 확인하기

ls -al 모든파일 보기 숨김파일 포함
cd 띄어쓰기 폴더이름 쓰면 해당폴더로 이동

vi 띄어쓰기 파일 하면 에디팅 코딩 가능하게됨
그리고 i  누르면 키보드 입력 할수있음

입력후 esc 누르고 : 콜론 입력 후 wq! 강제로 나간다.

쉬프트 i 는 맨 앞으로 커서
쉬프트 a 는 맨 뒤로 커서 

명령모드에서  / 입력후 찾는 문자열 쓰고 엔터를 누르면 
원하는 문자열 찾아짐 다음은 n 이전은 N ㅇ으로

cd ~ 은 루트 폴더로 가기

cp abc.txt def.txt
abc.txt 파일을 def.txt로 이름을 바꾸어 복사합니다.

cp abc.txt xyz
xyz라는 디렉토리가 없다면 abc.txt 파일을 xyz 파일로 복사합니다.
xyz라는 디렉토리가 있다면 xyz 디렉토리 안에 abc.txt 파일을 복사합니다.

cp abc.txt xyz/def.txt
abc.txt 파일을 xyz 디렉토리 안에 def.txt라는 이름으로 복사합니다.

cp -r abc xyz
abc가 디렉토리이고 xyz라는 디렉토리가 없다면, abc 디렉토리를 xyz로 이름을 바꾸어 복사합니다.
abc가 디렉토리이고 xyz라는 디렉토리가 있다면, abc 디렉토리를 xyz 디렉토리 안에 복사합니다. 즉 xyz/abc가 됩니다. 

 

 

# mkdir -p a/{b,c}
# mkdir a b

cd leehojun

pwd
# print working directory

ls

ls -al

ll

touch test.py

ls

clear

vi test.py

# i
# print('hello world')
# ESC
# :
# wq!
#        ESC       a, i, o
# 편집모드 - 명령모드 - 입력모드
#         :        ESC
# 명령모드에서 아래 명령어 실행
# dd :삭제
# 2dd : 2줄 삭제
# 6x : 6개 char 삭제
# yy : 복사 (아래 붙여넣기를 해야합니다.)
# p오른쪽 붙여넣기, P위에 붙여넣기
# i : 입력모드
# o : 커서가 있는 한 칸 아래
# a : 커서 다음으로 추가
# Shift + i : 현재 있는 라인 가장 앞에서 추가
# Shift + a : 현재 있는 라인 가장 뒤에서 추가
# Shift + v : 여러줄 선택(y 눌러서 복사 후 p 누르면 붙여넣기, 또는 d(삭제), 또는 =(정렬))
# Shift + ^, Shift + $ : 처음과 마지막
# hjkl : 방항키 대용
# Ctrl + f, Ctrl + b : 이후와 이전 페이지 보기
# u는 실행 취소
# /python으로 python이라는 단어를 찾을 수 있음, n이면 이후, N이면 이전

python test.py
# Tab - 자동완성
# History - 화살표 위, 아래

cat test.py
# 양이 많으면 more를 사용
# q : 종료
# enter : 1행 아래로
# z 또는 스페이스바 : 1페이지 다음페이지
# b : 이전페이지
# = : 현재 행번호 표시
# /문자열 : 문자열 검색 (구름에서 제대로 하이라이팅이 되지 않음)
# v : 현재 열려있는 위치에서 vi 실행
# ls -al | more

echo "hello world" > hello.txt

cp test.py test2.py

ls

ls -al > result.txt

mv test2.py ../

mv result.txt ../

ls

rm test.py

cd ..

rmdir leehojun
# 파일있는 폴더 지울 때에는 rm -r leehojun/
# -r는 recursive 재귀적으로 파일 지움

mkdir one/two/three
# error

mkdir -p one/two/three/four
# 남은 폴더는 클릭으로 지웁니다.
# --parents 옵션으로도 가능

mkdir one;cd one
# 동시 실행

touch sample.txt
# 안에 위키백과(python에 대해)에서 가지고 온 문구를 넣습니다.

cat sample.txt | grep "python"
# touch test{3..5}.txt
# touch test6.txt test7.txt

wget http://www.paullab.co.kr/images/ceo.png
# Web에서 get한다!

cd ..
# 남은 폴더는 클릭으로 지웁니다.

sudo apt-get install git
#sudo는 Super User Do
#apt-get은 패키지 매니저! 앱을 다운로드하는 google studio와 같은 역활!

git clone https://github.com/paullabkorea/10000hour.git

sudo apt-get update

sudo apt-get install nginx

vi /etc/nginx/sites-available/default
# root /var/www/html; 을 root /workspace/컨테이너이름/web; 으로 고치세요.
# :set number
# :41

sudo service nginx start
# server 확인
# sudo service nginx stop

top
# 작업관리자
# q를 누르면 빠져나감

ps
# 현재 프로세스 상태

ps aux

kill 22131
# 22131이라는 PID(프로세스아이디)를 가진 프로세스 종료

cd ~
cd /

find / -name 'test2.py'
find / -name '*.py'
sudo find / -name '*.py'
# 현재 폴더면 .

cd 위에서 찾은 폴더로 이동

chmod 700 test.py
# chmod(Change Mode)
# 파일의 종류 / 소유자 / 그룹 사용자 / 기타 사용자
# rwx - 읽기(4), 쓰기(2), 실행(1)

ls -al

chmod ugo+x test.py
# 사용자 카테고리 u(파일 소유자), g(그룹), o(기타 사용자)
# +권한 부여, -권한 제거

ls -al

# 압축파일 올리고
unzip test.zip

mkdir leehojun;touch test.py;touch testTwo.py

zip -r leehojun.zip ./leehojun

 

 

---

 

 

 

 

기본적인 우리가 할 내용은 nginx를 설치하고 깃을 클론 하고 nginx의 기본루트로  되어있는 걸 배포할 깃의 페이지의 디렉토리로 바꿔주고 배포 시작 그리고 잘 되고 있는지 확인하는 것이다.

 

nignx의 설치는 apt-get install nginx을 입력해주면 자동으로 확인하고 설치해주는데 대부분의 명령어들은 간단하고 직관적인 거 같다.

 

 

 

---

 

 

 

그러고 나서 배포할 프로젝트를 불러와야 하는데 우리는 이전에 만들었던 과제를 깃에서 클론 해서 사용할 것이기 때문에  터미널에 git clone https://github.com/paullabkorea/10000hour.git 입력해서 불러온다. vi 에디터에서도 복붙이 있는데 단축키다 다르니 주의 Shift + Insert : 붙여넣기

 

-나는 이미 한번 불러와서 이렇게 나옴-

 

 

---

 

 

 

완료가 되면 vi /etc/nginx/sites-available/default를 입력해줘서 해당 디렉터리로 편집기를 실행한다.

 

 

 

 

---

 

 

그리고 해당 문서에서 root /var/www/html;라고 쓰여있는 곳을 찾은 후 i 또는 a를 눌러서 편집 모드로 바꾼 뒤에 저기에다가 클론 된 깃의 디렉터리를 작성해 주면 된다. root /workspace/컨테이너 폴더 이름/프로젝트 폴더; 이런 식인데 프로젝트 폴더 안에는 무조건 index.html로 돼있어야 그 파일을 인식해서 배포할 수 있다 (주의)  나의 경우는 root/workspace/test/1000 hour;라고 작성한다. 그리고 esc를 누르고 편집 모드에서 나와 :wq 저장 나가기를 해준다.

 

이제 마지막으로 sudo service nginx start를 누르면 배포가 시작된다! 

 

 

---

 

 

 

이렇게 done이라고 나오면 성공한 것인데 이것만으로는 잘됬는지 모르니 상단 메뉴에서 프로젝트 - 실행 url과 port를 누른다. 그럼 아래와 같은 화면이 나오는데 여기서 서비스되는 url 옆에 아이콘을 클릭해서 사이트가 잘 뜨면 정말 성공한 것이다.

 

 

 

url 확인!

 

 

---

 

 

성공이다. 당연히 수업시간에 화면을 보면서 따라서 하니까 쉬워 보이고 이번 내용도 어떻게 보면 이해도를 높이기 위해서 굉장히 단순하고 짧게 진행 됐던 거 같다 물론 수업 시간 자체는 길었다 한 번에 따라가는 사람들은 많이 않으니까.

그러고 나서 혼자 같은 프로세스를 5번 정도 해본 거 같은데 (포스팅하는 동안 포함) 포스팅하면서 내가 뭘 잘못 건드려서 nginx 파일이 날아가서 지우고 다시 깔고 두 번은 한 거 같다... 처음에는 무서웠던 vi환경이 내가 아는 한도 내에서는 나름 편안해진 느낌이다. 앞으로 이런 환경에서의 수업이 더 있을 예정이니 좀 더 다양한 시도와 방법을 공부해봐야겠다.

 

 

 

---

 

 

 

 

https://ide.goorm.io/

구름IDE - 설치가 필요없는 통합개발환경 서비스

 

 

 

 

https://github.com/chry8822

chry8822 - Overview

 

 

 

---