글 목차:
1. AWS EC2 인스턴스 생성 및 접속
2. AWS EC2 서버 환경 구성 및 Streamlit 앱 배포
3. AWS EC2 CI/CD 구축
4. AWS EC2 및 Let's Encrypt 활용 Streamlit 앱 https 활성화
5. AWS EC2 활용 Streamlit 앱에 GA4 연결
6. AWS EC2 활용 Streamlit SEO 설정
실습 사전 준비
- '가비아'를 통한 사용할 도메인 구매 (https://www.gabia.com/)
- Github 회원가입 및 streamlit 앱 생성 (https://github.com/)
- Putty 설치 (https://www.putty.org/)
- 구글 애널리틱스 회원가입 (https://analytics.google.com/)
구글 애널리틱스란(GA4)?
웹사이트나 앱에 방문한 사용자들의 행동을 분석할 수 있게 해주는 무료 분석 도구입니다. 이를 통해 마케팅 성관 분석, UX 개선, 전환율 관리, 타겟팅 전략 수립 등으로 활용할 수 있습니다.
구글 애널리틱스 계정 생성
구글 애널리틱스 홈페이지(https://analytics.google.com/)에서 화면 중앙의 '측정 시작'을 클릭합니다.
계정 이름을 작성합니다.
하단의 설정 중 내용을 확인하고 체크한 후 '다음'을 클릭합니다.
'속성 이름'을 작성하고 '보고 시간'과 '통화'를 설정하고 '다음'을 클릭합니다.
'업종 카테고리'를 설정하고 '비즈니스 규모'를 체크하고 '다음'을 클릭합니다.
비즈니스 목표 선택에서 '목표'를 체크하고 '만들기'를 클릭합니다.
'Google 애널리틱스 서비 약관 계약'의 약관을 동의하는 체크를 한 후 '동의함'을 클릭합니다.
'웹', 'Android앱', 'IOS앱' 중 해당하는 플랫폼을 선택합니다.
'웹사이트 URL'과 '스트림 이름'을 작성합니다.
해당 내용에서는 이후의 설정을 고려하여 본래의 도메인 뒤에 'app/'를 추가했습니다.
데이터 수집을 시작할 계정을 생성 완료했습니다.
생성한 계정의 '홈'입니다.
아직 데이터를 받지 못 했고 이후의 과정을 추가로 진행해야 합니다.
화면 중앙의 '태그 지정 도움말 업기'를 클릭합니다.
해당 내용에서 확인해야 할 내용은 '측정 ID' 부분입니다.
'측정 ID'를 복사합니다.
insert_ga.py 파일 생성
이전에 작성한 폴더에서 app.py와 같은 경로에 'insert_ga.py' 파일을 생성합니다.
from bs4 import BeautifulSoup
import shutil
import pathlib
import logging
import streamlit as st
def add_analytics_tag():
analytics_id = "[측정 ID]"
analytics_js = f"""
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id={analytics_id}"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){{dataLayer.push(arguments);}}
gtag('js', new Date());
gtag('config', '{analytics_id}');
</script>
<div id="{analytics_id}"></div>
"""
# 🔹 Streamlit의 `index.html` 파일 경로 찾기
index_path = pathlib.Path(st.__file__).parent / "static" / "index.html"
logging.info(f'Editing {index_path}')
# 🔹 HTML 파일을 수정하기 위해 BeautifulSoup 사용
soup = BeautifulSoup(index_path.read_text(), features="html.parser")
# GA 코드가 이미 삽입되어 있는지 확인 (중복 삽입 방지)
if not soup.find(id=analytics_id):
bck_index = index_path.with_suffix('.bck')
# 🔹 기존 백업이 있으면 복구, 없으면 백업 생성
if bck_index.exists():
shutil.copy(bck_index, index_path) # 백업 복구
else:
shutil.copy(index_path, bck_index) # 백업 저장
# 🔹 <head> 태그 내부에 GA 코드 삽입
html = str(soup)
new_html = html.replace('<head>', '<head>\n' + analytics_js)
index_path.write_text(new_html)
# 🔹 실행 시 GA 코드 삽입
add_analytics_tag()생성한 파일에 위에서 복사한 '측정 ID'를 수정하고 위 코드 내용을 입력합니다.
insert_ga.py 실행 및 Streamlit 앱 배포
'PuTTY'에 접속합니다.
conda activate [가상환경명]이전에 생성한 가상환경에 접속합니다.
'conda' 명령어가 활성화 되어 있지 않다면 아래 코드를 입력합니다.
source /home/ubuntu/anaconda3/etc/profile.d/conda.sh혹은 앞으로도 지속적으로 'conda' 명령어를 활성하고 싶다면 아래 코드를 입력합니다.
echo 'export PATH="$HOME/anaconda3/bin:$PATH"' >> ~/.bashrc
source ~/.bashrc
접속한 가상환경에서 프로젝트 파일로 이동합니다.
cd [프로젝트명]이전 과정에서 'git pull'를 자동으로 처리하는 CI/CD 과정을 완료했다면 프로젝트 폴더안에 'insert_ga.py' 파일이 경로에 있는 것을 확인할 수 있습니다. ('ls' 명령어로 확인 가능)
pkill -f "streamlit run"위 코드로 기존에 배포 중이던 Streamlit 앱을 끕니다.
ps -ef | grep streamlit앱 상태는 위 코드로 확인합니다.
pyhton insert_ga.py이전에 사용한 앱 실행 코드를 입력하기 전에 위 코드를 입력합니다.
nohup streamlit run app.py --server.port 8501 --server.runOnSave true &그 후 Streamlit 앱 실행 코드를 입력합니다.
잠시 기다린 후 구글 애널리틱스에 들어가면 데이터 수집이 활성화되었다는 것을 확인할 수 있습니다.
이상으로 배포한 Streamlit앱을 GA4로 측정하는 방법에 대해 알아봤습니다.
이어질 내용은 맨위 혹은 아래의 글 목차를 확인 부탁드립니다.
글 목차:
1. AWS EC2 인스턴스 생성 및 접속
2. AWS EC2 서버 환경 구성 및 Streamlit 앱 배포
3. AWS EC2 CI/CD 구축
4. AWS EC2 및 Let's Encrypt 활용 Streamlit 앱 https 활성화
5. AWS EC2 활용 Streamlit 앱에 GA4 연결
6. AWS EC2 활용 Streamlit SEO 설정