Front / UI
진행 사항
(팀원의 개인적인 일정 문제로, 이번 회의는 기록할 것이 없다)
- 그래프 & 표 위주로 페이지 구성을 일단 맞춰본다고 한다.
Data Analysis / DBA
진행 사항
Google Analytics
지난번 기록에서도 언급한 것 처럼, ELK는 잠시 접어두고 GA(Google Analytics)를 주로 공부했다고 한다. 추가로, 지난번 회의 때 GA 연동이 웹과 바로 되지 않았었는데, 문제가 있었던 것이 아니라 실시간 연동에 시간이 필요해서 그랬던 것 이라고 한다.
이벤트 별 클릭 or 이용 수를 GA로 추적해보고 있다. 이외에도 다양한 기능들을 설계하고, 만드는 것에 익숙해지고 있다고 한다.
데이터 전처리 & 구현하고픈 이벤트 정리
데이터를 받아오고, 분석하는 프로세스를 코드로 정리하고 있다.
문제가 있다면, 시간이 좀 많이 걸린다는 것이 문제인데 현재 로컬 환경에서 테스트 중이라 DB에서 불러오는 것도 아니고, 구현이 우선이 우선이기도 하니 추후 전처리 시간은 단축할 수 있도록 보완할 것이라고 한다.
다음과 같이 구현하고싶은 태스크들을 정리중이라고 한다.
Infra CI/CD
진행 사항
결론부터 이야기하자면,
- 대상 서버의 permit root login -> yes
- 방화벽(ufw) 활성화 & Ansible Port 허용
- root passwd 설정
리눅스 서버 (본인의 경우 우분투) 설치 이후, 상기 3개만 설정해주면
이후 과정은 Ansible로 제어하도록 구현하였다.
정말 깡통 서버부터 설정하도록 구축하려면 PxE도 해야하나 싶기는 하지만...
일단 여기까지 진행하고 추후 시간적 여유가 있다면 더 건드려보려 한다.
Ansible-playbook (Frontend)
Host 설정 등, 기본적인 권한 & 유저 세팅은 빼고 playbook만 다뤄보려한다.
대략적인 playbook의 흐름은 다음과 같다.
('become: yes' -> 관리자 권한으로 진행하였다.)
최초 설치 -> Operation.yml
1. 프로젝트 경로 생성
1-1. React 프로젝트를 저장할 경로 생성
1-2. Front-end 경로 생성
# 1-3. Back-end 경로 생성
2. git
2-1. git 프로젝트를 clone
2-2. 경로 내에 있는 파일들 Front-end로 이동 & 기존 디렉토리 삭제
3. Docker
3-1. Docker를 설치하는 데 필요한 패키지를 설치
3-2. Docker의 공식 GPG 키를 추가
3-3. Docker의 APT 저장소를 추가
3-4. Docker CE를 설치
3-5. Docker Compose 설치 & 실행 권한 부여
3-6. Docker 서비스를 시작하고 부팅시에 자동으로 시작하도록 설정
4. Dockerfile & config
4-1. Front-end Dockerfile 생성
4-2. Nginx config 생성
# 4-3. Back-end Dockerfile 생성
4-4. docker-compose.yml 생성
5. Docker-compose & port
5-1. docker-compose build
5-2. docker-compose up
5-3. Front-end web Port (80) open
# 5-4. Back-end Springboot Port (8080) open
6. WoL(Wake on LAN)
6-1. 의존 패키지 설치
6-2. NIC WoL 옵션 변경
6-3. /etc/network/interfaces 설정
6-4. wol.service 데몬 등록
6-5. 데몬 start & enable
7. Curl testing (외부)
7-1. get contents
7-2. print contents-
프로젝트 경로 생성
/react 경로를 만들고, front 경로를 만들어준다. (편의를 위해 권한은 777로...)
-
git
git clone 이후, 해당 git 프로젝트가 project라는 디렉토리 안에 있기 때문에,
내용물을 옮기고, 빈 디렉토리를 삭제하는 과정을 거친다.
-
Docker
도커와 도커 컴포즈 설치, 그리고 도커 enable
-
Dockerfile & config
npm build와 nginx 이미지를 가져와서 dockerfile을 구성해준다. /react/front 디렉토리에 생성
컨테이너의 nginx가 사용할 config. 마찬가지로 /react/front 디렉토리에 만들어준다
(Back-end Dockerfile - 준비중)
사용할 dockerfile과, 컨테이너 내/외부 포트를 지정하는 등 docker-compose config 생성. restart:always 옵션을 주어 종료되더라도 바로 재시작되도록 설정해준다.
-
Docker-compose & Port
앞서 만들었던 docker-compose.yml을 이용하여 이미지를 빌드하고, 해당 이미지로 컨테이너를 생성 & up 해준다. 이후 web port인 80포트를 개방.
(Back-end Port - 준비중)
-
WoL (Wake on LAN)
의존 패키지 설치 ->
NIC WoL 옵션 변경 ->
/etc/network/interfaces 설정 ->
wol.service 데몬 등록 ->
데몬 start & enable
- Curl testing (외부)
DNS를 이용하여 미리 설정해두었던 url에 curl testing을 해준다.
curl 결과 상위 10줄만 출력하도록 하여, react-app이 정상적으로 잘 배포되었는지 확인
수정 후 배포 -> Push.yml
1. git
1-1. git checkout
1-2. git 프로젝트를 clone
1-3. 경로 내에 있는 파일들 Front-end로 이동 & 기존 디렉토리 삭제
2. Docker-compose
2-1. docker compose down
2-2. delete docker image
2-3. rebuild docker image
2-4. docker compose up
3. Curl testing (외부)
7-1. get contents
7-2. print contents
Operation playbook과 다른 부분만 언급하겠다.
-
1-1
기존에 clone을 해왔던 정보가 남아있기 때문에, 지워주고 다시 clone을 준비한다.
-
2-1
실행중이던 docker-compose를 down시키고, docker image를 rebuild할 준비를 한다.
Next
Ansible을 짧게나마 사용해보고, docker를 이용하며 위와 같이 구축하며 가장 먼저 들었던 생각은
'아 이래서 무중단 배포를 이야기하는 건가?' 였다.
Ansible을 이용하여 push하는 과정에서 서비스가 잠깐 중단된다.
프로젝트라 그렇지... 만약 실제 서비스라고 한다면, 중간에 1-2분 웹페이지가 접속 불가 상태다? 불편한건 둘째치고 규모가 큰 서비스라면 엄청난 장애라고 볼 수 있다.
무중단 배포... 말만 들어봤고, 개념만 알고 있지 사실 일회성이 많은 프로젝트 수준에서는 크게 필요가 없는 서비스라 크게 구현해 볼 생각은 안 해봤던 것 같다.
그래서 다음 회의때까지는 무중단 배포 체계를 구축해보려 한다. 배포 중에도, 컨테이너를 다시 올리는 중에도 실행될 수 있도록 서비스를 구축해볼 계획.
추가로 현재는 Ansible 실습을 주로 하려다보니... 수정 후 배포도 Ansible을 이용했는데, git actions, Jenkins라던지 다른 방법들도 폭 넓게 사용해 볼 계획이다.
프론트를 담당하는 팀원이 최근 자격증 시험으로 많이 바빠서,
아무래도 웹 제작 속도가 조금 더딘 것 같다.
다음 회의는 5/25(예정)으로 그래프를 그릴 수 있는 & 표를 넣을 수 있는 페이지가 제작된다면,
어떤 GA 이벤트를 삽입하고 추적하면 좋을지 위주로 이야기 할 것 같다.
