Módulos de software codificados
APRENDIZ
Glorimar Alexandra Prieto Dos Ramos
INSTRUCTOR
Alex Eduardo Zambrano
Módulos de software codificados y probados
1
TABLA DE CONTENIDO
Introducción ................................................................................................................. 3
Código de los componentes de la interfaz de la app. ............................................... 4,5
Código de los componentes de la página Home Inicial....................................... 6,7,8,9
Código de backend y conexión a la base de datos ...................................... 10,11,12,13
Testing de la estructura de registro e inicio de sesión .......................................... 14,15
Conclusión .................................................................................................................. 16
2
INTRODUCCIÓN
Este proyecto consiste en una aplicación web desarrollada con [Link] y Express en el backend,
utilizando MongoDB como base de datos para gestionar los usuarios. Su objetivo principal es
implementar un sistema de autenticación y operaciones CRUD para usuarios, utilizando JWT para
generar tokens de autenticación y bcrypt para el manejo seguro de contraseñas. Además, se ha
implementado la funcionalidad de mostrar mensajes de confirmación al usuario, como "registro
exitoso" al registrarse y "inicio de sesión exitoso" al autenticarse. El proyecto también utiliza CORS
para permitir la interacción entre el backend y el frontend.
3
Estructura de los Componentes que Construyen la Interfaz de mi Aplicación
"Accounting SC"
Se uso React porque es una biblioteca súper
popular para construir interfaces de
usuario. Su enfoque basado en
componentes me permite dividir la
aplicación en partes más pequeñas y
manejables. Esto hace que el código sea
más fácil de entender y mantener.
Los componentes son como bloques de
construcción de mi aplicación. Cada uno
tiene su propia funcionalidad y estilo, lo que
me permite reutilizarlos en diferentes
partes del proyecto sin tener que reescribir
código. Esto no solo ahorra tiempo, sino
que también garantiza que mi aplicación
sea más coherente y organizada. Al final,
usar React y sus componentes me ayuda a
crear aplicaciones más rápidas y eficientes.
4
5
PAGINA HOME DE INICIO: Esta separada por siete componentes que son:
6
7
8
9
Configuración del servidor ([Link]): Se configura Express para crear el servidor, conectarse a
MongoDB, y gestionar JSON mediante bodyParser. También se define el uso de CORS para permitir
solicitudes desde el frontend.
Conexión a MongoDB: El servidor se conecta a la base de datos MongoDB local (localhost:27017)
mediante Mongoose, asegurando que los datos de los usuarios sean almacenados correctamente.
Se verifica el éxito de la conexión mostrando mensajes en consola.
Autenticación y registro ([Link])
Registro de usuarios: Si el usuario no está registrado, se guarda en la base de datos con la
contraseña encriptada. Tras el registro, se genera un token JWT y se envía un mensaje de
confirmación "registro exitoso".
Inicio de sesión: Al ingresar correctamente las credenciales, se genera un token JWT y se envía el
mensaje "inicio de sesión exitoso".
Modelo de Usuario ([Link]): Define el esquema para los usuarios en MongoDB, con nombre,
email y contraseña como campos obligatorios.
Rutas ([Link]): Las rutas están configuradas para manejar el registro, inicio de sesión y
las operaciones CRUD de los usuarios. Estas rutas están vinculadas a los controladores, que
ejecutan la lógica correspondiente.
10
authController: Aquí se encuentran las funciones que manejan la lógica de autenticación y
gestión de usuarios y Generar Token JWT.
11
usuarioController: Aquí se definen las rutas para manejar las operaciones de autenticación y
CRUD de usuarios.
12
[Link]: Se define cómo se almacenan los datos de los usuarios en MongoDB.
authRoutes: Se Importa las rutas para las operaciones de autenticación y CRUD de usuarios.
13
Registro exitoso.
Error tienes que llenar todos los campos que están vacíos.
14
Correo no existe
Contraseña incorrecta.
15
CONCLUSIÓN
Este proyecto no solo implementa un sistema de autenticación robusto con JWT y bcrypt, sino que
también mejora la experiencia del usuario mediante la presentación de mensajes de confirmación
después de acciones importantes como el registro y el inicio de sesión. Esto permite una
interacción más clara y satisfactoria entre los usuarios y el sistema. Además, la arquitectura
modular y la integración con MongoDB ofrecen una base sólida para ampliar las funcionalidades
en el futuro.
16