HIBA KAdat

Prompt per generar aplicació en Python:

Integració de Flask amb MySQL

Idea de l’aplicació

Per a aquesta tasca s’ha dissenyat una aplicació web de registre i autenticació d’usuaris.

L’aplicació permet que els usuaris:

Es registrin amb les seves dades (nom, correu electrònic i contrasenya)

Iniciïn sessió de manera segura

Mantinguin una sessió activa mentre naveguen per l’aplicació

Accedeixin a contingut personalitzat segons l’usuari autenticat

Aquesta idea s’ha escollit perquè és un cas real molt habitual en aplicacions web i permet demostrar clarament l’ús de Python com a backend.

🔹 Per què utilitzar Python com a backend

Python s’utilitza com a llenguatge de backend perquè permet gestionar tota la lògica de negoci de l’aplicació, és a dir, totes les operacions que no es poden fer només amb HTML.

En aquesta aplicació, Python s’encarrega de:

Validar les dades introduïdes pels usuaris

Comprovar si un usuari existeix a la base de dades

Gestionar l’inici i el tancament de sessions

Processar peticions del client i retornar respostes dinàmiques

Per implementar el backend s’utilitza el framework Flask, que permet crear aplicacions web lleugeres i eficients amb Python.

🔹 Diferència entre una web estàtica i una
web dinàmica

Una web estàtica, creada només amb HTML i CSS, mostra sempre el mateix contingut a tots els usuaris i no pot gestionar dades ni sessions.

En canvi, aquesta aplicació és una web dinàmica, ja que:

El contingut canvia segons l’usuari que ha iniciat sessió

Les dades s’obtenen d’una base de dades

Les respostes es generen en temps real des del servidor

Aquesta funcionalitat només és possible gràcies a l’ús de Python al servidor, que processa les peticions abans d’enviar la resposta al navegador.

🔹 Connexió amb base de dades

L’aplicació es connecta a una base de dades MySQL per emmagatzemar la informació dels usuaris.
Aquesta base de dades conté, entre altres, una taula d’usuaris amb camps com:

Identificador d’usuari

Nom

Correu electrònic

Contrasenya (emmagatzemada de forma segura)

La connexió amb la base de dades es gestiona mitjançant SQLAlchemy, una llibreria que facilita la comunicació entre Python i MySQL i permet treballar amb dades de forma estructurada i segura.

🔹 Gestió de sessions

Per controlar l’autenticació dels usuaris, l’aplicació utilitza sessions.
Les sessions permeten:

Mantenir l’usuari identificat mentre navega per diferents pàgines

Evitar que un usuari no autenticat accedeixi a zones restringides

Millorar la seguretat i l’experiència d’usuari

Aquesta gestió de sessions és una tasca pròpia del backend i demostra clarament la necessitat d’utilitzar Python en lloc d’una solució purament estàtica.

🔹 Escalabilitat i manteniment

L’ús de Python i Flask permet crear una aplicació modular i escalable, de manera que en el futur es podrien afegir noves funcionalitats com:

Recuperació de contrasenya

Rols d’usuari (administrador, usuari normal)

Integració amb altres serveis

Aquesta estructura facilita el manteniment del codi i segueix bones pràctiques de desenvolupament web.

🔹 Arquitectura general de l’aplicació

Arquitectura general de l’aplicació

Les principals parts de l’aplicació són:

Gestió de rutes (routes)

Lògica de negoci

Connexió amb la base de dades

Gestió de sessions d’usuari

🔹 Estructura de carpetes del projecte

El projecte està organitzat de la següent manera:

projecte_login/
│
├── app.py
├── config.py
├── models.py
├── routes.py
├── requirements.txt
└── templates/
├── login.html
├── register.html
└── dashboard.html

Descripció dels fitxers:

app.py: fitxer principal que inicia l’aplicació Flask
config.py: configuració de la base de dades i sessions
models.py: definició dels models de la base de dades
routes.py: rutes i funcionalitats de l’aplicació
templates/: pàgines HTML dinàmiques
requirements.txt: llibreries necessàries del projecte

Aquesta organització segueix bones pràctiques de desenvolupament backend.

🔹 Implementació : codi Python

1. Configuració de l’Estructura de Fitxers

El primer pas va ser organitzar el projecte de manera professional. En lloc d’un sol fitxer, hem creat una arquitectura modular.

Acció: Creació de la carpeta principal `projecte_login` i la subcarpeta `templates`.
Fitxers creats: `app.py`, `config.py`, `models.py`, `routes.py` i `requirements.txt`.
Correcció tècnica: Vam detectar i corregir un error d’extensions duplicades (ex: `app.py.py`) per assegurar que el sistema reconegués els scripts de Python correctament.

🔹. Definició del Model de Dades (Backend)

Hem definit com serà l’usuari a la nostra base de dades utilitzant SQLAlchemy.
Acció: Al fitxer `models.py`, hem creat la classe `User` amb els camps: `id`, `username`, `email` i `password`.
Connexió: Al fitxer `config.py`, hem configurat la ruta de connexió cap al servidor local XAMPP (`mysql+pymysql://root:@localhost/lan_party_db`).

3. Desenvolupament del Frontend (Interfície)

Dins de la carpeta `templates`, hem creat la part visual que l’usuari final veurà.
Acció: Creació de `login.html`.
Disseny: Hem utilitzat HTML5 i CSS per donar-li un estil “Gaming/Hacker” amb colors negres i neó verd, adequat per a una LAN Party.

4. Execució i Prova del Servidor

Finalment, hem posat en marxa l’aplicació per comprovar que tot funciona.
Acció: Hem utilitzat el Terminal integrat de VS Code.
Comanda: `python app.py`.
Resultat: El servidor s’ha aixecat correctament a l’adreça local `http://127.0.0.1:5000`

Llistat de Llibreries

Flask

Microframework web principal.

SQLAlchemy

ORM per gestionar la base de dades sense SQL manual.

PyMySQL

Driver per connectar Python amb XAMPP (MySQL).

Camp (Field)	Tipus (Type)	Descripció
id	INT	Clau primària (Auto-increment)
username	VARCHAR(50)	Nom d’usuari per l’accés
email	VARCHAR(100)	Correu electrònic del participant
password	VARCHAR(255)	Contrasenya encriptada (Hash)

Arquitectura de Dades i Persistència amb Flask