Guies i Tutorials / Tutorial
· Tutorial ·

Com crear una aplicació web usant Flask a Python 3

Flask és un framework web lleuger i flexible per a Python que permet construir aplicacions web de manera ràpida i senzilla. S'enfoca en la simplicitat i la modularitat, cosa que fa que sigui fàcil d'aprendre i utilitzar per a projectes petits i grans. No requereix eines o biblioteques addicionals, el que significa que pots començar a construir la teva aplicació web amb només unes poques línies de codi.

A continuació et proporcionem un manual detallat per crear una aplicació web usant Flask a Python 3:

1. Preparació de l'entorn de desenvolupament

Abans de començar a escriure codi per a l'aplicació web, és important tenir un entorn de desenvolupament adequat. Assegura't de tenir Python 3.x i pip (l'administrador de paquets de Python) instal·lats al teu sistema. Després, segueix els passos següents:

  1. Crea un nou directori per a l'aplicació web al sistema.

  2. Obre una terminal o consola d'ordres al directori acabat de crear.

  3. Crea un entorn virtual de Python utilitzant l'ordre python3 -m venv venv a la terminal.

  4. Activa l'entorn virtual amb l'ordre source venv/bin/activate en sistemes UNIX o venv\Scripts\activate en sistemes Windows.

  5. Instal·la Flask amb l'ordre pip install flask.

2. Creació de l'aplicació web

Ara que has preparat l'entorn de desenvolupament, pots començar a escriure el codi per a l'aplicació web. Segueix els passos següents:

  1. Crea un fitxer app.py al directori de l'aplicació web.

  2. Importa Flask i crea una instància de l'aplicació web. Pots fer-ho de la següent manera:

file app.py

from flask import Flask
app = Flask(__name__)
  1. Crea una ruta bàsica que mostri un missatge de benvinguda. Pots fer-ho de la següent manera:

file app.py

@app.route('/')
def index():
    return Benvingut a la meva aplicació web!'
  1. Afegeix una condició if __name__ == '__main__': al final del fitxer per assegurar-te que l'aplicació web només s'executi, si s'executa el fitxer directament i no si s'importa a un altre fitxer. Pots fer-ho de la següent manera:

file app.py

if __name__ == '__main__':
    app.run()
  1. Desa el fitxer i tanca'l.

3. Execució de l'aplicació web

Per executar l'aplicació web, segueix els passos següents:

  1. Obre una terminal o consola d'ordres al directori de l'aplicació web.

  2. Activa l'entorn virtual amb l'ordre source venv/bin/activate en sistemes UNIX o venv\Scripts\activate en sistemes Windows.

  3. Executa l'aplicació web amb l'ordre python app.py.

  4. Obre un navegador web i visita http://localhost:5000/. Hauries de veure el missatge de benvinguda que vas afegir anteriorment.

4. Afegir més funcionalitat a l'aplicació web

Ara que has creat una aplicació web bàsica, pots començar a afegir-hi més funcionalitat. Pots fer-ho afegint més rutes i funcions al fitxer app.py. Per exemple, pots afegir una ruta per mostrar una pàgina de contacte i una funció que processi un formulari de contacte. Pots fer-ho de la següent manera:

file app.py

@app.route('/contacte')
def contacte():
    return 'Pàgina de contacte'

@app.route('/enviar', methods=['POST'])
def enviar():
    nom = request.form['nom']
    email = request.form['email']
    missatge = request.form['missatge']
    # Processar el formulari i enviar el correu electrònic
    return 'Missatge enviat correctament'

A l'exemple anterior, la ruta /contacte mostra una pàgina de contacte i la ruta /enviar processa un formulari enviat per l'usuari utilitzant el mètode HTTP POST.

Per processar el formulari, es fa servir l'objecte request que ve amb Flask. La informació enviada per l'usuari es pot obtenir de l'objecte request.form que és un diccionari que conté les dades del formulari. En aquest exemple, s'obtenen els valors de nom, email i missatge del formulari.

Després, es processa el formulari i s'envia un missatge de confirmació a l'usuari.

5. Ús de plantilles

Quan es construeixen aplicacions web més complexes, pot ser útil fer servir plantilles per crear el contingut HTML de les pàgines. Flask utilitza el motor de plantilles Jinja2 per fer-ho.

Per utilitzar plantilles a la teva aplicació web, segueix els passos següents:

  1. Crea una carpeta templates al directori de l'aplicació web.

  2. Crea un fitxer de plantilla anomenat base.html a la carpeta templates. Aquest fitxer contindrà l'estructura bàsica de totes les pàgines del teu lloc web.

file base.html

<!doctype html>
<html>
<head>
    <title>{% block title %}{% endblock %}</title>
</head>
<body>
    {% block content %}
    {% endblock %}
</body>
</html>
  1. Crea un fitxer de plantilla anomenat contacte.html a la carpeta templates. Aquest fitxer contindrà el contingut específic de la pàgina de contacte.

file contacto.html

{% extends 'base.html' %}

{% block title %}Contacto{% endblock %}

{% block content %}

Contacto



i