Streamlit : Transforme ton script Python en application web interactive (de zéro à héros)

Tu as un script Python qui fait des trucs géniaux — une analyse de données, un dashboard, un chatbot — mais personne ne peut l'utiliser à part toi parce qu'il faut ouvrir un terminal et lancer `python3 mon_script.py`. Streamlit résout exactement ce problème : en 15 minutes, tu transformes ton script en une vraie application web avec des boutons, des sliders, des graphiques, le tout sans écrire une seule ligne de HTML, CSS ou JavaScript.

Dans ce tutoriel, on va construire ensemble une application complète de A à Z : un générateur de citations inspirantes propulsé par IA locale. Tu vas apprendre à installer Streamlit, créer une interface interactive, ajouter des widgets, afficher des graphiques, et même intégrer un modèle d'IA via Ollama. À la fin, tu auras une app que tu pourras partager avec n'importe qui.

1. C'est quoi Streamlit, concrètement ?

Imagine que tu as ce script Python tout simple :

python

import random

citations = [
    "Le seul moyen de faire du bon travail est d'aimer ce que tu fais. – Steve Jobs",
    "La simplicité est la sophistication suprême. – Léonard de Vinci",
    "Code toujours comme si le gars qui va maintenir ton code était un psychopathe qui sait où tu habites. – John Woods",
]

print(random.choice(citations))

Ce script fonctionne, mais pour l'utiliser il faut ouvrir un terminal, taper la commande, et lire le résultat dans la console. Pas très sexy.

Streamlit te permet de transformer ce script en une page web interactive en ajoutant simplement quelques lignes. Au lieu de print(), tu utilises st.write(). Au lieu de input(), tu utilises st.text_input(). Et tout le reste — le HTML, le CSS, le JavaScript, le serveur web — est géré automatiquement.

💡 Idée d'illustration : Un schéma en deux colonnes — à gauche "Script Python classique" avec un terminal noir, à droite "Même script avec Streamlit" montrant une belle page web avec des boutons colorés.

2. Installation : prépare ton environnement

On part de zéro. Ouvre un terminal et suis ces étapes :

Étape 1 : Créer un dossier de projet

bash

mkdir mon-app-streamlit
cd mon-app-streamlit

Étape 2 : Créer un environnement virtuel

Un environnement virtuel isole les dépendances de ton projet. C'est une bonne pratique qui t'évitera des conflits avec d'autres projets Python.

bash

python3 -m venv venv
source venv/bin/activate  # Sur Linux/Mac
# Sur Windows : venv\Scripts\activate

Quand l'environnement est activé, tu vois (venv) apparaître au début de ton prompt. C'est bon signe !

Étape 3 : Installer Streamlit

bash

pip install streamlit

Environ 30 secondes plus tard, Streamlit est installé. Vérifie que tout fonctionne :

bash

streamlit hello

Une page de démonstration s'ouvre dans ton navigateur. Tu peux la fermer (Ctrl+C dans le terminal) — on va créer la nôtre, bien plus intéressante.

Ce que tu dois voir : Un onglet de navigateur qui s'ouvre automatiquement avec une app Streamlit de démo contenant des graphiques, des cartes, et des dataframes.

3. Premier pas : ta première app Streamlit

Crée un fichier app.py avec ce contenu :

python

import streamlit as st

# Titre de la page
st.title("🌟 Mon Générateur de Citations")

# Un petit texte d'introduction
st.markdown("Bienvenue ! Cette app génère des citations inspirantes pour booster ta journée.")

# Un bouton
if st.button("🎲 Générer une citation"):
    st.success("✨ La créativité, c'est l'intelligence qui s'amuse. – Albert Einstein")
else:
    st.info("Clique sur le bouton pour recevoir ta citation du jour !")

Lance l'application :

bash

streamlit run app.py

Ton navigateur s'ouvre automatiquement sur http://localhost:8501. Tu vois un titre, un texte, et un bouton. Clique dessus : une citation apparaît !

Ce qui vient de se passer : Streamlit a transformé tes appels Python en éléments HTML. st.title() → balise <h1>, st.button() → un vrai bouton cliquable, st.success() → une boîte verte. Tu n'as écrit QUE du Python.

💡 Le secret de Streamlit : à chaque interaction (clic, saisie, slider), Streamlit ré-exécute tout ton script de haut en bas. C'est ce qu'on appelle le "modèle réactif". Pas besoin de callbacks, de gestion d'état complexe — ton script se comporte comme s'il tournait pour la première fois à chaque fois. C'est déroutant au début, mais incroyablement puissant une fois qu'on a pigé le truc.

4. Ajoute de la vraie interactivité : widgets et état

Maintenant, rendons l'app vraiment interactive. Remplace le contenu de app.py par :

python

import streamlit as st
import random

# Configuration de la page
st.set_page_config(
    page_title="Générateur de Citations",
    page_icon="🌟",
    layout="centered"
)

st.title("🌟 Générateur de Citations Inspirantes")
st.markdown("---")

# Sidebar : les contrôles à gauche
with st.sidebar:
    st.header("⚙️ Réglages")
    theme = st.selectbox(
        "Choisis un thème",
        ["Sagesse", "Tech", "Motivation", "Humour", "Philosophie"]
    )
    nombre = st.slider("Nombre de citations", 1, 5, 1)
    st.markdown("---")
    st.caption("Propulsé par Streamlit ❤️")

# Base de données de citations (dans la vraie vie, ça viendrait d'une BDD ou d'une API)
citations = {
    "Sagesse": [
        "La connaissance parle, la sagesse écoute. – Jimi Hendrix",
        "Le vrai voyage de découverte ne consiste pas à chercher de nouveaux paysages, mais à avoir de nouveaux yeux. – Marcel Proust",
        "La simplicité est la sophistication suprême. – Léonard de Vinci",
    ],
    "Tech": [
        "Tout le monde devrait apprendre à programmer, car ça apprend à penser. – Steve Jobs",
        "La meilleure façon de prédire l'avenir est de l'inventer. – Alan Kay",
        "Code is poetry. – Les développeurs WordPress",
    ],
    "Motivation": [
        "Le succès, c'est tomber sept fois, se relever huit. – Proverbe japonais",
        "Fais de ta vie un rêve, et d'un rêve, une réalité. – Antoine de Saint-Exupéry",
        "Il n'est jamais trop tard pour devenir ce que tu aurais pu être. – George Eliot",
    ],
    "Humour": [
        "Je ne suis pas paresseux, je suis en mode économie d'énergie. – Anonyme",
        "Le café : parce que sans lui, je ne suis qu'un humain désagréable. – Anonyme",
        "Debugging : être le détective dans un film où tu es aussi le meurtrier. – Un développeur",
    ],
    "Philosophie": [
        "Je pense donc je suis. – Descartes",
        "L'homme est condamné à être libre. – Jean-Paul Sartre",
        "Ce qui ne me tue pas me rend plus fort. – Nietzsche",
    ],
}

# Zone principale
col1, col2 = st.columns([3, 1])

with col1:
    st.subheader(f"📚 Thème : {theme}")

with col2:
    generer = st.button("🎲 Générer", type="primary", use_container_width=True)

if generer:
    st.markdown("---")
    citations_choisies = random.sample(citations[theme], min(nombre, len(citations[theme])))

    for i, citation in enumerate(citations_choisies, 1):
        with st.container():
            st.markdown(f"### 💬 Citation {i}")
            st.success(citation)

    st.balloons()  # 🎈 Des ballons parce que c'est fun
else:
    st.markdown("---")
    st.info("👈 Sélectionne un thème dans la barre latérale, puis clique sur **Générer** !")

Copie-colle ce code et relance avec streamlit run app.py.

Ce que tu dois voir maintenant : - Une barre latérale (sidebar) à gauche avec un menu déroulant pour choisir le thème - Un slider pour choisir combien de citations générer - Un bouton bleu "🎲 Générer" - Quand tu cliques, les citations apparaissent avec des ballons qui volent !

5. Cas avancé : connecter un vrai modèle d'IA avec Ollama

Jusqu'ici, nos citations sont en dur dans le code. Rendons ça vraiment intelligent en connectant un LLM local via Ollama. Si tu n'as pas encore Ollama, c'est le moment de l'installer.

Installation d'Ollama (2 minutes)

bash

# Sur Linux/Mac
curl -fsSL https://ollama.com/install.sh | sh

# Sur Windows : télécharge depuis https://ollama.com/download

# Télécharge un modèle léger (parfait pour démarrer)
ollama pull llama3.2:3b

Une fois Ollama prêt, installe le package Python pour interagir avec :

bash

pip install ollama

Version finale de l'app avec IA

Remplace app.py par cette version ultime :

python

import streamlit as st
import ollama
from datetime import datetime

# Configuration
st.set_page_config(
    page_title="Générateur IA de Citations",
    page_icon="🤖",
    layout="centered"
)

# --- Sidebar ---
with st.sidebar:
    st.header("⚙️ Configuration")
    theme = st.selectbox(
        "Thème de la citation",
        ["Sagesse", "Tech & IA", "Motivation", "Humour", "Philosophie", "Entrepreneuriat", "Créativité"]
    )
    style = st.radio(
        "Style",
        ["🌟 Inspirant", "😂 Drôle", "🧠 Profond", "💼 Professionnel"],
        horizontal=True
    )
    st.markdown("---")

    # Modèle Ollama
    modele = st.selectbox(
        "Modèle IA",
        ["llama3.2:3b", "llama3.2:1b", "mistral:7b", "gemma2:2b"],
        help="Modèles plus gros = meilleures citations, mais plus lents"
    )
    st.markdown("---")
    st.caption(f"🕐 Session du {datetime.now().strftime('%d/%m/%Y à %H:%M')}")

# --- Zone principale ---
st.title("🤖 Générateur IA de Citations")
st.markdown("### Des citations uniques, générées par intelligence artificielle locale")

# Historique des citations (stocké dans la session)
if "historique" not in st.session_state:
    st.session_state.historique = []

# Barre de progression
col_a, col_b = st.columns([3, 1])

with col_a:
    generer = st.button("✨ Génère-moi une citation !", type="primary", use_container_width=True)

with col_b:
    if st.button("🗑️ Effacer", use_container_width=True):
        st.session_state.historique = []
        st.rerun()

# Génération
if generer:
    with st.spinner("🤔 L'IA réfléchit à une citation unique..."):
        prompt = f"""Tu es un créateur de citations. Génère UNE seule citation originale en français sur le thème "{theme}".

Style demandé : {style}

Format : Écris UNIQUEMENT la citation entre guillemets, suivie du nom de l'auteur précédé d'un tiret.

Exemple : "La connaissance parle, la sagesse écoute." – Jimi Hendrix

IMPORTANT : La citation doit être ORIGINALE (pas une citation connue) et en français.
"""

        try:
            reponse = ollama.chat(
                model=modele,
                messages=[{"role": "user", "content": prompt}]
            )

            citation_generee = reponse["message"]["content"].strip()

            # Ajouter à l'historique
            st.session_state.historique.append({
                "citation": citation_generee,
                "theme": theme,
                "style": style,
                "modele": modele,
                "timestamp": datetime.now().strftime("%H:%M")
            })

        except Exception as e:
            st.error(f"❌ Erreur avec Ollama : {e}")
            st.info("💡 Vérifie que le serveur Ollama tourne : lance `ollama serve` dans un autre terminal.")

# Affichage des résultats
st.markdown("---")

# Compteur
nb_citations = len(st.session_state.historique)
if nb_citations > 0:
    st.subheader(f"📜 Tes citations ({nb_citations} générée{'s' if nb_citations > 1 else ''})")

    # Afficher la plus récente en premier
    for item in reversed(st.session_state.historique):
        with st.container():
            col1, col2 = st.columns([5, 1])
            with col1:
                st.success(item["citation"])
            with col2:
                st.caption(f"🕐 {item['timestamp']}")
                st.caption(f"🏷️ {item['theme']}")
else:
    st.info("👋 Prêt à recevoir ta première citation ? Choisis un thème et clique sur **Générer** !")

# Pied de page
st.markdown("---")
st.caption("💡 Astuce : essaie différents modèles et styles pour varier le ton des citations. Tout tourne en local sur ta machine, aucune donnée ne sort !")

Lancement complet

Avant de lancer l'app, assure-toi qu'Ollama tourne :

bash

# Dans un premier terminal
ollama serve

# Dans un deuxième terminal (avec l'environnement virtuel activé)
cd mon-app-streamlit
source venv/bin/activate
streamlit run app.py

Ce que tu obtiens : Une app qui communique avec un vrai LLM local pour générer des citations 100% originales. Tout tourne sur ta machine — pas d'API payante, pas de limite de requêtes, pas de données qui partent dans le cloud.

💡 Idée d'illustration : Un screenshot montrant l'interface complète — sidebar à gauche avec les contrôles, citation générée au centre avec une jolie boîte verte, et l'historique en dessous.

6. Ajouter un graphique (parce que les graphs, c'est la vie)

Streamlit brille vraiment quand tu combines widgets et visualisations. Ajoutons un petit graphique qui montre la répartition des thèmes générés :

Ajoute ce bloc juste avant le pied de page dans app.py :

python

# Graphique de répartition
if len(st.session_state.historique) >= 2:
    st.markdown("---")
    st.subheader("📊 Répartition des thèmes")

    import pandas as pd
    df = pd.DataFrame(st.session_state.historique)
    theme_counts = df["theme"].value_counts()

    st.bar_chart(theme_counts, use_container_width=True)

Installe pandas si ce n'est pas déjà fait :

bash

pip install pandas

Hop, un graphique à barres interactif apparaît automatiquement. Tu peux zoomer, survoler les barres — tout est géré par Streamlit.

7. Déploie ton app en ligne (pour que le monde entier puisse l'utiliser)

Ton app tourne sur localhost, donc seul toi peux la voir. Pour la partager :

Option 1 : Streamlit Community Cloud (gratuit, recommandé)

Crée un dépôt GitHub avec ton app.py et un requirements.txt :

bash

# Crée requirements.txt
pip freeze > requirements.txt

Va sur https://share.streamlit.io
Connecte ton compte GitHub
Sélectionne ton dépôt et le fichier app.py
Clique sur Deploy

En 2 minutes, ton app est en ligne avec une URL publique du type https://ton-pseudo-mon-app-streamlit.streamlit.app.

Option 2 : Hugging Face Spaces (gratuit aussi)

Alternative si tu préfères l'écosystème Hugging Face. Crée un Space avec le SDK Streamlit, pousse ton code, et c'est en ligne.

8. Pièges classiques (et comment les éviter)

Piège 1 : La ré-exécution systématique

Problème : Tu mets un print() dans ton script et il s'affiche 10 fois. Explication : Streamlit ré-exécute tout le script à chaque interaction. Solution : Utilise st.session_state pour les données persistantes, et le décorateur @st.cache_data pour les calculs lourds.

Piège 2 : `st.cache_data` oublié

Problème : Tu charges un gros modèle ou une BDD à chaque clic, l'app rame. Solution :

python

@st.cache_data
def charger_donnees():
    # Cette fonction n'est exécutée qu'une seule fois
    import pandas as pd
    return pd.read_csv("gros_fichier.csv")

Piège 3 : Ollama ne répond pas

Problème : ConnectionError quand Streamlit essaie d'appeler Ollama. Solution : Vérifie que ollama serve tourne dans un terminal séparé. Teste avec curl http://localhost:11434/api/tags.

Piège 4 : Le fichier requirements.txt qui explose

Problème : pip freeze exporte toutes les dépendances système, pas seulement celles du projet. Solution : Utilise pip install pipreqs && pipreqs . pour générer un requirements.txt propre avec uniquement les imports utilisés.

9. Pour aller plus loin

Streamlit + LangChain : Crée un chatbot conversationnel avec mémoire, capable de se souvenir des messages précédents de l'utilisateur. Streamlit a un composant st.chat_input() parfait pour ça.
Streamlit + base de données : Ajoute SQLite pour stocker les citations préférées des utilisateurs entre les sessions. Utilise st.session_state pour la session courante et SQLite pour la persistance.
Streamlit multi-pages : Organise ton app en plusieurs pages (Dashboard, Citations, Statistiques) en créant un dossier pages/ avec des fichiers .py — Streamlit les transforme automatiquement en onglets de navigation.

Récapitulatif : ce que tu as appris

Étape	Ce que tu maîtrises
Installation	Environnement virtuel, pip, streamlit
Première app	`st.title()`, `st.button()`, `st.success()`
Widgets	`st.selectbox()`, `st.slider()`, `st.radio()`
Sidebar	`st.sidebar` pour les contrôles
État	`st.session_state` pour persister les données
IA	Intégration Ollama pour génération par LLM
Visualisation	`st.bar_chart()` avec pandas
Déploiement	Streamlit Cloud, Hugging Face Spaces

En 15 minutes, tu es passé d'un script Python qui tourne dans un terminal à une application web interactive propulsée par IA, déployable en un clic. C'est ça, la magie de Streamlit.

Et maintenant, à toi de jouer : adapte ce squelette à ton propre projet. Les possibilités sont infinies — dashboard de données, chatbot, outil de visualisation, playground IA. Tout ce que tu sais coder en Python, Streamlit peut le transformer en app web.

1. C'est quoi Streamlit, concrètement ?

2. Installation : prépare ton environnement

Étape 1 : Créer un dossier de projet

Étape 2 : Créer un environnement virtuel

Étape 3 : Installer Streamlit

3. Premier pas : ta première app Streamlit

4. Ajoute de la vraie interactivité : widgets et état

5. Cas avancé : connecter un vrai modèle d'IA avec Ollama

Installation d'Ollama (2 minutes)

Version finale de l'app avec IA

Lancement complet

6. Ajouter un graphique (parce que les graphs, c'est la vie)

7. Déploie ton app en ligne (pour que le monde entier puisse l'utiliser)

Option 1 : Streamlit Community Cloud (gratuit, recommandé)

Option 2 : Hugging Face Spaces (gratuit aussi)

8. Pièges classiques (et comment les éviter)

Piège 1 : La ré-exécution systématique

Piège 2 : st.cache_data oublié

Piège 3 : Ollama ne répond pas

Piège 4 : Le fichier requirements.txt qui explose

9. Pour aller plus loin

Récapitulatif : ce que tu as appris

Piège 2 : `st.cache_data` oublié