▸ CAPTURES 02 & 03 — INTERFÍCIE LAN PARTY AL NAVEGADOR
Login “ACCESS GRANTED” · Usuari: Iman · System: Online
Registre Neo_Matrix Completat · LOGGED USERS Actiu · Dades (Encrypted)
▸ CAPTURES 04, 05 & 06 — ÚS DE LA IA (GEMINI) COM A EINA DE SUPORT
▸ PROMPT EXACTE ENVIAT A GEMINI
“Tinc un error al portàtil de l’escola perquè no puc instal·lar Flask. Pots donar-me un codi en Python que
utilitzi només llibreries natives per crear un servidor web que guardi dades en un fitxer .txt i que tingui un
disseny de color verd neó?”
Gemini — Prompt Enviat · Primera Resposta Amb Codi Http.Server Natiu
Gemini — Codi Complet Retornat · Back-End Funcional Amb Do_POST I Proof.Txt
Gemini — Explicació Tècnica Detallada: Http.Server, POST, Persistència I Estètica Hacker
#7 · PROMPTS UTILIZATS AMB IA
// Prompts Per Generar El Codi I La Documentació
Aquests són els tres prompts enviats a la IA per generar les diferents parts del projecte: el back-end, la interfície visual i la documentació tècnica. Per a cada prompt es mostra el resultat real retornat per la IA.
PROMPT 01
Servidor Web amb Flask + SQLite3 Natiu i Zero Dependències
▸ Back-End · Python + Flask + SQLite3 · PEP 8 · Anti-SQL Injection
Necessito que m’ajudis a fer el codi d’una app web bastant senzilla amb Python i Flask per a un treball de classe. Com que s’ha d’executar en un ordinador de l’escola on no tenim permisos d’administrador, no podem instal·lar llibreries grans com flask-sqlalchemy ni tampoc utilitzar servidors de bases de dades externs. Per això, el requisit indispensable és fer servir el mòdul natiu sqlite3 de Python per guardar-ho tot a nivell local amb zero dependències. El codi ha de quedar super net i ordenat seguint les normes de PEP 8. També necessito que hi hagi una funció automàtica per comprovar si el fitxer .db ja existeix, i si no, que crei una taula anomenada ‘participants’ amb els camps id i name. Pel que fa a les rutes, n’he de tenir una principal / per carregar i visualitzar tots els registres en una llista, i una altra ruta /add que rebi peticions POST per guardar nous usuaris assegurant que no es pugui fer cap injecció SQL. Si us plau, passa’m tant el codi del servidor de Python com el de la plantilla HTML per a la pantalla.
▸ RESULTAT — CODI PYTHON (app.py)
app.py · Flask + SQLite3
1 import os 2 import sqlite3 3 from flask import Flask, redirect, render_template, request, url_for 4 5 app = Flask(__name__) 6 DB_NAME = "dades.db" 7 8 def inicialitzar_base_dades(): 9 """Comprova si la base de dades existeix i crea la taula si cal.""" 10 if not os.path.exists(DB_NAME): 11 print(f"Creant la base de dades '{DB_NAME}'...") 12 conn = sqlite3.connect(DB_NAME) 13 cursor = conn.cursor() 14 cursor.execute( 15 """ 16 CREATE TABLE IF NOT EXISTS participants ( 17 id INTEGER PRIMARY KEY AUTOINCREMENT, 18 name TEXT NOT NULL 19 ) 20 """ 21 ) 22 conn.commit() 23 conn.close() 24 25 @app.route("/") 26 def index(): 27 """Ruta principal que llegeix i mostra tots els participants.""" 28 conn = sqlite3.connect(DB_NAME) 29 cursor = conn.cursor() 30 cursor.execute("SELECT id, name FROM participants") 31 llista_participants = cursor.fetchall() 32 conn.close() 33 return render_template("index.html", participants=llista_participants) 34 35 @app.route("/add", methods=["POST"]) 36 def add_participant(): 37 """Ruta per afegir un nou usuari de manera segura contra injecció SQL.""" 38 nom_usuari = request.form.get("name") 39 if nom_usuari and nom_usuari.strip(): 40 conn = sqlite3.connect(DB_NAME) 41 cursor = conn.cursor() 42 # Consultes parametritzades (?) per evitar injecció SQL 43 cursor.execute("INSERT INTO participants (name) VALUES (?)", (nom_usuari.strip(),)) 44 conn.commit() 45 conn.close() 46 return redirect(url_for("index")) 47 48 if __name__ == "__main__": 49 inicialitzar_base_dades() 50 app.run(debug=True, port=5000)
PROMPT 02
Plantilla HTML/CSS — Mode Fosc, Verd Neó, CSS Grid
▸ UI/UX · CSS Pur · Grid Layout · Estètica Gaming/Hacker
Escolta, em pots fer una plantilla d’HTML amb el CSS tot integrat en el mateix fitxer per fer-la servir amb el render_template de Flask? És per a una aplicació de registre d’escola i vull que es vegi molt bé però sense utilitzar cap framework extern com Bootstrap o Tailwind, només CSS pur i net dins de l’etiqueta <style>. Pel que fa a l’estil visual, m’agrada molt el rotllo tecnològic i minimalista amb un mode fosc total: el fons que sigui completament negre o fosc, amb detalls i la lletra principal en verd neó (#00ff66), i el text secundari en un blanc trencat. Organitza la pantalla tipus graella (“grid”) ben neta, on es vegi clarament a un costat el formulari per apuntar els nous participants i a l’altre costat la llista amb tots els que ja estan registrats.
▸ RESULTAT — PLANTILLA HTML (index.html) · Previsualització
PROMPT 03
Documentació Tècnica — Justificació Del Canvi Tecnològic
▸ Documentació · Arquitectura · Informe Tècnic · Portabilitat
Necessito que facis un text formal tipus informe tècnic d’arquitectura per posar a la memòria del meu projecte. Imagina que ets una enginyera de programari i redactora tècnica experta. Abans tenia un codi que utilitzava Flask, SQLAlchemy i MySQL amb models de dades ORM, però per culpa de les limitacions tècniques que tenim a les aules (els ordinadors de l’escola no ens deixen instal·lar paquets lliurement amb pip), ho he hagut de passar tot a Flask amb SQLite3 natiu. El document ha de portar com a títol exactament ‘Justificació del Canvi Tecnològic i Portabilitat’ i ha d’explicar bé aquests punts: com el fet d’usar el mòdul natiu redueix els problemes en el desplegament, la facilitat de distribuir el projecte en tenir la base de dades en un fitxer local, i com s’han complert tots els requisits sense perdre consistència de dades ni seguretat contra atacs d’injecció SQL.
▸ RESULTAT — INFORME TÈCNIC
Justificació del Canvi Tecnològic i Portabilitat
El present document descriu i justifica la migració tecnològica efectuada en el marc del projecte de registre escolar, passant d’una arquitectura basada en Flask + SQLAlchemy + MySQL a una solució completament nativa que utilitza Flask i el mòdul integrat
1. Reducció de problemes en el desplegament
L’ús del mòdul
2. Portabilitat i distribució simplificada
A diferència de MySQL, que requereix un servidor de base de dades en execució, SQLite emmagatzema tota la informació en un únic fitxer
3. Compliment de requisits sense pèrdua de consistència ni seguretat
La transició no ha comportat cap degradació funcional. La integritat de les dades es garanteix mitjançant les transaccions ACID pròpies de SQLite. Quant a la seguretat, s’han aplicat consultes parametritzades (placeholders
El present document descriu i justifica la migració tecnològica efectuada en el marc del projecte de registre escolar, passant d’una arquitectura basada en Flask + SQLAlchemy + MySQL a una solució completament nativa que utilitza Flask i el mòdul integrat
sqlite3 de Python 3.1. Reducció de problemes en el desplegament
L’ús del mòdul
sqlite3, inclòs en la biblioteca estàndard de Python des de la versió 2.5, elimina qualsevol dependència externa. Això suposa que no és necessari executar cap comanda pip install ni disposar de permisos d’administrador al sistema operatiu. En entorns escolars o corporatius restringits, on la instal·lació de paquets de tercers pot estar bloquejada per polítiques de seguretat, aquesta característica resulta decisiva per a la viabilitat del desplegament.2. Portabilitat i distribució simplificada
A diferència de MySQL, que requereix un servidor de base de dades en execució, SQLite emmagatzema tota la informació en un únic fitxer
.db al sistema de fitxers local. Això permet distribuir el projecte complet mitjançant una còpia del directori, sense configurar connexions de xarxa, credencials de servidor ni serveis addicionals. La portabilitat és total: qualsevol màquina amb Python 3 instal·lat pot executar l’aplicació de manera immediata.3. Compliment de requisits sense pèrdua de consistència ni seguretat
La transició no ha comportat cap degradació funcional. La integritat de les dades es garanteix mitjançant les transaccions ACID pròpies de SQLite. Quant a la seguretat, s’han aplicat consultes parametritzades (placeholders
?) en totes les operacions d’escriptura, prevenint de manera efectiva els atacs d’injecció SQL sense dependre de cap capa ORM externa. El resultat és un sistema equivalent en funcionalitat, més lleuger en dependencies i significativament més portable.
