Embed Python scripts in HTML with PyScript

The new PyScript project lets you embed Python programs directly in HTML pages and execute them within the browser without any server-based requirements.

The project was announced this weekend at PyCon US 2022 and acts as a wrapper around the Pyodide project, which loads the CPython interpreter as a WebAssembly browser module.

"PyScript is a framework that allows users to create rich Python applications in the browser using a mix of Python with standard HTML." explains Anaconda in a recent blog post.

"PyScript aims to give users a first-class programming language that has consistent styling rules, is more expressive, and is easier to learn."

While the Pyodide project previously allowed you to run Python in the browser, it takes some time to get used to the syntax and is not as elegant as simply writing a Python program and pasting it into your HTML page.

However, PyScript acts as a wrapper, allowing you to embed Python code directly between py-script tags and have it automatically executed by Pyodide.

For example, the following illustrates a small Hello World example using PyScript and its execution directly in the browser. Notice how the pyscript.write() function allows you to output data directly to an HTML element.

Developers can also extend PyScript pages through additional Python packages built into Pyodide or through ones stored on the local filesystem. PyScript's GETTING-STARTED.md file provides documentation on how to import packages into your code.

In addition to executing code embedded in HTML, it's also possible to add a code editor directly into an HTML page using the py-repl tag so that you can input code and execute it, as shown below.

Using the editor makes it easy to test code on the fly and see what will and won't work with PyScript.

While JavaScript can already perform almost everything you would want to create using PyScript, with Python considered the most popular programming language, PyScript opens the door for many interesting projects down the road.

To get started with PyScript, you can visit their GitHub project page, which also includes numerous code examples.