[Streamlit] 내가 만든 앱 스마트폰에서 쓰는 법 — Github, Streamlit 웹 배포 실험 (앱 만들기 2편)

이전 이야기

2026.05.26 - [AIffee 한 잔 — 오늘의 AI 활용/써보니까] - [Google AI 스튜디오] 파이썬 없어도 45분 만에 앱 만든 후기 — 비개발자 실전 기록

노션에 결과가 자동으로 척 저장되는 거 보고 혼자 신나서 블로그에 기록을 남겼다. 

 

내 컴퓨터가 꺼지면 그냥 끝이잖아? 

 

노트북 덮고 누웠다가 문득 "어 잠깐, 이거 내 컴퓨터 꺼지면 그냥 끝이잖아?" 라는 생각이 들면서,

이걸 스마트폰에서도 쓰고싶다는 pain point가 생겼다. 

 

쓴 도구는 GitHub랑 Streamlit 두 개이다.

내 삽질 경험담이기도 하고, 그대로 따라 할 수 있는 기록이기도 하다.

이 글 다 읽고 나면 세 개가 남는다.

• 왜 굳이 웹앱으로 올리는지
• GitHub랑 Streamlit이 뭐 하는 애들인지
• 실제로 올리는 순서

터미널에서 돌리던 앱, 왜 답답했을까?

처음엔 앱이 돌아간다는 것만으로 충분히 뿌듯했다. 그런데 정작 평소에 들고 다니는 스마트폰에서는 쓸 수가 없었다.

로컬에서만 돌릴 때 답답했던 점들:

• 내 컴퓨터에서만 앱이 돌아감. 노트북 꺼지면 같이 멈춤.
• 쓸 때마다 터미널 열어서 명령어 치는 것도 은근 귀찮음. 

GitHub랑 Streamlit 의 역할

GitHub는 코드 보관 창고, 

Streamlit은 그 코드를 웹 화면으로 띄워주는 플랫폼. 이라고 생각하면 된다. 

그래서, 이렇게 순서대로 고침

Step 1. 코드를 Streamlit용으로 살짝 손보기

바이브 코딩으로 코드 고쳐달라고 하기

"내가 만든 코드를 github에 올리고 streamlit을 통해서 웹앱으로 사용할거니까 코드를 고쳐줘"

 

 

Step 2. GitHub에 코드 올리기

private 저장소 하나 만들고 코드 파일을 올린다.

이때 requirements.txt(필요한 라이브러리 목록)도 같이 올린다.

https://github.com/

GitHub · Change is constant. GitHub keeps you ahead.

 

 

Step 3. Streamlit Cloud에 연결 → 자동 배포

Streamlit Cloud에서 깃허브 저장소를 연결한다.

https://streamlit.io/#install

Streamlit • A faster way to build and share data apps

 

Step 4. 노션 API 키, 무료 AI 키들은 는 Streamlit app - Secrets에 따로 보관

노션 연결이나 내가 사용한 AI들의 API 키를 코드에 그대로 박아두면 안 된다. 

GitHub을 공개로 돌리기라도 하면 키가 통째로 노출된다.

Streamlit Secrets에 따로 넣고, 코드에서 불러다 쓰는 식으로 하면 된다. 

 

키 찾는 방법 :

AI한테 아래를 물어보고 나오는 링크를 타고 들어가서 찾으면 된다. 

이건 step1에서 바이브코딩으로 코드 고쳐달라고 할 때 이미 AI가 알려줄 내용이기도 하다. 

내 노션 토큰 찾는 방법 알려줘 내 노션 DB ID 찾는 방법 알려줘 이 코드에서 사용한 AI API키 찾는 방법 알려줘

 

내 손 안의 웹앱 탄생

드디어 폰에서 내가 만든 앱을 쓸 수있다!!
각종 유료 앱들을 다 청산하고 내 입맛에 맞는 앱을 가질 수 있으면 너무 좋을 것 같다. 

언젠가 그런 순간이 오겠지? 

 

 

여러분은 어떤 나만의 앱을 만들고 싶나요? 공유해주세요! ㅎㅎ 

Cover Image Generated with AI

Cover Image Generated with AI