Flask en PythonAnywhere con despliegue continuo usando GitHub

Este es el tercer, y ultimo, artículo en una serie de tres que muestran cómo disponer de una aplicación sencilla de Flask en PyuthonAnywhere.

1. Hola Mundo en PythonAnywhere con Flask
2. PythonAnywhere subiendo una aplicación Flask desde GitHub
3. Flask en PythonAnywhere con despliegue continuo usando GitHub ← (es el post en el que estamos)

Cambiando nombres seguiremos los pasos de la entrada:

PythonAnywhere subiendo una aplicación Flask desde GitHub

Lo que haremos en este caso es comenzar con una cuenta nueva en PyhthonAnywhere denominada universo que nos permitirá desplegar la página web:

https://universo.pythonanywhere.com

El objetivo es emplear una cuenta gratuita de PythonAnywhere y desplegar una aplicación web en Flask manteniendo nuestro repositorio en GitHub, usando despliegue continuo.

El flujo de trabajo será el siguiente.

Visual Studio Code (local ) → GitHub  → PythonAnywhere

Referencias

• Un artículo de Medium (el código del artículo contiene errores)
• Stackoverflow

Paso 1

Vamos a crear un nuevo repositorio en GitHub con un 'Hola mundo' en Flask.

Se llamará flaskanywhere.

https://github.com/financieras/flaskanywhere

Si al crear el repositorio no se indica que se añadirán los ficheros readme, licencia y gitignore, GitHub nos ofrece una pantalla con ayuda para comenzar a trabajar con git. En esa página vemos una serie de instrucciones de git para subir los archivos.

Reproducimos el código sugerido en la imagen anterior.

• Crear un nuevo repositorio en la línea de comandos.

echo "# flaskanywhere" >> README.md
git init
git add README.md
git commit -m "first commit"
git branch -M main
git remote add origin https://github.com/financieras/flaskanywhere.git
git push -u origin main

• Enviar un repositorio existente desde la línea de comandos.

git remote add origin https://github.com/financieras/flaskanywhere.git
git branch -M main
git push -u origin main

Paso 2

Podemos "enviar" (push) nuestro código a GitHub, y luego "tirarlo" (pull) a PythonAnywhere, o enviarlo desde PythonAnywhere hacia GitHub.

En PythonAnywhere, usaremos una Consola Bash y así podremos acceder a git y clonar nuestro repositorio, pudiendo luego hacer push (enviar, empujar) y pull (tirar, traer).

Veamos el código que queremos subir a GitHub.

El archivo se llamará app.py

#!/usr/bin/env python3
# -*- coding: utf-8 -*-
from flask import Flask, request
from flask.wrappers import Response
import git

app = Flask(__name__)

@app.route('/git_update', methods=['POST'])
def git_update():
  repo = git.Repo('./flaskanywhere')
  origin = repo.remotes.origin
  repo.create_head('main', 
  origin.refs.main).set_tracking_branch(origin.refs.main).checkout()
  origin.pull()
  return '', 200

@app.route('/')
def hello():
  return '<h1>Hello from Flask</h1><p>Continuous Deployment.</p>'

En la línea

  repo = git.Repo('./flaskanywhere')

no olvide sustituir flaskanywhere por el nombre de su repositorio.

Crearemos un entorno virtual.

El archivo anterior app.py ha sido creado en VSCode y subido a GitHub. Para ello, cambiando los nombres necesarios, seguiremos los pasos de la entrada:

PythonAnywhere subiendo una aplicación Flask desde GitHub

En PythonAnywhere nuestro nombre de dominio que estaba disponible es universo.

Paso 3

Creamos la cuenta universo en PythonAnywhere.

Activamos el protocolo SSH para tener página https.

Veamos a seleccionar la:

 WSGI configuration file: /var/www/universo_pythonanywhere_com_wsgi.py

Vemos que la ruta (path) está correcta y que el nombre de la aplicación es app.

Clonamos nuestro repositorio desde una terminal Bash, desde PythonAnywhere

git clone https://github.com/financieras/flaskanywhere.git

Cambiamos la ruta Source code añadiendo al final flaskanywhere.

Editamos el archivo:

WSGI configuration file:/var/www/universo_pythonanywhere_com_wsgi.py

para que en la línea 11 contenga la ruta actualizada.

project_home = '/home/universo/flaskanywhere'

Recargamos, pulsando el botón verde, y mostramos la página.

Hagamos un ligero cambio en nuestro código de la aplicación Flask. Pondremos el texto en español.

Pulsando el botón verde de recarga y actualizando la página ya vemos los cambios.

En este momento ya hemos conseguido automatizar el proceso más allá de lo que quedó descrito en el post anterior, ya que gracias al Webhook y al nuevo código del archivo app.py ya hemos conseguido despliegue contínuo.

Ahora nos gustaría que no fuera necesario recargar la página pulsando el botón verde, y que la página se recargara sola al subir los cambios desde nuestro Visual Studio Code.

Recarga automática

En la consola Bash de PythonAnywhere introducimos los siguientes comandos estando en el directorio correspondiente.

En nuestro caso, estamos en flaskanywhere/.git/hooks

cat>post-merge
touch /var/www/universo_pythonanywhere_com_wsgi.py

Después de introducir este código en la consola pulsamos Control+C

Podemos consultar si se ha creado correctamente el archivo post-merge.

cat post-merge

Otra forma de consultarlo consiste en ir a la página de PythonAnywhere y mirar el archivo con post-merge que estará en la ruta que se muestra en la siguiente imagen.

La siguiente imagen muestra los comando introducidos en la consola Bash de PythonAnywhere.

El último comando da permisos de ejecución al archivo creado.

chmod +x post-merge

Finalmente hacemos algún cambio más en en código Flask, en nuestro Visual Studio Code. Se suben los cambios a GitHub y sin necesidad de hacer nada más ya tendremos nuestras modificaciones en la web. Simplemente actualizando la página ya veremos los cambios.

En el artículo de Medium que hemos utilizado también se habla de la seguridad, por si quieres implementarla, si bien, al tratarse de una cuenta gratuita en PythonAnywhere ya existen sistemas que interrumpirán el servicio de la página en caso de sobrepasarse el uso de la CPU.

¿Cuál es el siguiente paso?

Lo siguiente es poder desarrollar páginas web en Flask más complejas usando Templates y usando Jinja2.