From 19ddf35d786a322907e340afa455abf0e9474929 Mon Sep 17 00:00:00 2001 From: Lizeth Ramirez <167484531+LiizethRR@users.noreply.github.com> Date: Mon, 1 Jun 2026 19:09:01 -0600 Subject: [PATCH 1/3] README --- README.md | 215 ++++++++++++++++++++++++++++-------------------------- 1 file changed, 110 insertions(+), 105 deletions(-) diff --git a/README.md b/README.md index 1b9f5f3..a2f1421 100644 --- a/README.md +++ b/README.md @@ -1,136 +1,141 @@ -#

![Birthday](https://user-images.githubusercontent.com/73078636/193473544-ae5d7636-6bf5-4313-91cf-f5d627d31c72.png)

- - - -[![Open Source Love svg1](https://badges.frapsoft.com/os/v1/open-source.svg?v=103)](https://github.com/ellerbrock/open-source-badges/) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) ![first-timers-only](https://img.shields.io/badge/first--timers--only-friendly-yellow.svg?style=flat) ![contributions welcome](https://img.shields.io/static/v1.svg?label=Contributions&message=Welcome&color=0059b3&style=flat-square) -

-A beginner friendly project to help you in open source contributions. An attempt to bring Web Projects together. -**Please see the **Contributing Guidelines** .** -## Overview -The goal of this project is to help the beginners with their contributions in Open Source and to bring all the Web projects together. We aim to achieve this collaboratively, so feel free to contribute in any way you want, just make sure to follow the contribution guidelines. +## Student Contribution -## What is Open - Source? [![Open Source Love svg3](https://badges.frapsoft.com/os/v3/open-source.svg?v=103)](https://github.com/ellerbrock/open-source-badges/) -The open source community provides a great opportunity for aspiring programmers to distinguish themselves; and by contributing to various projects, developers can improve their skills and get inspiration and support from like-minded people. When you contribute to something you already know and love, it can have so much more meaning, because you know how the tool is used and the good it does for you. Being part of an open source community opens you up to a broader range of people to interact with. +### Developer Information +- **Name:** Ramírez Ramírez Lizeth +- **University:** Universidad Tecnológica (ING. Desarrollo y Gestión de Software) +- **Date:** 01 de Junio del 2026 -Read more about it here. +### Proposed Improvements +1. Implementar documentación interactiva con Swagger para facilitar el onboarding de nuevos desarrolladores. +2. Agregar tests automatizados de integración para el flujo multi-tenant. +3. Optimizar las consultas a MongoDB con índices compuestos en tenantId + timestamp. +4. Implementar un sistema de caché con Redis para reducir latencia en catálogos frecuentes. +5. Agregar un dashboard de monitoreo en tiempo real para administradores. +### Observations +Miga-Co nace de una necesidad real en LATAM: las pastelerías artesanales carecen de herramientas digitales accesibles. La plataforma resuelve este problema mediante un modelo SaaS multi-tenant con arquitectura limpia por capas. -## Let's Get Started: +--- -### Issue Creation -- Create an issue or if you want to work on an exisiting issue get it assigned to you first. -- **No PR's shall be accepted without issues been assigned.** -- Now, when you have got your issue assigned follow the steps below : +## Project Strengths (Actividad A) +1. **Arquitectura Limpia por Capas** + Separación clara entre Presentación, Aplicación, Dominio e Infraestructura. Esto facilita el mantenimiento, las pruebas unitarias y la evolución del sistema sin afectar capas externas. +2. **Modelo Multi-tenant con Aislamiento de Datos** + Uso del patrón *Shared Database con discriminador tenantId*. Cada pastelería tiene sus datos completamente separados a nivel lógico, con índices optimizados para consultas seguras y rápidas. -### Step 1. Create a Copy of this Repository -In order to work on an open-source project, you will first need to make your own copy of the repository. To do this, you should fork the repository and then clone it so that you have a local working copy. +3. **Stack Tecnológico Moderno y Escalable** + - **Backend:** Node.js + Express.js (asíncrono no bloqueante). + - **Frontend:** React 18 + Vite (SPA reactiva). + - **Base de datos:** MongoDB Atlas (esquema flexible, ideal para evolucionar sin migraciones complejas). + - **Contenedores:** Docker + Compose (entornos homogéneos). -> **Fork :fork_and_knife: this repo. Click on the Fork button at the top right corner.** +4. **Patrones de Diseño Aplicados Correctamente** + - *Middleware Chain (Express)*: Resolución de tenantId, validación JWT y logging como eslabones independientes. + - *Observer (React Context API)*: Theming dinámico por tenant sin sobrecarga. + - *Composite (React)*: Componentes reutilizables (ProductCard, TenantHeader) compartidos entre pastelerías. -With the repository forked, you’re ready to clone it so that you have a local working copy of the code base. +5. **Enfoque en un Problema Real del Mercado LATAM** + Las pastelerías artesanales no tienen herramientas digitales pensadas para su escala. Miga-Co llena ese vacío integrando catálogo visual, personalización de productos, pagos y logística en una sola plataforma. -> **Clone the Repository** +--- -To make your own local copy of the repository you would like to contribute to, let’s first open up a terminal window. +## Improvement Opportunities (Actividad B) -We’ll use the git clone command along with the URL that points to your fork of the repository. +1. **Migrar de Express.js a NestJS a Largo Plazo** + Aunque Express funciona y el equipo lo conoce bien, NestJS ofrece inyección de dependencias nativa, módulos dinámicos para multi-tenant y mejor estructura para equipos grandes. Podría planearse una migración gradual. -* Open the Command Prompt -* Type this command: +2. **Implementar Caché Distribuida con Redis** + Los catálogos de productos se consultan con frecuencia. Un caché Redis reduciría latencia y carga sobre MongoDB, especialmente en horarios pico (días festivos, temporadas altas). -``` -git clone https://github.com/your_username/WebArena -``` +3. **Agregar Tests Automatizados en Pipelines de CI/CD** + El proyecto carece de pruebas unitarias y de integración documentadas. Integrar Jest + Supertest en un pipeline de GitHub Actions mejoraría la confiabilidad antes de cada despliegue. -Screenshot 2022-10-04 at 2 53 53 AM +4. **Mejorar la Documentación de APIs con OpenAPI/Swagger** + Actualmente no hay documentación interactiva de los endpoints REST. Implementar `swagger-jsdoc` permitiría a nuevos desarrolladores entender rápidamente el contrato de la API. +5. **Implementar un Sistema de Logs Centralizado** + Con múltiples tenants, es difícil depurar errores específicos. Agregar Winston o Pino con transporte a servicios como Datadog o ELK facilitaría el monitoreo y la trazabilidad. +--- -### Step 2: Creating a New Branch -It is important to branch the repository so that you are able to manage the workflow, isolate your code, and control what features make it back to the main branch of the project repository. +## Technology Stack Table (Actividad C) -When creating a branch, it is very important that you create your new branch off of the master branch. -**To create a new branch, from your terminal window, follow:** +| Technology | Purpose | Version | +| :--- | :--- | :--- | +| **React 18** | Frontend SPA. UI reactiva con componentes reutilizables | 18.2.0 | +| **Vite** | Build tool y dev server. Bundling rápido y HMR | 4.x | +| **Node.js** | Entorno de ejecución para el backend | 18.x o superior | +| **Express.js** | Framework backend minimalista. API REST y middleware chain | 4.18.x | +| **TypeScript** | Tipado estático entre capas. Evita errores en tiempo de ejecución | 5.x | +| **MongoDB Atlas** | Base de datos NoSQL. Esquema flexible y discriminador tenantId | 6.x | +| **JWT + bcrypt** | Autenticación stateless con tenantId embebido | Latest | +| **Docker + Compose** | Contenedorización para entornos homogéneos (dev/prod) | Latest | +| **React Router DOM** | Enrutamiento del lado del cliente | 6.x | +| **Axios** | Cliente HTTP para consumo de API REST | 1.x | +--- -``` -git branch new-branch -git checkout new-branch -``` -Once you enter the git checkout command, you will receive the following output: +## Functional Requirements -``` -Switched to branch 'new-branch' -``` +| ID | Requisito Funcional | +| :--- | :--- | +| **RF-01** | El sistema deberá permitir el registro de pastelerías (tenants) con datos de negocio, dirección y configuración visual. | +| **RF-02** | El sistema deberá autenticar usuarios (dueños/empleados) mediante JWT con tenantId embebido en el token. | +| **RF-03** | El sistema deberá mostrar un catálogo de productos por tenant, con imágenes, descripción, precio y opciones de personalización. | +| **RF-04** | El sistema deberá permitir agregar productos al carrito de compras, calculando subtotales y aplicando descuentos si existen. | +| **RF-05** | El sistema deberá calcular el costo de envío en tiempo real basado en la dirección del cliente y la ubicación de la pastelería. | +| **RF-06** | El sistema deberá integrar una pasarela de pagos (Mercado Pago / Stripe) para procesar transacciones de forma segura. | +| **RF-07** | El sistema deberá permitir a los clientes rastrear el estado de su pedido (pendiente, confirmado, en preparación, en camino, entregado). | +| **RF-08** | El sistema deberá aislar los datos por tenant mediante un discriminador tenantId en cada colección de MongoDB. | +| **RF-09** | El sistema deberá aplicar la identidad visual de cada pastelería (colores, logo, tipografía) mediante Context API + CSS variables. | +| **RF-10** | El sistema deberá generar reportes de ventas por período (día, semana, mes) para que cada tenant pueda analizar su negocio. | +## Architecture Diagram (Actividad D) -### Step 3: Contribute -- Make relevant changes.Add new projects(make sure to put in the readme files in your folders). -- Contribute with any web project you feel like :) - -### Step 4: Commiting and Pushing: -Once you have modified an existing file or added a new file to the project, you can add it to your local repository, which we can do with the git add command. - -``` git add filename``` or ``` git add .``` - -You can type the command ```git add -A``` or alternatively ```git add -all``` for all new files to be staged. - - -**With our file staged, we’ll want to record the changes that we made to the repository with the ```git commit``` command.** -

The commit message is an important aspect of your code contribution; it helps the other contributors fully understand the change you have made, why you made it, and how significant it is.

- - ``` - git commit -m "commit message" - ``` - - - At this point you can use the ```git push``` command to push the changes to the current branch of your forked repository: - ``` - git push --set-upstream origin new-branch - ``` - -### Step 6: Create Pull Request -At this point, you are ready to make a pull request to the original repository. - -You should navigate to your **forked** repository, and press the “Compare & pull request” button on the page. -Screenshot 2022-10-04 at 3 21 21 AM - -GitHub will alert you that you are able to merge the two branches because there is no competing code. You should add in a **title**, a **comment**, and then press the **“Create pull request”** button. - - - Screenshot 2022-10-04 at 3 24 21 AM - - -### Step 7: CONGRATULATIONS :boom: :clap: :relaxed: -You have made it till the end. Kudos to you!! - -
- -### How to upload the files - -* Upload your folders with the corresponding files and a readme.md file. -* **Under no circumstances create new folders or directly upload files within the folders of other projects.** - -#### Please see the **Contributing Guidelines** . - -
- -## Please STAR :star2: this repository if you liked it and had fun :) - -### Maintainer! :blush: - - - - - -

Anadee

💻 🖋
-
- +```mermaid +graph TB + subgraph "Cliente (Browser)" + A[React SPA
Componentes + Context API] + end + + subgraph "Backend - Express.js" + B[Middleware Chain
CORS → Logger → tenantId → JWT] + C[Controladores
Producto, Pedido, Auth] + D[Servicios
Lógica de negocio] + E[Repositorios
Acceso a datos] + end + + subgraph "Infraestructura" + F[(MongoDB Atlas
Colecciones c/ tenantId)] + G[Docker Container
Node.js + Express] + end + + subgraph "Patrones de Diseño" + H[Middleware Chain
Chain of Responsibility] + I[Observer
React Context] + J[Composite
Componentes UI] + K[Singleton
Módulos compartidos] + end + + A -- "HTTP / JSON" --> B + B --> C + C --> D + D --> E + E --> F + G --> G + + style A fill:#61dafb,stroke:#20232a,stroke-width:2px + style B fill:#68a063,stroke:#333,stroke-width:2px + style F fill:#4db33d,stroke:#333,stroke-width:2px + style H fill:#ffc107,stroke:#333,stroke-width:1px + style I fill:#ffc107,stroke:#333,stroke-width:1px + style J fill:#ffc107,stroke:#333,stroke-width:1px + style K fill:#ffc107,stroke:#333,stroke-width:1px From de06efdecc279fbe8883f5d5e71b99a5784b51a3 Mon Sep 17 00:00:00 2001 From: Lizeth Ramirez <167484531+LiizethRR@users.noreply.github.com> Date: Mon, 1 Jun 2026 19:32:20 -0600 Subject: [PATCH 2/3] Pull request --- README.md | 25 +++++++++++++++++++++++++ 1 file changed, 25 insertions(+) diff --git a/README.md b/README.md index a2f1421..05fb3fa 100644 --- a/README.md +++ b/README.md @@ -98,6 +98,31 @@ Miga-Co nace de una necesidad real en LATAM: las pastelerías artesanales carece | **RF-09** | El sistema deberá aplicar la identidad visual de cada pastelería (colores, logo, tipografía) mediante Context API + CSS variables. | | **RF-10** | El sistema deberá generar reportes de ventas por período (día, semana, mes) para que cada tenant pueda analizar su negocio. | +# 📸 Evidencias de la Práctica + +## Evidencia 1: Fork del repositorio creado +image + + +## Evidencia 2: Configuración de remotos - `git remote -v` +Captura de pantalla 2026-06-01 185007 + + +## Evidencia 3: Ramas del proyecto - `git branch` +image + + +## Evidencia 4: Historial de commits - `git log --oneline` +image + + +## Evidencia 5: Pull Request creado +Captura de pantalla 2026-06-01 192558 + +## Evidencia 6: URL del Pull Request +https://github.com/LiizethRR/WebArena/pull/2 + + ## Architecture Diagram (Actividad D) ```mermaid From e56352eaff25183acf28b7f19c0a01abca5335c7 Mon Sep 17 00:00:00 2001 From: Lizeth Ramirez <167484531+LiizethRR@users.noreply.github.com> Date: Mon, 1 Jun 2026 19:41:39 -0600 Subject: [PATCH 3/3] reto --- README.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/README.md b/README.md index 05fb3fa..80022f1 100644 --- a/README.md +++ b/README.md @@ -122,6 +122,10 @@ Miga-Co nace de una necesidad real en LATAM: las pastelerías artesanales carece ## Evidencia 6: URL del Pull Request https://github.com/LiizethRR/WebArena/pull/2 +## Reto: +image + + ## Architecture Diagram (Actividad D)