Modelo MVC , creación de los Modelos , Controladores y Rutas

 En la entrada anterior comenzamos con el Modelo , ahora vamos a construir el controlador 

Para poder comenzar con la gestion de las colecciones entradas y comentarios, necesitaremos varios pasos.







Como se puede ver en el gráfico anterior el controlador interactua con las otras dos capas , el modelo y la vista , aquí ya comenzaremos a ver el trabajo duro del backend  por así decirlo 

Vamos a comenzar a crear la estructura con las carpetas models-controllers-routers

Paso1 Vamos a crear la carpeta models y los archivos js usuario entrada y comentario.



Paso 2 Vamos a crear la Carpeta controllers y archivos js usuario , entradas y comentarios




Paso 3 Creamos la carpeta routers


Paso 4 Comenzaremos creando la colección usuario


// models/Usuario.js
import mongoose from 'mongoose';

const usuarioSchema = new mongoose.Schema({
name: {
type: String,
required: true,
trim: true
},
email: {
type: String,
required: true,
trim: true,
unique: true
},
password: {
type: String,
required: true
}
},
{
timestramps: true //Se agrega fecha de creacion documento
});
export default mongoose.model('Usuario', usuarioSchema);

se crearan los campos nombre , email y password y se le coloca adicional timestramps
para que ingrese la fecha de creacion del documento 

Paso 5 Agregamos código en usuario.controller.js para adicionar 


import Usuario from '../models/usuario.js'

// Función para agregar un nuevo artículo
export const register = async (req, res) => {
try {
const {name, email, password} = req.body
//Creamos el objeto Usuario
const nuevoUsuario = new Usuario({
name,
email,
password
});

console.log(nuevoUsuario);

await nuevoUsuario.save();//Se guarda

res.send('Registro Guardado')
} catch (error) {
res.status(500).json({ error: 'Error al agregar el registro' });
}
}


En este código se puede observar que se crea una funcion async , se adiciona a register, dentro de esta se reciben datos a través de req.body, se crea primero un objeto nuevoUsuario  se guardan estos con await nuevoUsuario.save() ,se muestra por consola

Paso 6 Agregamos código al el archivo usuarios.router.js

import {Router} from "express";
import { register, login } from "../controllers/usuario.controller.js";

const router = Router();

router.post("/register", register);

export default router;


Se inicia con la ruta register, que es la que se encargara de comunicarse con el controlador usuario.controller.js para ingresar usuarios

Paso 7 Se agrega la ruta en app.js

import express from 'express';
import morgan from 'morgan';
import usuarioRouter from './routers/usuarios.router.js'

const app = express();


app.use(morgan('dev'));
app.use(express.json());//que reconozca formato json

//se llama rutras
app.use('/home',usuarioRouter);

// Configuración de rutas y middlewares
app.use(express.urlencoded({ extended: false }));


export default app

Se importa con

import usuarioRouter from './routers/usuarios.router.js'

Y se agrega 

//se llama rutras
app.use('/home',usuarioRouter);

Paso 8 vamos a probar si funciona 

Para hacer las pruebas de como va funcionando nuestro backend no necesariamente debemos tener una interfaz o Frontend, podemos instalar dos extensiones den visual studio

Thunder Client : Que nos sirve para ingresar datos





MongoDB : Que podemos visualiza nuestra información 



{
"_id": {
"$oid": "652ff5043664315c8876ad1d"
},
"name": "Juan",
"email": "juan@gmail.com",
"password": "1234",
"createdAt": {
"$date": "2023-10-18T15:08:52.243Z"
},
"updatedAt": {
"$date": "2023-10-18T15:08:52.243Z"
},
"__v": 0
}

Aparece los datos ingresados y la fecha de creación y modificación

Hacemos el git add y commit

Por el momento dejaremos aqui en la proxima entrada listaremos los registros guardados.


Comentarios