How to use Python in HTML web page?

May 02, 2022

The good news for python developers and data scientists is, Now python developers will have no need to learn javascript for front-end scripting in websites.

How to add Python in HTML?

Anaconda's team has launched PyScript, which can be integrated into HTML pages like JavaScript and PHP. PyScript is an open-source project that helps you use Python to make applications in the browser. It works the way the DOM does on a web page, allowing for natural integration with programming in Python.

To add python to the HTML page, Include the scripts on your HTML page

<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>

PyScript lets you add components to pages written in HTML. The following PyScript elements are currently available:

<py-script>: This is an element that can be used to add logic to executable python code within a web page
<py-repl>: created a REPL component that is rendered to the page as a code editor and executes user-written code

PyScript Hello World Example

<!DOCTYPE html>
<html lang="en">


<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1" />

    <title>PyScript Hello World</title>

    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
</head>


<body>
    Hello world! From HTML <br>
    <py-script>
        print("Hello World! from PyScript")
    </py-script>
</body>

</html>