Skip to content

Streamlit mit VSCode verwenden: Schritt-für-Schritt-Anleitung (aktualisiert für 2025)

Olaf Källström
Name
Olaf Källström

Updated on

Bereit, deinen Python-Entwicklungs-Workflow zu beschleunigen?
Streamlit + VSCode ist weiterhin eine der schnellsten Möglichkeiten, Data Apps zu bauen – besonders für Engineers, Data Scientists, Analysten und ML-Praktiker.

Diese aktualisierte Anleitung (Edition 2025) zeigt dir:

  • ✔ Wie du Streamlit in VSCode korrekt einrichtest
  • ✔ Wie du virtuelle Umgebungen nutzt (Best Practice)
  • ✔ Wie du Streamlit-Apps direkt in VSCode debuggst
  • ✔ Wie du Apps mit der Stlite-Extension in VSCode voransiehst
  • ✔ Wie du Streamlit-Apps mit modernen Hosting-Optionen 2025 deployen kannst
  • ✔ Und wie du deinen Workflow mit PyGWalker für No-Code-Visualisierung erweiterst

Los geht’s.

Grundkonzepte: Streamlit + VSCode

Was ist Streamlit?

Streamlit ist ein Open-Source-Python-Framework zum Erstellen interaktiver Web-Apps – ohne HTML, CSS oder JavaScript.
Es verwandelt Python-Skripte in Minuten in teilbare Data Apps.

Wichtige Vorteile:

  • Kein Frontend-Wissen erforderlich
  • Echtzeit-Hot-Reload
  • Einfache Widgets (Slider, Selects, Datei-Upload, Charts)
  • Ideal für Datenexploration, Dashboards, ML-Demos

Seit 2025 ist Streamlit für viele Data-Science-Teams das Standard-Tool und ersetzt ad-hoc-Dashboards, Jupyter-Widgets und interne BI-Prototypen.

Warum Streamlit in VSCode nutzen?

VSCode verbessert das Streamlit-Erlebnis deutlich:

1. 🔥 Schnelle Entwicklung

Code schreiben → speichern → App aktualisiert sich sofort automatisch.

2. 🧩 Reiches Ökosystem

Python-Extension, Git-Integration, Copilot/Cursor-ähnliche KI-Tools, Formatierung, Linting und mehr.

3. 🐞 Debugging der ersten Klasse

VSCode ermöglicht Breakpoints, Variableninspektion und Step-by-Step-Debugging deiner Streamlit-Logik.

4. 🚀 Nahtlos mit moderner Tooling-Landschaft

Funktioniert mit virtuellen Umgebungen, Conda, uv, Docker, Remote-SSH, Dev-Containern usw.

Wichtige Einschränkungen

Streamlit ist mächtig, aber:

  • Nicht geeignet für sehr aufwendige Custom-Frontends oder komplexe Multi-Page-Apps
  • Das stateless-Design macht komplexes State-Management anspruchsvoller
  • Weniger flexible UI als vollwertige Webframeworks (FastAPI + React, Django usw.)

Für 90 % interner Dashboards und ML-Tools ist es jedoch ideal.

Streamlit in VSCode nutzen (2025 Schritt für Schritt)

Im Folgenden der moderne, empfohlene Workflow.

Schritt 1 – Virtuelle Umgebung erstellen (Best Practice)

Anstatt Streamlit global zu installieren, mach Folgendes:

python3 -m venv .venv
source .venv/bin/activate      # macOS / Linux
.venv\Scripts\activate         # Windows

Oder mit uv (super schnell):

uv venv
source .venv/bin/activate

Schritt 2 – Streamlit installieren

pip install streamlit

Schritt 3 – Eine Python-Datei in VSCode erstellen

Erstelle eine Datei namens example.py:

import streamlit as st
 
st.title("My First Streamlit App")
st.write("Hello, VSCode + Streamlit!")

Schritt 4 – Streamlit aus dem VSCode-Terminal starten

Terminal öffnen:

  • Windows / Linux: Ctrl + Shift + `
  • macOS: Cmd + J

Dann ausführen:

streamlit run example.py

Dein Browser öffnet sich automatisch unter:

http://localhost:8501 (opens in a new tab)

Bonus: Streamlit-Apps in VSCode debuggen

Füge eine .vscode/launch.json hinzu:

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Debug Streamlit App",
      "type": "python",
      "request": "launch",
      "module": "streamlit",
      "args": ["run", "example.py"],
      "console": "integratedTerminal"
    }
  ]
}

Jetzt kannst du mit Breakpoints, Stepping und Variablen-Panel debuggen.

Eine Streamlit-Visualisierungs-App mit PyGWalker erstellen (aktualisiert)

PyGWalker (opens in a new tab) fügt Streamlit mit fast keinem Code eine Tableau-ähnliche UI hinzu.

Perfekt für:

  • Datenexploration
  • Dashboard-Prototypen
  • Teilen von Analyseergebnissen

Minimales Beispiel:

import streamlit as st
import pygwalker as pyg
import pandas as pd
 
df = pd.read_csv("your-data.csv")
pyg.walk(df, env="streamlit")

Live-Demo → https://pygwalkerapp-d0iztqkzcmr.streamlit.app/ (opens in a new tab)

Video-Tutorial von Sven (CodingIsFun):

VSCode-Extension: Stlite (aktualisierte Infos)

Die Stlite-Extension bietet:

  • Syntax-Highlighting
  • Snippets für gängige Streamlit-Funktionen
  • Integriertes Vorschau-Panel in VSCode
  • Kein Browser nötig für schnelle Tests

So nutzt du sie:

  1. Command Palette öffnen → Launch stlite preview
  2. Eine .py-Datei auswählen
  3. Vorschau erscheint im VSCode-Editor-Panel

Einschränkungen

  • Nutzt eine WebAssembly-Version von Streamlit
  • Manche Komponenten verhalten sich anders als mit dem vollständigen Python-Backend
  • Benötigt Netzwerkzugriff für WASM-Ressourcen (Offline-Modus eingeschränkt)

Trotzdem großartig für schnelles Prototyping.

Deployment: Wie du Streamlit deployen kannst

Das alte „Streamlit Sharing“ gibt es nicht mehr.

Moderne Deployment-Optionen:

✅ Streamlit Community Cloud (für Einsteiger empfohlen)

Kostenlos, schnell, einfach.

✅ Railway.app

One-Click-Deploy mit automatischen Builds.

✅ Render.com

Free Tier + Autoscaling.

✅ HuggingFace Spaces

Ideal für ML-Demos.

✅ AWS / GCP / Azure

Für produktiven Einsatz – mit Docker + Load Balancing.

Tutorial:
➡ /topics/Streamlit/deploy-streamlit-app

Häufig gestellte Fragen

1. Wie stoppe ich Streamlit in VSCode?
Drücke im VSCode-Terminal den Stop-Button oder Ctrl+C.

2. Wie öffne ich die App?
Rufe auf: http://localhost:8501

3. Kann ich Streamlit in Google Colab nutzen?
Ja – installiere Streamlit und nutze pyngrok zum Tunneln.

4. Warum sollte ich virtuelle Umgebungen nutzen?
Sie kapseln deine Abhängigkeiten und vermeiden Versionskonflikte.

5. Was sind typische Einschränkungen von Streamlit?
Begrenzte UI-Anpassung, stateless-Design, nicht ideal für große Frontend-Anwendungen.

6. Wofür wird Streamlit verwendet?
ML-Demos, Dashboards, interne Tools, Datenexploration, schnelle interaktive Apps.

Fazit

Streamlit + VSCode ist 2025 eine der schnellsten Möglichkeiten, Data Applications zu entwickeln.
Egal ob du Daten explorierst, Dashboards baust oder interne Tools deployest – dieser Workflow bietet dir:

  • schnelle Iteration
  • saubere Entwicklung
  • leistungsstarkes Debugging
  • moderne Deployment-Optionen

Kombiniert mit PyGWalker, Stlite und dem sich weiterentwickelnden KI-Ökosystem von VSCode erhältst du eine vollständige Entwicklungsumgebung für Data Products.