[7주차] 클라우드 웹 앱 개발

단순히 로컬에서만 실행되는 프로그램을 만드는 데서 끝나는 것이 아니라, 데이터베이스와 연동되는 Todo 웹 앱을 만들고 이를 실제 Azure Web App에 배포하는 과정까지 직접 진행해 보았다. 

 

📍환경설정 

이번 실습에서 가장 먼저 한 작업은 파이썬 가상환경 을 만드는 것이었다. 가상환경은 프로젝트마다 독립적인 파이썬 실행 환경을 제공하는 도구로, 서로 다른 프로젝트가 서로 다른 패키지 버전을 사용하더라도 충돌하지 않도록 도와준다. 

아래는 가상환경 생성 명령어와 실행 화면이다.

python -m venv .venv.\.venv\Scripts\Activate.ps1

 

가상환경을 만든 뒤에는 Streamlit을 설치한다.

 

 

이번 실습에서 주목할 점은 Azure App Service Extension 이다. 이 확장을 사용하면 VS Code 안에서 Azure 계정에 로그인하고, 웹 앱을 선택하고, 배포를 진행하는 작업을 훨씬 직관적으로 수행할 수 있다. 개인적으로는 이 부분이 꽤 인상적이었다. 보통 클라우드 배포라고 하면 웹 포털에 직접 들어가서 이것저것 설정해야 할 것 같지만, VS Code 익스텐션을 사용하면 개발하던 환경 안에서 배포까지 자연스럽게 이어진다.

 

 

 

📍 MySQL과 Streamlit을 이용한 Todo 앱

MySQL 데이터베이스와 연동되는 Todo 앱을 제작해보았다. 사용자는 웹 화면에서 할 일을 추가하거나 조회하고, 완료 처리나 수정 같은 작업을 수행한다. 이 요청은 Streamlit으로 만든 웹 앱이 받아서 MySQL Connector를 통해 데이터베이스에 반영한다.

 

먼저, MySQL Workbench에서 todo_app 스키마 안에 todos 테이블을 생성했다. 테이블은 각 할 일의 식별자, 내용, 생성 시각, 완료 여부를 저장하도록 구성했다. 생성한 테이블은 아래와 같다.

 

이 테이블 구조는 Todo 앱에 필요한 최소한의 요소를 잘 담고 있다.
id는 각 할 일을 구분하기 위한 기본키이고,
task는 실제 할 일 내용이며,
created_at은 생성 시간을 자동 기록하고,
completed는 해당 할 일이 완료되었는지 여부를 저장한다.

단순해 보이지만, 이 정도만 있어도 할 일 추가, 목록 조회, 완료 상태 반영 같은 핵심 기능을 구현할 수 있다. 데이터베이스 설계를 너무 복잡하게 시작하기보다 필요한 기능에 맞춰 단순하고 명확하게 만드는 것이 중요하다는 점도 함께 느낄 수 있었다.

 

 

📍 Azure Web App으로 배포하기

로컬에서 앱을 만들었다면 다음 단계는 배포다. VS Code의 Azure App Service 기능을 이용해 프로젝트를 Azure Web App에 배포했다. 배포가 성공하면 이제 이 앱은 내 컴퓨터 안에서만 동작하는 프로그램이 아니라, 외부에서 접속 가능한 웹 서비스가 된다.

 

 

배포 과정에서 특히 중요했던 부분은 앱이 Azure에서 어떤 방식으로 시작될지 설정하는 것이었다. Azure 포털의 스택 설정에서 Python 버전을 3.11로 지정하고, 시작 명령에 다음과 같이 Streamlit 실행 스크립트를 연결했다.

 

 

이 설정을 통해 Azure는 앱 시작 시 streamlit.sh를 실행하고, 그 스크립트를 통해 Streamlit 앱을 구동하게 된다. 로컬에서는 그냥 streamlit run app.py 정도로 끝날 수 있지만, 클라우드 환경에서는 어디에 있는 어떤 파일을 어떤 방식으로 실행할지 명시적으로 알려줘야 한다는 점을 확인할 수 있었다.

 

또한 배포 화면을 보면 .deployment 파일에 아래와 같은 설정도 들어가 있다.

[config]
SCM_DO_BUILD_DURING_DEPLOYMENT=false

이 설정은 배포 과정에서 빌드 동작을 조정하는 데 사용되며, 배포 환경에 따라 실행 방식을 세밀하게 제어하는 데 도움이 된다. 

 

 

 

📍 개인 토이프로젝트 확장

가상환경을 만들고, 필요한 패키지를 설치하고, MySQL과 연동한 뒤, Azure Web App에 배포하는 과정을 직접 해 보니 로컬에서 코드를 실행하는 것과 외부에서 접속 가능한 서비스로 운영하는 것은 분명히 다른 문제라는 것을 체감할 수 있었다. 특히 작은 규모의 앱이라도 데이터베이스 연결, 시작 명령 설정, 실행 환경 분리 같은 요소가 안정적인 서비스 운영에 매우 중요하다는 점이 인상적이었다.

 

이런 경험은 내가 진행 중인 News Radar Agent 프로젝트를 더 확장하는 방향을 떠올리게 했다. 이 프로젝트는 현재 키워드 기반 뉴스 자동 수집, AI 중요도 평가, RAG 기반 대화형 Q&A, 트렌드 리포트 생성 기능을 갖춘 뉴스 큐레이션 플랫폼인데, 백엔드는 Spring Boot, 프론트엔드는 Next.js, 운영 환경은 PostgreSQL·Docker Compose·GitHub Actions·EC2·Vercel 중심으로 구성되어 있다.

https://github.com/jubin0615/news-radar-agent

GitHub - jubin0615/news-radar-agent: 키워드 기반 뉴스 자동 수집, AI 중요도 평가, RAG 대화형 분석을 제공

 

이번 실습을 활용한다면, 내 프로젝트도 단순히 기능을 더 추가하는 수준을 넘어서 운영 관점에서 더 완성도 있게 확장해 볼 수 있을 것 같다. 예를 들어 지금은 뉴스 분석과 채팅 기능 중심으로 구성되어 있지만, 이번에 실습한 방식처럼 데이터 저장과 웹 인터페이스를 조금 더 가볍게 묶어 별도의 관리자용 페이지나 실험용 대시보드를 빠르게 만들어 볼 수 있다. 이를 통해 수집된 뉴스 개수, 키워드별 크롤링 상태, AI 평가 점수 분포, 모닝 브리핑 생성 결과 같은 운영 데이터를 한눈에 확인하는 보조 웹 앱을 구성해 볼 수 있을 것이다. 또 Azure Web App 배포 경험을 바탕으로, 기존 메인 서비스와 별개로 이런 보조 도구나 내부 테스트용 서비스를 클라우드에 따로 배포해 관리하는 방향도 생각해 볼 수 있다.