Skip to content

Latest commit

 

History

History
121 lines (80 loc) · 4.06 KB

File metadata and controls

121 lines (80 loc) · 4.06 KB

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). 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)
  • 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 code in the textarea
  3. Click Run Code

Option B — GitHub Pages / any static host

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

Try these beginner examples

Paste into the editor:

# 1) Hello
print("Hello from Python by Example")

# 2) Loop
for i in range(5):
    print("count", i)

# 3) List comprehension
squares = [n * n for n in range(10)]
print(squares)

# 4) Function
def greet(name: str) -> str:
    return f"Hi, {name}!"

print(greet("student"))

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.