Run Python Directly in the Browser with PyScript: A Step‑by‑Step Guide
This article introduces PyScript, explains how it compiles Python to WebAssembly for client‑side execution, and provides a complete tutorial—including setup, a Hello World example, and code explanations—to help developers embed Python seamlessly into HTML web pages.
In the evolving world of web development, integrating different programming languages has become a hallmark of innovation. Python, known for its versatility, is now extending beyond its traditional domains into web development.
PyScript is a framework that enables developers to create rich Python applications in the browser by combining HTML, Pyodide, and WebAssembly. Announced by Anaconda at PyCon US 2022, PyScript compiles Python code to WebAssembly, allowing it to run directly in the browser without a server or JavaScript interpreter.
Key Features of PyScript
Full access to the Python standard library, including NumPy, Pandas, and SciPy, enabling complex, data‑intensive web applications.
Easy to learn and use, with syntax familiar to Python developers and no complex build or deployment steps.
Compatibility with existing web technologies such as HTML, CSS, and JavaScript, allowing seamless integration into any web project.
PyScript Hello World Example
Below is the basic HTML structure required for a PyScript page:
<!DOCTYPE html></code><code><html></code><code> <head></code><code> <meta charset="utf-8"></code><code> <meta name="viewport" content="width=device-width"></code><code> <title>PyScript | Hello, World!</title></code><code> </head></code><code> <body></code><code> </body></code><code></html>Link the PyScript files by adding the following two lines to the <head> section:
<link rel="stylesheet" href="https://pyscript.net/latest/pyscript.css" /></code><code><script defer src="https://pyscript.net/latest/pyscript.js"></script>Now print “Hello, World!” and display the host name and IP address:
Hello, world! <br></code><code>Hostname and IP Address: </code><code><py-script></code><code> import socket</code><code> hostname = socket.gethostname()</code><code> display(hostname)</code><code> ip_address = socket.gethostbyname(hostname)</code><code> display(ip_address)</code><code></py-script>Explanation of the code:
Hello, world! <br> displays the text followed by a line break.
Hostname and IP Address: plain text indicating the upcoming output.
<py-script> block: runs Python in the browser. import socket imports the socket module for network functions. hostname = socket.gethostname() retrieves the current host name. display(hostname) shows the host name in the page. ip_address = socket.gethostbyname(hostname) resolves the IP address. display(ip_address) displays the IP address.
When the HTML file is opened in a browser, the page will display the greeting, host name, and IP address as shown in the accompanying screenshot.
PyScript is still under active development and has the potential to fundamentally change how we build web applications, making it possible to create rich, interactive experiences using Python that run in any browser.
Typical use cases include:
Data‑visualization apps with NumPy and Pandas.
Machine‑learning models built with scikit‑learn.
Interactive web mini‑games.
Custom web widgets and components.
Engaging educational content.
The possibilities are virtually limitless.
We hope this guide gives you a clear overview of PyScript and inspires you to explore its capabilities in your own web projects.
Signed-in readers can open the original source through BestHub's protected redirect.
This article has been distilled and summarized from source material, then republished for learning and reference. If you believe it infringes your rights, please contactand we will review it promptly.
21CTO
21CTO (21CTO.com) offers developers community, training, and services, making it your go‑to learning and service platform.
How this landed with the community
Was this worth your time?
0 Comments
Thoughtful readers leave field notes, pushback, and hard-won operational detail here.