Streamlit, Docker, Static Spaces

~24 min · spaces, streamlit, docker

Level 0스카우트

0 XP0/50 lessons0/10 achievements

0/120 XP to next level120 XP to go0% complete

세션 상태가 중심이면 Streamlit이 자연스러워

Gradio는 함수를 UI에 연결하는 방식이고 Streamlit은 상호작용할 때 스크립트를 위에서 아래로 다시 실행하는 방식이야. 여러 페이지와 지속적인 세션 상태가 필요한 대시보드라면 st.session_state를 갖춘 Streamlit이 잘 맞아.

런타임을 직접 정해야 하면 Docker로 가

FastAPI, Vue, 맞춤 Nginx, 특수 Python 환경이나 GPU 구성이 필요하면 manifest에 sdk: docker를 선언해. Space가 Dockerfile을 빌드하고 실행하며, 컨테이너는 root가 아닌 사용자 1000으로 동작하므로 권한과 경로를 그 조건에 맞춰야 해.

실행 코드가 없으면 Static이 가장 단순해

모델 소개, 튜토리얼, 랜딩 페이지는 sdk: static으로 HTML·CSS·JavaScript만 올려. 서버 런타임이 없어 무료이고 빠르며 콜드 스타트도 없어.

Code

HF inference 콜 둘러싼 Streamlit 대시보드·python

import streamlit as st
from huggingface_hub import InferenceClient

st.title("Quick Llama Sandbox")

if "history" not in st.session_state:
    st.session_state.history = []

prompt = st.text_input("Prompt")
if st.button("Send") and prompt:
    client = InferenceClient(model="meta-llama/Llama-3.1-8B-Instruct", provider="hf-inference")
    out = client.chat_completion(messages=[{"role": "user", "content": prompt}], max_tokens=200)
    st.session_state.history.append((prompt, out.choices[0].message.content))

for u, a in st.session_state.history:
    st.markdown(f"**You:** {u}")
    st.markdown(f"**Llama:** {a}")

Docker Space — README front-matter·yaml

---
title: FastAPI Demo
sdk: docker
app_port: 7860
---

Docker Space 용 Dockerfile (FastAPI)·dockerfile

# Dockerfile
FROM python:3.11-slim
RUN useradd -m -u 1000 user
USER user
WORKDIR /home/user/app

COPY --chown=user requirements.txt .
RUN pip install --no-cache-dir -r requirements.txt

COPY --chown=user . .

# Spaces 디폴트 포트 7860 — manifest 의 app_port 로 override.
EXPOSE 7860
CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "7860"]

External links

Exercise

다른 챗 모델 셋 side-by-side 비교 가능한 Streamlit Space 대시보드 빌드. 같은 대시보드를 FastAPI + tiny HTML 페이지의 Docker Space 로 빌드. 비교: deploy 시간, cold-start, 뭔가 깨졌을 때 디버그 ease.

Progress

Progress is local-only — sign in to sync across devices.

← PreviousGradio: 10 줄로 ML 데모 Next →Secrets, 하드웨어 Tier, Persistent Storage

이 페이지에서 버그를 발견하셨거나 피드백이 있으세요?문제 신고

🔔 답글 알림 (로그인 필요)

로그인 — 댓글을 남기려면 로그인해 주세요.

아직 댓글이 없어요. 첫 댓글을 남겨보세요.