Hem creat un formulari de registre per a la LAN Party utilitzant HTML senzill i validacions bàsiques integrades directament als inputs. El nostre objectiu era assegurar que totes les dades essencials s’introduïssin correctament abans d’enviar-les a la base de dades.

Per aconseguir-ho, hem utilitzat el nostre propi codi, on cada camp està configurat amb un tipus específic (text, email, tel, etc.) i amb l’atribut required, que impedeix continuar si falta alguna dada obligatòria.

  • Els camps essencials no es poden deixar buits, perquè tots tenen required.
  • El camp del correu electrònic només accepta formats vàlids gràcies al tipus email.
  • El camp del telèfon utilitza tel, que ajuda a evitar errors de format.
  • Els dies d’assistència es gestionen amb checkboxes, permetent seleccionar més d’un dia.
  • Les intoleràncies es recullen amb un textarea per permetre respostes més llargues.
<form method="POST">
    <input type="text" name="nom" placeholder="Nom" required>
    <input type="text" name="cognoms" placeholder="Cognoms" required>
    <input type="text" name="nickname" placeholder="Nom d'usuari" required>
    <input type="email" name="email" placeholder="Correu electrònic" required>
    <input type="tel" name="telefon" placeholder="Telèfon" required>
    <input type="text" name="dni" placeholder="DNI / NIE" required>

    <div class="days-group">
        <label><input type="checkbox" name="dies" value="10"> Dia 10</label>
        <label><input type="checkbox" name="dies" value="11"> Dia 11</label>
        <label><input type="checkbox" name="dies" value="12"> Dia 12</label>
    </div>

    <textarea name="intolerancies" rows="2" placeholder="Intoleràncies o al·lèrgies..."></textarea>

    <button type="submit">Finalitzar Registre</button>
</form>

També hem creat un formulari senzill per entrar al panell d’administració. Aquí utilitzem el tipus password perquè la contrasenya es mostri oculta.

Això garanteix una entrada més segura i evita que la contrasenya sigui visible mentre s’escriu.

<form method="POST">
    <input type="text" name="user" placeholder="Usuari" required>
    <input type="password" name="pass" placeholder="Contrasenya" required>
    <button type="submit">ENTRAR</button>
</form>

Per guardar totes les dades enviades pel formulari, hem configurat una base de dades SQLite. El nostre codi comprova si la taula existeix i, si no, la crea automàticament.

def init_db():
    with sqlite3.connect(DB_NAME) as conn:
        conn.execute('''
            CREATE TABLE IF NOT EXISTS assistents (
                id INTEGER PRIMARY KEY AUTOINCREMENT,
                nom TEXT NOT NULL,
                cognoms TEXT NOT NULL,
                nickname TEXT NOT NULL,
                email TEXT NOT NULL,
                telefon TEXT NOT NULL,
                dni TEXT NOT NULL,
                dies TEXT NOT NULL,
                intolerancies TEXT
            )
        ''')

Crea una taula coherent amb els camps del formulari.

Garanteix que tots els camps importants siguin NOT NULL.

Permet guardar múltiples dies d’assistència en un sol camp.

Manté totes les dades organitzades i llestes per consultar des del panell d’administració.