{"id":31287863,"url":"https://github.com/lautaroorellano/keylabtech.com","last_synced_at":"2025-10-15T02:19:47.308Z","repository":{"id":316103874,"uuid":"1061988685","full_name":"LautaroOrellano/KeylabTech.com","owner":"LautaroOrellano","description":"Repositorio de demostración que muestra la arquitectura y estructura del backend y frontend del e-commerce KeyLab, incluyendo tecnologías utilizadas y flujo general de la aplicación.","archived":false,"fork":false,"pushed_at":"2025-09-22T17:38:39.000Z","size":23,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-09-22T18:49:33.364Z","etag":null,"topics":["cloudinary","docker","java","javascript","jwt-tokens","oracle-database","reactjs","render","springorm","supabase","vite"],"latest_commit_sha":null,"homepage":"","language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/LautaroOrellano.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-09-22T16:48:35.000Z","updated_at":"2025-09-22T17:38:42.000Z","dependencies_parsed_at":null,"dependency_job_id":"6be97946-88de-4822-a036-e161cbe1f65e","html_url":"https://github.com/LautaroOrellano/KeylabTech.com","commit_stats":null,"previous_names":["lautaroorellano/keylabtech.com"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/LautaroOrellano/KeylabTech.com","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LautaroOrellano%2FKeylabTech.com","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LautaroOrellano%2FKeylabTech.com/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LautaroOrellano%2FKeylabTech.com/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LautaroOrellano%2FKeylabTech.com/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/LautaroOrellano","download_url":"https://codeload.github.com/LautaroOrellano/KeylabTech.com/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LautaroOrellano%2FKeylabTech.com/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":276738449,"owners_count":25695914,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-09-24T02:00:09.776Z","response_time":97,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["cloudinary","docker","java","javascript","jwt-tokens","oracle-database","reactjs","render","springorm","supabase","vite"],"created_at":"2025-09-24T11:27:17.332Z","updated_at":"2025-10-15T02:19:47.284Z","avatar_url":"https://github.com/LautaroOrellano.png","language":null,"funding_links":[],"categories":[],"sub_categories":[],"readme":"# KeylabTech.com.ar\nRepositorio de demostración que muestra la arquitectura y estructura del backend y frontend del e-commerce KeyLab, incluyendo tecnologías utilizadas y flujo general de la aplicación.\nEs un proyecto de e-commerce fullstack que demuestra buenas prácticas de arquitectura y estructura de código profesional, mostrando cómo se organiza un backend con Spring Boot y un frontend moderno en React.\n\n## Tecnologías\n- **Backend:** Java, Spring Boot, Spring Security, JPA Hibernate, MySQL\n- **Frontend:** React, Tailwind, Vite\n- **Otros:** JWT, Docker, Render, Supabase, Cloudinary, Mercado Pago.\n\n## Arquitectura del proyecto\n\n             ┌─────────────┐\n             │ Frontend    │\n             │ React / Vite│\n             └─────┬───────┘\n                   │\n                   ▼\n             ┌─────────────┐\n             │ Backend     │\n             │ Spring Boot │\n             └─────┬───────┘\n                   │\n          ┌────────┴────────┐\n          │                 │\n          ▼                 ▼\n    ┌─────────────┐   ┌─────────────┐\n    │ MySQL DB    │   │ Servicios   │\n    │             │   │ Externos    │\n    │             │   │ -Cloudinary │\n    │             │   │ -MercadoPago│\n    │             │   │ -Supabase   │\n    └─────────────┘   └─────────────┘\n                         \n## Estructura del proyecto\n\n### Backend\n\n\u003cimg width=\"342\" height=\"1022\" alt=\"Captura de pantalla 2025-09-22 141258\" src=\"https://github.com/user-attachments/assets/150d38e6-c7f4-41e8-940d-d3a21c58facb\" /\u003e\n\n\n### Frontend \n\n\u003cimg width=\"331\" height=\"1000\" alt=\"Captura de pantalla 2025-09-22 140040\" src=\"https://github.com/user-attachments/assets/a268dd5c-ae82-4ab8-bc82-ed116c153fbb\" /\u003e\n\n---\n  \n## **Flujo de la aplicación / Ejemplo de uso**\nKeyLabTech es un e-commerce fullstack con arquitectura moderna, donde el **frontend en React** interactúa con el **backend en Java / Spring Boot** a través de endpoints REST bien definidos para usuarios, clientes y administradores.\n  \n**Flujo general:**\n1. El usuario interactúa con la aplicación en React (navegación de productos, carrito, checkout).\n2. El frontend realiza peticiones a los **controllers del backend**, los cuales procesan la lógica de negocio y gestionan la persistencia en la base de datos.\n3. El backend valida usuarios con JWT y maneja la seguridad de cada endpoint según el rol (usuario, cliente, admin).\n4. El backend y frontend están desplegados en la nube:\n   - **Frontend:** Vercel\n   - **Backend:** Render / Oracle / Supabase\n5. Se consumen APIs externas para funcionalidades clave:\n   - **Pagos:** Mercado Pago, PayPal\n   - **Almacenamiento de archivos e imágenes:** Cloudinary\n6. La aplicación incluye buenas prácticas profesionales:\n   - Estructura modular y escalable\n   - Manejo de logs para backend y frontend\n   - Testeo unitario y de integración en ambas capas\n   - Gestión de errores y validaciones consistentes\n7. La arquitectura permite escalabilidad futura y facilita integración con nuevos servicios y microservicios.\n\n\u003e ⚠️ Todas las interacciones mostradas en el proyecto utilizan datos ficticios para proteger información sensible.\n\n## Por qué estas tecnologías\n\n- **Spring Boot:** rápido desarrollo y robustez para APIs.\n- **React + Vite:** SPA moderna y eficiente.\n- **JWT:** seguridad en autenticación.\n- **Docker:** despliegue reproducible.\n\n## Capturas de la app en funcionamiento\n\n### Home\n\n\u003cimg width=\"1917\" height=\"934\" alt=\"Captura de pantalla 2025-09-22 142223\" src=\"https://github.com/user-attachments/assets/29c4bc5e-fa82-4932-ad14-3e350650f40d\" /\u003e\n\n### Carrito\n\n\u003cimg width=\"1912\" height=\"931\" alt=\"Captura de pantalla 2025-09-22 142313\" src=\"https://github.com/user-attachments/assets/78d93bfd-f19a-4fc7-a409-2764509175bc\" /\u003e\n\n### Panel Admin\n\n\u003cimg width=\"1916\" height=\"935\" alt=\"Captura de pantalla 2025-09-22 142405\" src=\"https://github.com/user-attachments/assets/70df1e0c-4597-40cc-89b0-e40f19693dcb\" /\u003e\n\nLas capturas muestran la interfaz de KeyLab con datos ficticios para proteger información sensible.\n\n## Licencia y variables de entorno\n\n- El código completo se mantiene privado por motivos de seguridad ⚠️.\n- Se incluye `.env.example` para mostrar qué variables de entorno se necesitan.\n- Este proyecto está protegido y no se permite uso comercial sin autorización.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flautaroorellano%2Fkeylabtech.com","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flautaroorellano%2Fkeylabtech.com","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flautaroorellano%2Fkeylabtech.com/lists"}