Run Python in Your Browser with PyScript: A Beginner’s Guide

Python has become a standard programming language for many data professionals. It is useful for manipulating data, developing machine learning models, and developing simple applications.

To run Python, we often need to set up the environment within our local system or use a paid cloud service server. However, there is another alternative to efficiently running it in your browser, and that is using PyScript.

This article will discuss using PyScript to help you run Python and develop applications within the platform.

Curious about it? Let’s get into it.

Python with PyScript

 
PyScript is an open-source platform for running Python in the browser developed by the Anaconda team. It is intended to empower users to run Python everywhere without any tool ecosystem or server limitation, as you only need a browser (and the internet) to do so.

The PyScript platform is easy to use. You only need a minimum setup to create and run Python applications in your browser. Applications you make in the PyScript platform are also shareable and scalable (maximum 1 MB for free users) without limiting the number of applications you can create.

Let’s start using PyScript to run our Python scripts. The first thing you need to do is register for the PyScript.com account. Use any authentication method you prefer, and you will be transferred to the PyScript dashboard, as shown below.

 
In the dashboard, you can create a new project or see the examples from PyScript that you can take inspiration from to make your application. There are many examples to choose from, which you can learn from if you want.

 
For our guide, we will learn how to run Python in PyScript using a project we create ourselves. Select to create a new project, and you will be presented with a new Python environment similar to the image below.

 
By default, the PyScript application will require three files, including:

1. The index.html file for the system front-end.
2. The pyscript.json or pyscript.toml file to describe the application Python environment.
3. The Python script is often called main.py to control how the application works.

We will now run Python with PyScript and create a simple application on the platform. We will build a simple application that generates fake information and displays it in HTML form.

First, go to the pyscript.toml file that is available and put the information similar to below.

name = "PyScript Information Generation"
description = "A simple application to generate fake information"
packages = ["faker"]

 
You can change the application’s name and description, but what is important is the packages. We will use the Faker library to generate fake information such as names, addresses, and phone numbers.

The next thing we will set is the index.html file. The file is already pre-filled with the default code, so we only need to fill in the Body tag part for now. We will use the following code to provide the button for generating information and the placeholder.

    

        
Generate fake information
        

            Get a new profile
        
        
        
        
        
    

If you see the code above, you can see that we have code like py-click="get_information" on the button tag. This is where the button will call the get_information function we set in the main.py. We also provide several div tags with different id names for the text output coming from Python.

For the Python code, we will use the following code.

from faker import Faker
from pyscript import document

def get_information(event):
    fake = Faker()
    name_text = document.querySelector("#name")
    name_text.innerText = f"Name: fake.name()"

    address_text = document.querySelector("#address")
    address_text.innerText = f"Address: fake.address()"
    
    phone_text = document.querySelector("#phone")
    phone_text.innerText = f"Address: fake.phone_number()"

 
The code shows that we use the PyScript library to find information from the HTML page. This was done so the index and main files could work together to make the Python application work correctly.

Overall, you can see the Python application like the image below.

 
Congratulations! You have just run a Python script with PyScript. The Python application I developed is on the following page if you want to review it. Also, refer to the PyScript documentation to explore what you can do with PyScript further.

Conclusion

 
Python is one of the most popular programming languages, and PyScript provides a way to run the language without having to set it up. In this article, we will learn how to use PyScript and develop a simple application with Python while running it completely free.

I hope this has helped!
 
 

Cornellius Yudha Wijaya is a data science assistant manager and data writer. While working full-time at Allianz Indonesia, he loves to share Python and data tips via social media and writing media. Cornellius writes on a variety of AI and machine learning topics.