Besoin d’exécuter Python dans un navigateur web ? Votre hébergeur ne vous permet pas d’installer Python, ou vous avez trop la flemme ? Ou encore mieux, vous n’avez pas de serveur web ? ^^
Pour ces petites raisons (et pour des petits besoins), j’ai trouvé une solution vraiment cool : Pyodide 🔥
Avec ce script (très simple à installer), il est possible d’exécuter du code Python directement dans un navigateur sans nécessiter de serveur spécifique 😉
Voici comment procéder :
Configuration de l’environnement
1 – Télécharger Pyodide
Vous pouvez utiliser le CDN pour accéder à Pyodide sans avoir à télécharger tous les fichiers.
Ce lien charge la version complète de Pyodide 👇
<script src="https://cdn.jsdelivr.net/pyodide/v0.28.2/full/pyodide.js"></script>
🔗Alternativement, téléchargez Pyodide depuis le site officiel ou sur Github pour un usage hors ligne & placez-le dans votre projet web.
2 – Structurer le projet
Créez un dossier local pour votre projet et incluez Pyodide si vous avez choisi de le télécharger :
/mon_projet
index.html
Pour l’exemple, je vais directement mettre le CDN
3 – Créer une simple page HTML
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Python dans le Navigateur</title>
<script src="https://cdn.jsdelivr.net/pyodide/v0.28.2/full/pyodide.js"></script>
<script>
async function initPyodide() {
let pyodide = await loadPyodide();
let output = await pyodide.runPythonAsync(`
import sys
sys.version
`);
document.getElementById('output').textContent = 'Version Python : ' + output;
}
window.onload = initPyodide;
</script>
</head>
<body>
<h1>Exécution de Python dans le Navigateur</h1>
<div id="output">Chargement...</div>
</body>
</html>
4 – Lancer le projet en local
Pour exécuter ce projet, ouvrez simplement index.html dans votre navigateur.
👉 Pyodide se chargera d’exécuter le code Python intégré et d’afficher la version de Python dans le navigateur.
Quelques conseils
- Tests en local : Pyodide peut fonctionner hors ligne si vous avez correctement téléchargé les fichiers nécessaires, ce qui le rend idéal pour les démonstrations et les tests rapides…
- Optimisation du temps de chargement : Utilisez la fonctionnalité de pré-chargement pour réduire le temps de démarrage des scripts
- Interactivité : Ajoutez des formulaires et des boutons dans votre HTML pour permettre aux utilisateurs d’exécuter du code Python en réponse à leurs actions
10 petits exemples de fonctionnalités
- Utiliser des bibliothèques comme NumPy et Pandas pour réaliser des calculs complexes directement dans le navigateur, idéal pour des applications d’analyse de données
- Créer des visualisations interactives avec Matplotlib ou Plotly pour représenter graphiquement des datasets, sans nécessiter de backend
- Développer des plateformes d’apprentissage interactives qui permettent aux utilisateurs d’écrire et d’exécuter du code Python directement dans le navigateur
- Construire des outils pour simuler des modèles mathématiques ou physiques, offrant ainsi une manière visuelle de comprendre des concepts compliqués
- Implémenter des outils pour le traitement et l’analyse de texte en temps réel, par exemple avec NLTK, pour des démonstrations de tokenisation ou d’analyse de sentiment
- Développer des applications statistiques en utilisant SciPy pour effectuer des tests et des analyses avancées
- Utiliser des bibliothèques spécialisées pour créer des modèles de molécules ou analyser des données génomiques
- Créer des petits jeux éducatifs ou puzzles qui intègrent des éléments de code Python pour apprendre en s’amusant
- Développer des outils pour résoudre des problèmes d’optimisation directement dans le navigateur avec des bibliothèques comme SciPy
- Intégrer Python avec des frameworks de JavaScript pour créer des applications web dynamisées par des calculs Python complexes
Voici, par exemple, une fonctionnalité que j’ai mise en place en quelques minutes : un graphique interactif généré avec Python dans le navigateur.
Grâce à Pyodide et Matplotlib, j’ai créé ce visuel rapidement & facilement :
Vous voyez, ce sont des petites fonctionnalités qu’on peut ajouter sur des pages pour enrichir l’interactivité & l’UX.
Avec Pyodide, intégrer des petits projets Python dans vos pages web devient accessible, vous permettant d’explorer une multitude d’applications allant des visualisations de données aux simulations interactives.
⚠️ Limitations
Attention, c’est pas magique non plus.
Bien que Pyodide offre de nombreuses possibilités, il ne permet pas tout (ce serait trop beau)
Certaines bibliothèques qui nécessitent un accès direct au système d’exploitation, ou des fonctionnalités réseau avancées ne sont pas supportées.
Par exemple des bibliothèques comme Selenium ou celles nécessitant des extensions C ne peuvent pas fonctionner dans l’environnement restreint du navigateur.
Donc si vous aviez un plus gros projets en tête (genre ouvrir un Chromium ou scraper avec Selenium, oubliez Pyodide)
Bref, exécuter Python dans le navigateur ouvre des possibilités fascinantes pour la création d’applications web interactives et éducatives, même si elles sont limitées.
J’espère que ce tips vous a plu, il pourrait bien vous servir un jour ou l’autre (pour gagner du temps😄)
à très vite 🔥
