Desarrollo de software: Validación de formularios, guardar en base de datos, registro de usuarios, login y sesiones.
Tutorial 1102
1102 Descargar XAMPP y Crear la base de datos en PHPMyAdmin
1102 Descargar XAMPP y Crear la base de datos en PHPMyAdmin
https://www.youtube.com/watch?v=0AVBzdU-PCY
1102 Tutorial 1 Registro e Inicio de Sesión Octubre 18
1102 Tutorial 2 Leer Base de Datos Octubre 18
1102 Tutorial 4 Guardar en la base de datos Octubre 26
1102 Tutorial 5 Guardar en la Base de Datos SIN formulario (Ajax) Octubre 27
https://www.youtube.com/watch?v=_w3IWC0V1kg
1. Crear el sistema de archivos del proyecto y copiar los archivos descargados en las carpetas css y js:
2. Ahora se crea la base de datos:
Base de datos: lectorm Tabla: users
3. En la carpeta de conexion, crear el archivo conxion.php y en la carpeta base del proyecto, crear el archivo index.php
Archivos: conexion/conexion.php e index.php
4. El archivo index.php utiliza el archivo funciones.js para validar la información digitada por el usuario:
archivo js/funciones.js
5. Para validar el acceso el archivo funciones.js utiliza el archivo ajaxValidaLogin_usu.php
Archivo ajaxValidaLogin_usu.php
Si el el usuario y/o contraseña son incorrectos envían un mensaje de error, en caso contrario crea la sesión del usuario y permite el acceso al resto del sitio web.
6. Para crear un nuevo usuario, en la carpeta usuarios se crea el archivo index.php
Archivo para crear el formulario de registro usuarios/index.php
7. Para validar los datos del formulario se utiliza el archivo usuarios.js
Archivo para validar el formulario js/usuraios.js
8. Como en los requerimientos se solicita que el acceso de los usuarios se debe realizar por medio del correo electrónico, se debe verificar que otra persona no esté registrada con ese mismo correo electrónico. Para esta tarea el archivo js/usuarios.js utiliza el archivo ajaxValidateEmail_usu.php y genera un mensaje de error si el correo ya existe.
Archivo usuarios/ajaxValidateEmail_usu.php para verificar si un correo ya se encuentra registrado en la base de datos.
9. Una ves se completa el registro del usuario, el archivo ins_usuarios.php registra (INSERT) en la base de datos el nuevo usuario.
El archivo usuarios/ins_usuarios.php procesa la información del formulario.
10. En el paso 5, línea 25 a 29 del archivo ajaxValidaLogin_usu.php se creó una sesión de usuario. Es importante verificar en todas las páginas que este es un usuario registrado, de lo contrario se debe redirigir a la página inicial del portal para que escriba su usuario y contraseña. Al terminar de navegar se debe cerrar la sesion.
Archivos pag1/index.php y logout.php
Se necesita crear un registro de nuevos usuarios y validar su ingreso a un portal web, se va a utilizar el correo electrónico para el acceso de los usuarios, por este motivo debe ser único. Para esta tarea se requiere crear una base de datos, validar los campos de los formularios y hacer control de la sesión de los usuarios al ingresar al portal web.
Archivos disponibles para descarga en el repositorio Manzanerista:
https://github.com/ietmanzaneristas/1102_form_login_database
Clic en botón verde Clone or download y descargar el ZIP.
NOTA: Este mismo método puede ser utilizado en los proyectos de software que actualmente realizan para el técnico del Sena.
Herramientas:https://github.com/ietmanzaneristas/1102_form_login_database
Clic en botón verde Clone or download y descargar el ZIP.
NOTA: Este mismo método puede ser utilizado en los proyectos de software que actualmente realizan para el técnico del Sena.
- Servidor web local XAMPP Server: https://www.apachefriends.org/es/download.html
- Editor de código Visual Studio Code: https://code.visualstudio.com/
- Librería JQuery para JavaScript: https://jquery.com/download/
- Plugin Validate para JQuery: https://jqueryvalidation.org/
- Archivo de estilos para maquetado responsive design Flexbox Grid: http://flexboxgrid.com/
1. Crear el sistema de archivos del proyecto y copiar los archivos descargados en las carpetas css y js:
| 📂formlogindb 📂conexion 📄conexion.php 📂css 📄estilos.css 📄flexboxgrid.css 📂img 📂inicio 📂js 📄additional-methods.min.js 📄funciones.js 📄jquery.validate.min.js 📄jquery-3.4.1.min.js 📄usuarios.js 📄validateES.js 📂pag1 📂usuarios 📄ajaxValidaLogin_usu.php 📄index.php 📄logout.php |
|
2. Ahora se crea la base de datos:
Base de datos: lectorm Tabla: users
3. En la carpeta de conexion, crear el archivo conxion.php y en la carpeta base del proyecto, crear el archivo index.php
Archivos: conexion/conexion.php e index.php
4. El archivo index.php utiliza el archivo funciones.js para validar la información digitada por el usuario:
archivo js/funciones.js
5. Para validar el acceso el archivo funciones.js utiliza el archivo ajaxValidaLogin_usu.php
Archivo ajaxValidaLogin_usu.php
Si el el usuario y/o contraseña son incorrectos envían un mensaje de error, en caso contrario crea la sesión del usuario y permite el acceso al resto del sitio web.
6. Para crear un nuevo usuario, en la carpeta usuarios se crea el archivo index.php
Archivo para crear el formulario de registro usuarios/index.php
7. Para validar los datos del formulario se utiliza el archivo usuarios.js
Archivo para validar el formulario js/usuraios.js
8. Como en los requerimientos se solicita que el acceso de los usuarios se debe realizar por medio del correo electrónico, se debe verificar que otra persona no esté registrada con ese mismo correo electrónico. Para esta tarea el archivo js/usuarios.js utiliza el archivo ajaxValidateEmail_usu.php y genera un mensaje de error si el correo ya existe.
Archivo usuarios/ajaxValidateEmail_usu.php para verificar si un correo ya se encuentra registrado en la base de datos.
9. Una ves se completa el registro del usuario, el archivo ins_usuarios.php registra (INSERT) en la base de datos el nuevo usuario.
El archivo usuarios/ins_usuarios.php procesa la información del formulario.
10. En el paso 5, línea 25 a 29 del archivo ajaxValidaLogin_usu.php se creó una sesión de usuario. Es importante verificar en todas las páginas que este es un usuario registrado, de lo contrario se debe redirigir a la página inicial del portal para que escriba su usuario y contraseña. Al terminar de navegar se debe cerrar la sesion.
Archivos pag1/index.php y logout.php
Charles Richard Torres Moreno
Ing. Electrónico Mg. Ingeniería Software
Docente IET Francisco Manzanera Henríquez
Comentarios
Publicar un comentario