Python by Example: Run Python in the Browser (Pyodide Tutorial for Beginners)

Python by example interactive lab — write and run Python in your browser with Pyodide (no install required). Work through ten guided examples with Run Code and Next Example. Perfect for college students, coding clubs, and first-day Python workshops.

Lab 0 in the Python learning path · Audience: absolute beginners · Time: ~30–60 minutes · Level: beginner

What is this project?

A tiny static site (index.html + CSS + JS) that loads CPython compiled to WebAssembly via Pyodide. Students type Python in a textarea, click Run Code, and see output instantly.

Search keywords: Python by example, run Python in browser, Pyodide tutorial, Python playground for beginners, learn Python without install, interactive Python for students.

Features

• Zero local Python install for demos
• Instant feedback loop (print, basic expressions)
• Ten guided examples covering variables, loops, functions, collections, sorting, text processing, and a quiz
• A sequential lesson flow: run the current example before moving to the next one
• Great for classrooms and GitHub Pages hosting
• Simple codebase students can fork and extend

Prerequisites

• A modern browser (Chrome, Firefox, Edge, Safari)
• Optional: any static file server if you want http://localhost instead of file://

Quick start

Option A — open locally

git clone https://github.com/saurabhahuja71/python-by-example.git
cd python-by-example

# Python 3 simple server
python3 -m http.server 8080

Open http://localhost:8080

1. Wait until the page says Python ready
2. Edit the current example if you like
3. Click Run Code
4. Click Next Example after the run succeeds

Option B — GitHub Pages / any static host

Publish the repo root (contains index.html). Pyodide loads from the public CDN.

Ten guided examples

The hosted playground includes ten editable lessons. Run each one, inspect the output, and use Next Example to continue:

1. Make the browser say hello
2. Turn minutes into a study plan
3. Classify numbers with a loop
4. Use a list comprehension
5. Write a reusable function
6. Summarize a class with dictionaries
7. Rank results with sorted
8. Analyze text without a file
9. Build a mini word-frequency analyzer
10. Make a tiny command-line-style quiz

Project structure

python-by-example/
├── index.html       # UI + Pyodide bootstrap
├── css/style.css
└── css/js/runner.js # optional helpers (if present)

Lab exercises

1. Write a program that asks for a number (hardcode first) and prints even/odd.
2. Add a Clear output button in index.html.
3. Preload 3 lesson snippets (buttons: Basics / Loops / Functions).
4. Host on GitHub Pages and share the link with classmates.
5. Next: install local Python and continue with ML/API labs.

Learning path — Python track

#	Lab	Focus
0 (this)	python-by-example	Browser Python playground
1	react-fastapi-todo	FastAPI + React + Postgres
2	pets-updates	Flask + workshop product
3	sample-regression-model	scikit-learn regression
4	datascienceandmachinelearning	NumPy/Pandas notebooks
5	algotrading-sample	Algo-trading learning stub

Hub: learning-path

FAQ — Python for absolute beginners

Is browser Python the same as desktop Python?
Mostly for language basics. Some packages and file/system features differ under Pyodide.

Why is the first load slow?
Pyodide downloads a WebAssembly Python runtime once, then caches.

Can I use pandas here?
Possible with Pyodide package loading, but this lab stays minimal on purpose.

Topics / SEO tags

python pyodide browser-python tutorial beginner interactive learn-python college coding-playground webassembly

Author

Saurabh Ahuja · learning-path

License

Educational sample. Pyodide is loaded from CDN under its own license terms.