{"id":24404172,"url":"https://github.com/miguelolmop/quicktask","last_synced_at":"2025-12-30T22:57:22.169Z","repository":{"id":267972521,"uuid":"902925269","full_name":"MiguelOlmoP/QuickTask","owner":"MiguelOlmoP","description":"Aplicación web para gestionar tareas, permitiendo crear, editar y eliminar tareas con descripción, prioridad y fecha programada. Desarrollada con React (frontend) y Laravel (backend), comunicados mediante REST API. Incluye autenticación de usuarios con JWT y almacenamiento en MySQL.","archived":false,"fork":false,"pushed_at":"2025-02-13T16:32:42.000Z","size":473,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-13T17:23:11.633Z","etag":null,"topics":["api-rest","bootsrap","css","google-auth","html","javascipt","jwt-authentication","laravel","mysql-database","react","react-bootstrap","react-datepicker","react-toastify"],"latest_commit_sha":null,"homepage":"","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/MiguelOlmoP.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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}},"created_at":"2024-12-13T14:53:44.000Z","updated_at":"2025-02-13T16:32:46.000Z","dependencies_parsed_at":null,"dependency_job_id":"877099e4-11a4-4ce1-b39d-c142dc547159","html_url":"https://github.com/MiguelOlmoP/QuickTask","commit_stats":null,"previous_names":["miguelolmop/quicktask"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MiguelOlmoP%2FQuickTask","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MiguelOlmoP%2FQuickTask/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MiguelOlmoP%2FQuickTask/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MiguelOlmoP%2FQuickTask/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/MiguelOlmoP","download_url":"https://codeload.github.com/MiguelOlmoP/QuickTask/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243364946,"owners_count":20279211,"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","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":["api-rest","bootsrap","css","google-auth","html","javascipt","jwt-authentication","laravel","mysql-database","react","react-bootstrap","react-datepicker","react-toastify"],"created_at":"2025-01-20T04:00:33.669Z","updated_at":"2025-12-30T22:57:22.164Z","avatar_url":"https://github.com/MiguelOlmoP.png","language":"PHP","readme":"# QuickTask\nQuickTask es una aplicación web diseñada para gestionar tareas de manera eficiente y visual. Permite a los usuarios añadir tareas con una descripción, prioridad (alta, media, baja), y una fecha y hora programadas. Además, los usuarios pueden registrarse e iniciar sesión, tanto mediante Google como con una cuenta propia, utilizando autenticación basada en JWT para asegurar sus datos y acceso.\n\n### 📝 Características principales:\n\n* **Creación de tareas:** Añade nuevas tareas con una descripción, prioridad y fecha personalizada.\n* **Edición:** Modifica tareas existentes de manera sencilla.\n* **Eliminación:** Confirma antes de eliminar una tarea con un modal interactivo.\n* **Visualización intuitiva:** Muestra las tareas en tarjetas organizadas, con colores distintivos para cada nivel.\n* **Gestión de usuarios:** Crea nuevos usuarios, tanto a través de Google como mediante un registro propio en la plataforma.\n\n\n### 🔧 Tecnologías utilizadas:\n\n* **React y Vite** para el desarrollo frontend.\n* **DatePicker** para la selección de fechas y horas.\n* **React-Select** para la elección de prioridades.\n* **React-Bootstrap** para implementar modales interactivos.\n* **React-Toastify** para notificaciones visuales.\n* **Laravel** para el desarrollo backend.\n* **JWT** para la gestión de autenticación de usuarios.\n* **Autenticación con Google:** Integración con la API de Google para permitir el registro e inicio de sesión.\n\n## 📌 Instalación y Configuración\n\n\u003cdetails\u003e\n\u003csummary\u003e⚙️ Ver configuración\u003c/summary\u003e\n\n  ### 🖥️ Configuración del __Backend__:\n\n  ```\n    1. Copia el archivo de configuración del ejemplo (.env.example) y renómbralo a (.env)\n\n    2. En el archivo .env, completa los siguientes valores:\n\n        -\u003e DB_CONNECTION=mysql\n        -\u003e DB_HOST=127.0.0.1\n        -\u003e DB_PORT=3306\n        -\u003e DB_DATABASE=nombre_de_base_de_datos\n        -\u003e DB_USERNAME=root\n        -\u003e DB_PASSWORD=\n\n        -\u003e JWT_SECRET: Clave secreta para generar los tokens JWT. \n        -\u003e JWT_ALGO: Algoritmo utilizado para firmar los tokens JWT (por defecto HS256).\n\n        -\u003e GOOGLE_CLIENT_ID: ID de cliente de Google obtenido en la consola de Google Cloud.\n        -\u003e GOOGLE_CLIENT_SECRET: Clave secreta del cliente de Google.\n        -\u003e GOOGLE_REDIRECT_URI: URL de redirección configurada en Google para la autenticación.\n\n    3. Instalar y configurar JWT (si no está instalado)\n\n        -\u003e composer require tymon/jwt-auth  \n        -\u003e php artisan vendor:publish --provider=\"Tymon\\JWTAuth\\Providers\\LaravelServiceProvider\"  \n        -\u003e php artisan jwt:secret   \n\n    4. Configuracion de Google\n\n        -\u003e Debes ir a la consola de Google Cloud y crear un proyecto.\n        -\u003e Habilita la API de autenticación de Google.\n        -\u003e Obtén el Client ID y Client Secret en la sección de Credenciales.\n        -\u003e Luego, agrega esos valores en el archivo .env bajo las variables GOOGLE_CLIENT_ID y GOOGLE_CLIENT_SECRET.\n        -\u003e Configurar la URL de redirección (GOOGLE_REDIRECT_URI) para que apunte a la ruta de tu aplicación donde recibirás la respuesta de Google después de la autenticación.\n  ```\n\n### 🎨 Configuración del __Frontend__:\n\n  ``` \n    Debes modificar el archivo config.js con tus datos.\n  ```\n\n\u003c/details\u003e\n  \n## 🔄 Cambios por versión\n\n**Versión 1.0**\n\n* Implementación básica de la aplicación con las funcionalidades principales:\n    - Crear, editar y eliminar tareas.\n    - Guardado de tareas en LocalStorage para garantizar persistencia entre sesiones.\n    - Visualización de tareas organizadas en tarjetas con colores según la prioridad.\n    - Validaciones:\n        + La fecha de la tarea debe ser posterior a la fecha actual.\n        + No se permite guardar tareas sin texto en el campo de descripción.\n\n\n**Versión 2.0**\n\n* Refactorización del proyecto: División del código en múltiples componentes para mejorar la organización y mantenibilidad.\n* Modal interactivo: Uso de React-Bootstrap para añadir un modal de confirmación antes de eliminar tareas.\n* Efectos visuales mejorados: Las tarjetas de tareas se elevan al pasar el cursor por encima, ofreciendo una experiencia de usuario más atractiva.\n\n\n**Versión 3.0**\n\n* **Integración de Laravel como backend :**\n    - La aplicación ahora cuenta con un backend completo desarrollado con Laravel, que se comunica con React a través de una REST API.\n    - Se han implementado endpoints para la gestión de tareas y usuarios.\n* **Autenticación de usuarios :**\n    - Se añadió la funcionalidad de registro e inicio de sesión de usuarios.\n    - Se utiliza JWT (JSON Web Token) para gestionar la autenticación y proteger las rutas del backend.\n* **Persistencia en base de datos :**\n    - Todas las tareas y los usuarios se almacenan en una base de datos MySQL.\n    - Las tareas ahora se guardan en el backend en lugar de LocalStorage.\n\n\n**Versión 4.0**\n\n* Implementación del inicio de sesión mediante Google para facilitar el registro e inicio de sesión.\n* Se añadió el archivo \"config.js\" en el frontend para gestionar la URL base y el ID público de Google.\n* Autenticación simplificada con JWT, eliminando la combinación con la sesión para mejorar la seguridad.\n\n\n**Versión 5.0**\n\n* **Refactorización de estilos :**\n    - Se eliminaron los archivos CSS globales y se crearon archivos `module.css` específicos para cada componente.\n\n* **Animaciones mejoradas :**\n    - Se añadieron animaciones a los botones y al texto del modal de \"Crear/Modificar tareas\" para mejorar la experiencia de usuario.\n\n* **Nuevo sistema de filtrado :**\n    - Ahora es posible filtrar las tareas por fecha o por prioridad (de mayor a menor).\n\n* **Actualización de iconos :**\n    - Se añadieron nuevos iconos para mejorar la interfaz visual de la aplicación.\n    - Fuentes de los iconos:\n      - [Icono de cierre de sesion de Freepik](https://www.freepik.es/icono/desconectar_5949662)\n      - [Icono de ajustes de Freepik](https://www.freepik.es/icono/engranaje_16600271#fromView=search\u0026page=1\u0026position=7\u0026uuid=6c0c0cf7-7351-43f2-9ab5-ba14e6b24361)\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmiguelolmop%2Fquicktask","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmiguelolmop%2Fquicktask","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmiguelolmop%2Fquicktask/lists"}