Skip to content

ahroncich7/Sas

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

| SAS Site       badge

Sitio web para emprendimiento de la marca SAS Cerámica


| Índice  🔍



| Introducción  📋

Se decidió desarrollar una app que hiciera de API, manejando endpoints para permitir tanto el CRUD de productos en una base de datos como la visualización del sitio en si mismo.

| Tecnologías usadas  🧰


    NodeJS

    Express.js

    MySQL

    Bootstrap


| Implementación    ⚒


Se necesitaba de una base de datos donde se pudieran guardar los productos y sus caracteristicas, y que permitiera la consulta de los mismos tanto por categoría como por disponibilidad (en stock) para luego ser "pintados" por el front-end.

La base de datos fue creada utilizando MySQL


image


Se decidió estructurar la implementación de la API con un modelo Model-Routes-Controller. El router recibe las peticiones y llama a los métodos de los controladores.

No se utilizó un ORM sino el driver mysql disponible a través de NPM. Por lo tanto, en éste caso el modelo sirve de conector con la base de datos, y expone los métodos que permiten realizar el CRUD desde Node.


modelo


Se utilizaron los middlewares express.JSON() y express.urlencoded() para parsear las peticiones que llegan por HTTP del cliente.


| Utilización   ✍


Ejemplos:

GET/listAll 🠮 Devuelve array de todos los productos

GET/listByType 🠮 Devuelve array de los productos de una categoría en particular (que viaja en el body de la petición)

GET/listCategory 🠮 Devuelve array con las categorías de la tabla CATEGORÍA

GET/listInStock 🠮 Devuelve array con los productos cuyo campo stock es 1 (true)

POST/insertProduct 🠮 Inserta fila en la tabla PRODUCTOS

PUT/updateProduct 🠮 Modifica un registro por identificado por el ID(que viaja en el body de la petición)

DELETE/deleteProduct 🠮 Elimina de la tabla PRODUCTOS un registro identificado por el ID (que viaja en el body de la petición).


| Front-End   💻


Con el fin de hacer públicos los productos de la marca y brindar una herramienta de difusión de la misma, se utilizaron los datos provistos por la API creada para alimentar la estructura de un front-end sencillo, con estilos definidos con hojas de CSS y Bootstrap.


image


También se hizo uso de un apartado de administrador con un formulario que permite dar de alta nuevos productos en la base de datos, como así también modificar y eliminar registros. Para acceder al mismo, no obstante, es necesario ingresar la contraseña correcta.


image


| Conclusión   📜


Éste es un proyecto en desarrollo y por lo tanto pueden observarse algunos bugs y errores en varias partes del código.

Sin embargo, la app cumple con los objetivos planteados para ésta primera etapa de desarrollo y puede ser desplegada para el uso doméstico que se le pretende dar en lo inmediato.


Autor: Alejandro Hroncich - Desarrollador Web Trainee

Linkedin: https://www.linkedin.com/in/alejandro-hroncich/