Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/brandonvergara1220-del/Mini-Proyecto-Backend-NodeJS/llms.txt

Use this file to discover all available pages before exploring further.

The index.html file is the only user-facing interface in Mini Proyecto Backend NodeJS. It renders a simple registration form for Tienda Parque 100 — a store registration page — that collects a visitor’s first and last name and submits them to the Node.js backend for processing. No JavaScript framework, build tool, or stylesheet is involved; the file is plain HTML that any browser can render directly.

​
Full Source

<!DOCTYPE html>
<html lang="es">    
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Formulario ejemplo</title>
    </head>
    <body>
      <h1>Registro Tienda Parque 100</h1>
        <form action="recuperardatos" method="post">
          <div>
              <label for="nombre">Nombre:</label>
              <br>
              <input type="text" id="nombre" name="nombre">
          </div>
        
          <div>
              <label for="apellido">Apellido:</label>
              <br>
              <input type="text" id="apellido" name="apellido">
          </div>
          <button type="submit">Enviar</button>
      </form>
    
    </body>
</html>

​
Form Element: action and method

The <form> tag carries two attributes that control where and how the data is sent when the user clicks Enviar:
AttributeValueMeaning
action"recuperardatos"The relative URL the browser will submit to. Because this page is served from the Node.js server root, the full request path becomes POST /recuperardatos. The server must define a route handler for this path.
method"post"Instructs the browser to send an HTTP POST request. Form field values are placed in the request body rather than appended to the URL as query parameters, which is the conventional choice for data that will be stored in a database.

​
Form Fields

The form contains two text inputs, each paired with a <label> for accessibility:

​
nombre — First Name

<label for="nombre">Nombre:</label>
<input type="text" id="nombre" name="nombre">
  • name="nombre" — This is the key used in the POST body. When server.js is implemented with a body parser, the submitted value will be accessible as req.body.nombre (or equivalent depending on the parsing library used).
  • type="text" — Accepts any string input with no browser-side format validation.
  • id="nombre" / for="nombre" — Links the label to the input so clicking the label text focuses the field.

​
apellido — Last Name

<label for="apellido">Apellido:</label>
<input type="text" id="apellido" name="apellido">
  • name="apellido" — Will be accessible as req.body.apellido once the server-side body parser is implemented.
  • Same type, id, and label pattern as nombre.

​
How Form Data Reaches the Server

When the user clicks Enviar, the browser serialises the two inputs into application/x-www-form-urlencoded format and sends a POST request: 
POST /recuperardatos HTTP/1.1
Content-Type: application/x-www-form-urlencoded

nombre=Maria&apellido=Garcia
The request is directed at the POST /recuperardatos route because that is the value of the form’s action attribute. The Node.js server.js file — currently empty and awaiting implementation — is where the route handler for this path will be defined. Once implemented, the handler will parse the URL-encoded body to extract nombre and apellido, then use the conexion module to persist the data to the ejemploformulario MySQL database.
Extending the form is straightforward — add more <input> elements inside the <form> tag and give each a unique name attribute. Common additions for a store registration form include:
<!-- Email address -->
<label for="correo">Correo electrónico:</label>
<input type="email" id="correo" name="correo">

<!-- Phone number -->
<label for="telefono">Teléfono:</label>
<input type="tel" id="telefono" name="telefono">
Each new name value will appear as a matching key in the POST body, and the corresponding database table column should be added to the ejemploformulario schema to store it.

Build docs developers (and LLMs) love

Get started for freeTalk to us