[Streamlit]Python 결과를 콘솔 대신 웹으로?

📘 VS Code에서 Python 개발 시 콘솔이 아닌 웹 페이지 형식으로 결과 확인하기

많은 사람들이 VS Code에서 Python을 개발할 때 결과를 콘솔에 출력하는 경우가 많습니다. 하지만 여러분의 코드 결과를 보다 직관적이고 시각적으로 확인할 수 있는 방법이 있습니다. 바로 Streamlit을 사용하는 것입니다.

이 글에서는 VS Code + Streamlit을 활용하여 콘솔이 아닌 웹 페이지 형식으로 Python 코딩 결과를 확인하는 방법을 단계별로 설명하겠습니다.
다음과 같은 개발 환경을 만들어 보겠습니다.

VS Code와 WebPage 개발 환경

 

로직 개발할 때 작은 단위인 특정 함수하나에 다양한 값들을 입력으로 줘서 테스트 해야하는 경우가 많은데 콘솔 사용보다 편리하도는 생각을 많이 합니다.

---

🧐 Streamlit이라고?

VS Code에서 Python을 사용할 경우 보통 콘솔에 출력된 텍스트 기반 결과를 확인하게 됩니다. 그러나 다음과 같은 이유로 Streamlit이 더 강력합니다:

✅ 직관적인 UI: 결과를 웹 페이지 형태로 시각화해 한눈에 이해할 수 있음
✅ 간편한 설치와 사용: HTML/CSS/JavaScript 없이 Python만으로 웹 페이지 생성
✅ 빠른 프로토타입 개발: 데이터 분석, AI 모델 배포, 시뮬레이션 결과 등을 빠르게 시각화 가능
✅ 대화형 인터페이스 제공: 슬라이더, 버튼 등 다양한 입력 기능 제공

---

🔧 1. Streamlit 설치

Streamlit은 pip로 간편하게 설치할 수 있습니다.

pip install streamlit

설치가 완료되면 다음 명령어로 Streamlit 버전을 확인하세요:

streamlit --version

---

🖥️ 2. VS Code 설정

✅ VS Code 확장 프로그램 설치 (선택 사항)

Streamlit Runner 확장팩을 설치하면 VS Code에서 버튼 클릭으로 Streamlit 앱을 바로 실행할 수 있어 편리합니다.

1. VS Code 좌측의 확장 프로그램 아이콘 (📦) 클릭
2. 검색창에 "Streamlit Runner" 입력 후 설치

Streamlit Runner는 선택 사항이며, 없어도 터미널에서 명령어로 실행이 가능합니다.

---

🧑‍💻 3. Streamlit 예제 코드 작성

이제 간단한 Python 코드를 작성해 결과를 웹 페이지에서 확인해보겠습니다.

📂 test.py (예제 파일)

import streamlit as st

# 제목 추가
st.title("BMI 계산기")

# 사용자 입력 받기
height = st.number_input("키 (cm)", min_value=100, max_value=250, value=170)
weight = st.number_input("몸무게 (kg)", min_value=30, max_value=200, value=70)

# BMI 계산 함수
def calculate_bmi(weight, height):
    height_m = height / 100
    return round(weight / (height_m ** 2), 2)

# 결과 표시
if st.button("BMI 계산하기"):
    bmi = calculate_bmi(weight, height)
    st.write(f"당신의 BMI는 **{bmi}** 입니다.")

    if bmi < 18.5:
        st.warning("저체중입니다. 균형 잡힌 식사가 필요합니다.")
    elif 18.5 <= bmi < 24.9:
        st.success("정상 체중입니다. 건강을 유지하세요!")
    elif 25 <= bmi < 29.9:
        st.warning("과체중입니다. 운동과 식단 조절을 추천드립니다.")
    else:
        st.error("비만입니다. 건강 관리가 필요합니다.")

---

🚀 4. Streamlit 앱 실행하기

Streamlit 앱을 실행하려면 터미널에서 다음 명령어를 입력하세요:

streamlit run app.py

✅ 명령어 실행 후 브라우저가 자동으로 열리며 다음 주소에서 웹 앱을 확인할 수 있습니다. 실행 도중 Email: 입력 부분은 그냥 엔터로 진행해도 됩니다. 
👉 http://localhost:8501

Tip: VS Code의 Streamlit Runner를 설치한 경우 오른쪽 상단의 "Run Streamlit App" 버튼을 클릭하면 바로 실행됩니다.

 

✅ 콘솔이 아닌 Web 환경으로 실행 결과를 볼 수 있습니다. 

✅ Streamlit 에서 제공하는 추가 기능으로 입출력 등을 시각화가 뛰어나고 사용이 용이하도록 만들어 주고 있습니다.   

✅ 입력 값을 콘솔에서 번거롭게 입력하지 않고 - + 버튼만으로 가능하게 됩니다. 

---

🎯 5. 추가 기능 - Streamlit의 강력한 기능

Streamlit은 다양한 기능을 제공합니다. 아래는 자주 사용하는 기능입니다:

✅ st.text_input() → 문자열 입력
✅ st.number_input() → 숫자 입력
✅ st.button() → 버튼 생성
✅ st.file_uploader() → 파일 업로드
✅ st.write() → 다양한 형식의 데이터 출력 (텍스트, 데이터프레임, JSON 등)
✅ st.pyplot() → Matplotlib 차트 출력
✅ st.map() → 지도 데이터 시각화

---

🏁 6. 마무리

VS Code에서 Python 개발 시 콘솔이 아닌 웹 페이지 형식으로 결과를 확인하는 방법을 정리 해 봤습니다. 

👉 간단한 테스트나 데이터 시각화는 Streamlit이 가장 빠르고 효율적입니다.
👉 복잡한 웹 애플리케이션을 원한다면 Flask/FastAPI + Frontend 조합이 더 적합합니다.

 

이 글을 통해 많은 사람들이 Python 개발 결과를 웹 형식으로 시각화하며 더욱 직관적으로 개발을 진행할 수 있기를 바랍니다. 😊