Make Python scripts work in the browser for building web apps
Making Python scripts work in a web browser involves handling web application functions in a web page through the Python programming language.
According to PyScript.net:
“PyScript is a framework that allows users to create rich Python applications in the browser using the HTML interface and the power of Pyodide, WASM and modern web technologies. The PyScript framework offers users of all levels of experience access to an expressive, easy-to-learn programming language with countless apps.
In this column, you will learn what PyScript is, see an example, discover alternatives, and also learn how to create a custom web application with Python and PyScript.
Python is a human-readable programming language.
For example, “TensorFlow” is mostly a JS package, or Plotly and Selenium.
What is PyScript and how can you use it to build web applications?
PyScript is a framework allowing web browsers to use Python scripts.
To use PyScript in a web browser, follow these steps.
- Use the Python code in the web component”
- Pay attention to the indentation.
- Do not format Python code in the web component”
- Use PyScript shortcuts and arguments to import Python modules and packages.
- Use CSS classes and identifiers to insert results into the specific division of HTML documents.
An example of running Python script in a web browser
An example of running a Python script in the browser is shown below.
- numpy - matplotlib
The areaof the HTML file represents the most important resources.
We used “pyscript.css” and “pyscript.js”.
We also used the web component “
In this example, we imported “numpy” and “matplotlib”.
In the section ““, we will use these modules to create a Python Line Plot in a web browser.
Let's plot random numbers
At the beginning ofwe used a “div” with the ID “plot”.
It is needed to perform Python script output insertion.
import matplotlib.pyplot as plt import numpy as np x = np.random.randn(1000) y = np.random.randn(1000) fig, ax = plt.subplots() ax.scatter(x, y) fig
The Python script above is a simple line drawing script. And you can see the result below.
The example above shows how to create a line graph using PyScript.
How to see terminal output from PyScript
For every Python script, there is always a working terminal that generates the compute process messages.
The browser console should be read and followed by the developer to see how the PyScript works and what happens behind the scenes.
For example, the screenshot above shows the process of running the Python script we created.
It explains how the “numpy”, or “matplotlib” and their dependencies are loaded, and used by which resource.
How to create a custom web application with Python and PyScript?
To create a custom web application with Python and PyScript, follow these steps:
- Import the necessary JS and CSS files from PyScript.
- Create an HTML document with the appropriate HTML tag syntax.
- Use the “py-script” HTML tag with the “output” attribute.
- Use an HTML Div with a specific ID to match the value of the “output” attribute.
- Use “py-env” for Python’s non-integrated libraries.
- Insert the Python script in the “py-script” tag without syntax and indentation errors.
- Use “return” in a Python function or “print” to end your script.
- Refresh the web page to see the results.
Below is an example of a custom Python web application for “random password generation” based on password length.
The screenshot above shows an example of PyScript in an HTML document to generate custom passwords.
The Python script I used is below.
import string import random characters = list(string.ascii_letters + string.digits + "[email protected]#$%^&*()") def generate_random_password(): length = int(input("Enter password length: ")) random.shuffle(characters) password =  for i in range(length): password.append(random.choice(characters)) random.shuffle(password) print("".join(password)) generate_random_password()
And the live version of the custom Python web application is here.
Simply write a numeric value in the input box.
And, it will give you a simple 45 character password.
You can use this technology for some of my other SEJ articles for auditing sitemaps or viewing hot topics from news websites.
Or, in the future, we can demonstrate more sophisticated web applications via PyScript.
What are the disadvantages of PyScript?
The main disadvantage of PyScript is the lack of support.
PyScript is announced during Pycon 2022 to Python developers.
It was a big and exciting event, but the expectations of the community were higher than the current state of PyScript.
Due to weak community support, PyScript development might be slower in the future, but when you think about Python’s journey, that’s not surprising.
Python wasn’t as popular as it was five years ago because it wasn’t known.
The main reason for the growth in popularity of Python is the “pandas” library.
That’s why, ML and Data Science are the main goals of Python, but it doesn’t have to continue this way.
Thus, PyScript should be seriously considered for the future of web development.
What are the alternatives to PyScript?
Alternatives to PyScript are not equivalent to PyScript since it runs directly on the browser, but there are still different methods to use Python scripts indirectly inside a website.
These included “brython”, “pyodide”, “Appwrite”, “django-readers”, “appdeamon”.
Some alternatives to PyScript are for Firebase such as Appwrite, and other work for web development such as Brython.
Can PyScript and Brython Affect Search Engines and SEO?
Yes, in the future, PyScript and Brython can increase their effect on the web development industry.
Changing web development technologies and industries affect search engine crawlers and protocols.
If a search engine starts seeing “text/python” files or “.py” scripts in the HTML source code, it should be able to get it working to see the web page as is.
Other PyScript alternatives work through Node.js like back-end programming libraries or Firebase like cloud-based systems.
So in the future, Google, as a heavily Python-coded search engine, might need to render Python files to crawl and display web pages.
Conclusion for Python as a Web Script
But, Python is the easiest programming language to learn because human-readable, it offers more features with less characters.
Most data scientists and ML (machine learning) engineers are familiar with Python, and transferring their talents into web development would be like unifying two different worlds.
Featured Image: TippaPatt/Shutterstock