Programação Python

Como Executar Python no Browser usando PYSCRIPT 2022

Como Executar Python no Browser usando PYSCRIPT

Imagine se fosse possível executar diretamente o Python no browser do seu PC, seria incrível não é mesmo?

Pois saiba que essa possibilidade existe, graças ao Pyscript. Trata-se basicamente de uma biblioteca Javascript que possibilita a criação de apps python no navegador. Para isso ele usa um mix de Python com HTML padrão.

Seu objetivo com isso é unicamente ampliar o acesso aos benefícios do Python e de suas inúmeras bibliotecas a mais usuários. E o mais interessante é que você não precisa se preocupar com a implantação. Afinal, através do Pyscript tudo ocorrerá em navegadores da web.

Acompanhe esse artigo e entenda mais sobre como funciona o Pyscript. Além disso, aprenda também como executar Python no browser do seu PC.

Pyscript – Como funciona?

Basicamente, o pyscript foi projetado tendo como base o Pyodide, uma biblioteca que converte códigos python em webassembly. Mas o que esse termo significa?

De modo geral, webassembly consiste em uma tecnologia que ajuda a escrever sites na linguagem de programação python. Ou seja, ele converte a linguagem em texto “.wat” para o formato “.wasm” binário, para que os navegadores consigam utilizar.

Com isso, é possível escrever códigos em qualquer linguagem, assim como compilar a linguagem para webassembly. E, assim, executa-la em um navegador web.

Em relação ao Pyscript, é importante destacar que, até o momento, o mesmo só oferece suporte para códigos python em um navegador. Além disso, você só poderá usar as bibliotecas que a base do Pyscript, o Pyodide, é capaz de suportar.

Executando código python no browser com Pyscript

Agora que você já sabe como funciona o Pyscript, vamos aprender agora como criar seu primeiro código Python no browser.

Para esse tutorial usaremos como exemplo a criação do código mais básico, o Hello Word do Pyscript.

Então, para executar o python no browser usando Pyscript, primeiramente você deve criar um arquivo “index.html”. Em seguida, utilize o comando abaixo para criar o código básico citado acima:

<html>
  <head>
    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
    <Script defer src="https://pyscript.net/alpha/pyscript.js"></script>
  </head>
  <body> 
    <py-script> print('Hello, World!') </py-script> 
  </body>
</html>

No comando acima, o código python está presente na tag “<py-script>”. Dito isso, agora é só abrir o navegador. Ao fazer isto, você verá a frase “Hello, Word!” na saída do navegador.

Criando um histograma a partir de uma distribuição Normal Padrão

Neste ponto, você já criou um código básico python no browser do seu PC. Agora, o que acha de ir mais além no seu aprendizado?

O que vamos ensinar agora é como gerar números a partir de uma distribuição Normal padrão. Em seguida, você poderá plota-los usando a biblioteca “matplotlib”. Para isso, execute o código abaixo:

<html>
  <head>
    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
    <py-env>
     - numpy
     - matplotlib
    </py-env>
  </head>
  <body> 
    <h1>Histograma de uma Distribuição Padrão</h1>
    <div id="grafico"></div>
    <py-script output="grafico">
      import matplotlib.pyplot as plt
      import numpy as np
      
      np.random.seed(42)
      rv = np.random.standard_normal(1000)

      fig, ax = plt.subplots()
      ax.hist(rv, bins=30)
      fig
    </py-script> 
  </body>
</html>

No código acima, se usa o bloco “<py-env>” para estabelecer quais serão as bibliotecas usadas. Elas ficarão dispostas como uma lista, sendo uma biblioteca por linha. Além disso, o parâmetro output na tag (<pyscript output=”grafico”>), serve para indicar em qual tag o gráfico será desenhado.

Então, depois que concluir a execução completa do código acima, aparecerá em seu navegador o histograma.

Observações importantes!

À medida em que seu código se expande, uma dica é deixar seu código HTML mais limpo. Para isso, você pode deixar o código python separado em um arquivo “.py” usando o comando abaixo:

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

Portanto, agora você já sabe como executar python no browser com Pyscript. E então, o que achou? Ficou com alguma dúvida? Comente abaixo!

Deixe um comentário

O seu endereço de e-mail não será publicado.