Subiendo tu web flask a un servidor gratuito modo dificil

6 diciembre, 2024 0 Por admin

Contenido

1.Instalación de WSL 2.
2.Creando una aplicación con flask.
3.Docker.
4. Subiendo nuestro proyecto a github.
5. Subiendo nuestro proyecto a render.
6. Subiendo nuestro proyecto a vercel

Existe otro artículo en el que te describo como subir tu web a un servidor gratuito de un modo más sencillo.

Subiendo tu web flask a un servidor gratuito

Vamos a crear una aplicación web con el framework flask y el lenguaje Python y la vamos a subir a un alojamiento gratuito.

La web de vercel te permite construir las webs que quieras, la web de render solo te permite una:

https://flask-alpha-green.vercel.app

https://flask-web-wt8c.onrender.com

Las webs de vercel y render te dejan subir tus webs gratis pero todas funcionan enlazándose a tu cuenta de github o gitlab y detentando el archivo Dockerfile para construir tu servidor web, por lo tanto para poder subir tu web tendrás que tener conocimiento básicos de:

-Git y github

-wsl 2

-contendores

-Python y flask

1.Instalación de WSL 2

He creado un artículo único sobre esto: https://murciadevs.tipolisto.es/wsl/

2. Creando una aplicación con flask

Escribimos en el cmd o terminal

python -m venv .venv

.venv\Scripts\activate

pip install flask

Creamos una carpeta llamada src y dentro nuestro main.py, la carpeta templates con el archivo plantilla.html y index.html, vamos a pasarle a la vista unos usuarios:

archivo: main.py

from flask import Flask, render_template

app = Flask(__name__)

# Routes
@app.route("/")
@app.route("/index")
def index():
    usuarios=["Fran", "Kike", "Pablo","Teo"]
    return render_template("index.html", usuarios=usuarios)

# Start the Server
if __name__ == "__main__":
    app.run(host="0.0.0.0", port=3000, debug=True)

archivo templates\plantilla.html

<!DOCTYPE html>

<head>

<title>{% block title %}{% endblock %}</title>

</head>

<body>

<h1>Curso avanza de Python</h1>

{% block content %}{% endblock %}

</body>

</html>

archivo templates\index.html

{% extends "plantilla.html" %}
{% block title %}Home{% endblock %}
{% block content %}

Bienvenidos

    {% for user in usuarios %}

    {% endfor %}
{% endblock %}

Pinchamos en el play para ver que funciona:

3.Docker

3.1 ¿Qué es docker?

Docker es un gestor de contenedores, pero ¿Qué es un contenedor?

Un contenedor es una máquina virtual especial, un contendor se compone de:

Una imagen
Una configuración

Aunque si es posible, los contenedores no tienen interface gráfica y son casi siempre utilizados para crear entorno de desarrollo de páginas web y entorno de cdi o testeo y despliegue de tu aplicación.

Realmente trabaja con el núcleo de Linux y las imágenes que te descargas son librerías que se añaden a este núcleo de linux que esta dentro de tu pc, por lo tanto, para arrancarlos tarda pocos segundos, al correr aislados son ideales para microservicios y para seguridad.

¿Pero que es una imagen?

Una imagen son las librerías que necesita docker para correr tu servidor java ee, tu flask ,tu node, etc muchas están en docker hub, después te encuentras miles de proyectos en github que utilizan sus contenedores personalizados.

Instalación de Docker

Vamos a la web de Docker y nos lo descargamos:

https://www.docker.com/products/docker-desktop/

Se reiniciará el ordenador, al reiniciar saldrá de nuevo Docker, pincha en Accept:

Si sale este mensaje es que hay que activar el wsl:

Ve al cmd y escribe:

wsl -l -v Para ver las distribuciones que tenemos.

wsl -d nombre_distribución para arrancarla

Logeate o entra con gmail o github:

Una vez que tenemos esta pantalla, la cerramos:

Docker se quedará abajo en los programas activos:

3.3 Manejando imáges con docker images (para listar), docker pull nombre_imagen(para descargar), docker image rm nombre_imagen (para borrar), docker image inspect nombre_o_id (para inspeccionar una imagen), docker build -t nombre (para crear)

3.3.1 Docker images

Si escribimos Docker images vemos que no tenemos ninguna descargada:

3.3.2 Descargando imágenes de docker hub, docker pull nombre_imagen:versión

Vamos a docker hub y en el buscardor escribimos Python para descargarnos un linux con python preinstalado:

Pinchamos en la primera:

Elegimos la versión de alpine que son las más ligeras:

Descargamos la imagen, al escribir docker images la veremos descargada:

3.3.3 Creando nuestra imagen a partir de el Python-alpine, docker build -t nombre_imagen

Creamos un archivo en la raíz llamado Dockerfile:

Dentro le ponemos este texto:

# Utilizamos la imagen oficial de Python
FROM python:3.9.21-alpine3.20
# Le decimos al contenedor que se situe en el directorio app
WORKDIR /app
# Dentro del contendor instalamos flask con run
RUN pip install flask
# copiamos nuestro proyecto a la carpeta /app
COPY . .
# exponemos el puerto 3000 en el contenedor
EXPOSE 3000
#ejecutamos el servidor
CMD ["python", "src/app.py"]

Escribimos docker build -t nombre_de_nuestra_imagen . (el punto es para decirle que se ubique en el directorio actual):

3.4. Manjeando contenedores con docker start nombre_contendor_o_id (para arrancar), docker stop nombre_contenedor_o_id (para parar), docker ps -a (para ver los contenedores), docker rm nombre_contenedor_o_id (para borrar), docker run +parámteros(para descargar si no existe o arrancar si existe).

3.4.1 Creando nuestro contenedor

Escribimos docker run -it nombre_de_nuestra_imagen /bin/sh para crear, correr nuestro contendor y ejecutarlo en modo interactivo, el –rm es para eliminar la imagen cuando termine:

docker run –rm -it flask /bin/sh

para ver nuestra web en el navegador es necesario poner -p:

docker run –rm -it -p 3000:3000 flask

El -p es para decirle que redirecciones el puerto 3000 de nuestro contenedor al puerto 3000 de nuestro pc

Ya tenemos nuestro flask dockerizado:

Escribimos exit para salir del contenedor.

Hay otro paso que está bien que seamos y es que podemos dejar a nuestro servidor Python en background, esto se hace con el flag -d, de esta forma nunca se parará:

Escribimos docker run -it -p 3000:3000 -d flask

Para pararlo tenemos que poner docker stop y el nombre o el id del contendor

4.Subiendo nuestro proyecto a github

Para esto creé este artículo: https://murciadevs.tipolisto.es/primeros-pasos-con-git-y-github/

5.Subiendo nuestro proyecto a render

Vamos a https://render.com

Después de entrar logeándonos o con nuestra cuenta de gmail o github pinchamos en +new

Le ponemos un nombre:

Pinchamos en crear un servicio:

Seleccionamos web services:

Al conectarnos a github te detectará solo los proyectos, pero nosotros queremos los proyectos de la organización Murcidevs, pinchamos en Public git repository: