{"id":21893942,"url":"https://github.com/conancos/random-quote-machine","last_synced_at":"2026-04-10T02:53:09.329Z","repository":{"id":258824030,"uuid":"875751544","full_name":"conancos/random-quote-machine","owner":"conancos","description":"App que genera citas aleatorias inspiradoras dichas por personajes relevantes","archived":false,"fork":false,"pushed_at":"2024-10-20T19:19:01.000Z","size":584,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-10-10T22:18:30.564Z","etag":null,"topics":["first-project-react","random-quote-machine"],"latest_commit_sha":null,"homepage":"https://conancos.dev/random-quote-machine/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/conancos.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}},"created_at":"2024-10-20T18:45:59.000Z","updated_at":"2024-10-20T19:23:59.000Z","dependencies_parsed_at":"2024-10-21T23:58:52.359Z","dependency_job_id":null,"html_url":"https://github.com/conancos/random-quote-machine","commit_stats":null,"previous_names":["conancos/random-quote-machine"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/conancos/random-quote-machine","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/conancos%2Frandom-quote-machine","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/conancos%2Frandom-quote-machine/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/conancos%2Frandom-quote-machine/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/conancos%2Frandom-quote-machine/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/conancos","download_url":"https://codeload.github.com/conancos/random-quote-machine/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/conancos%2Frandom-quote-machine/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279005468,"owners_count":26083900,"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-10-10T02:00:06.843Z","response_time":62,"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":["first-project-react","random-quote-machine"],"created_at":"2024-11-28T13:17:49.869Z","updated_at":"2025-10-10T22:18:30.852Z","avatar_url":"https://github.com/conancos.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n\n## **RANDOM-QUOTE-MACHINE** \n###### Esta aplicación web genera citas aleatorias de personalidades relevantes y permitiendo al usuario interactuar con ellas de manera dinámica en sus RRSS.\n\u003c/div\u003e\n\u003cbr\u003e\n\n### Descripción\n\n- _RANDOM-QUOTE-MACHINE_ es una aplicación web construida con _**REACT**_ para completar uno de los proyectos finales requeridos para obtener la certificación _**Front End Development Libraries Projects**_ por [**_freeCodeCamp.org_**](https://freecodecamp.org/espanol).\n\n### Estructura\n\u003eLa estructura del proyecto es la siguiente:\n\n- **/src/:** Carpeta principal que contiene el código fuente de la aplicación.\n    - **main.jsx:** Es el punto de entrada de la aplicación React, donde se importa el componente principal App.jsx y se renderiza en el DOM con el ID \"root\".\n    - **index.css:** Archivo de estilos que define algunos aspectos generales de la aplicación, la declaración de las variables css de todo el proyecto y las fuentes.\n    - **App.jsx:** Componente principal de la aplicación donde se constituye el esquema general y renderiza los demás componentes.\n    - **app.css:** Archivo que estiliza la estructura principal, donde se importan otros archivos de estilos secundarios, se conforman las transiciones, animaciones y las media queries para el texto de la aplicación, independiente del propio patrón de diseño responsivo general.\n- **/components/:** El propio nombre describe el contenido de la carpeta.\n   - **RandomQuote.jsx:** Componente que utiliza la API fetch para realizar una solicitud asíncrona a un endpoint que devuelve un objeto JSON del que se extrae aleatoriamente una cita y su correspondiente autor, manejando la respuesta mediante promesas y actualizando el estado del componente para renderizar dinámicamente la propia cita aleatoria en la interfaz de usuario (U/I).\n   - **RandomColor.jsx:** Componente que genera un color aleatorio de entre una basta gama, coloreando las fuentes, botones y fondo de la App.\n   - **QuoteButton.jsx:** Componente que renderiza el botón que recibe el manejador de click por props, seteando el estado de la variable _color_, e iniciando el resto de procesos de estados en la aplicación.\n   - **SocialButtons.jsx:** Componente que renderiza los botones para compartir dinámicamente las citas a través de las RRSS X(Twitter) o LinkedIn.\n- **/assets/:** Carpeta que contiene activos variados (estilos específicos, iconos, etc).\n- **vite.config.js:** Archivo de configuración de _**Vite**_ que define la configuración del entorno de desarrollo para la aplicación _**React**_, utilizando el plugin @vitejs/plugin-react-swc para soporte de JSX y optimización del código.\n\n### Funcionalidad y Compatibilidad\n\u003eLa aplicación tiene las siguientes características:\n\n- Trae citas aleatorias de un endpoint y las renderiza en pantalla dinámicamente.\n- Permite a los usuarios interactuar con la cita mediante botones de RRSS\n  - Tweetear la cita en Twitter.\n  - Postear la cita en LinkedIn.\n- Utiliza CSS avanzado para crear un diseño atractivo y responsivo.\n- Compatibilidad entre navegadores y redes sociales.\n  - Las citas vienen en inglés, pero puede usar el traductor integrado de navegadores como Chrome o Brave para traducirlas.\n  - Así mismo se ha asegurado del correcto funcionamiento a la hora de insertar la actual cita y su correspondiente autor en ambas redes sociales a través de cada navegador web. \n\n\u003e[!NOTE]\n\u003eSi encuentras algún problema de compatibilidad en tu navegador, por favor informa en la sección de issues.\n\n### Características avanzadas CSS utilizadas\n\u003eLa aplicación utiliza las siguientes características avanzadas de CSS:\n\n- [x] Flexbox para crear layouts flexibles y responsivos.\n- [x] Grid para crear diseños de cuadrícula.\n- [x] CSS Variables para definir colores y estilos de manera centralizada.\n- [x] Animaciones y transiciones para crear efectos visuales atractivos.\n- [x] Pseudo-clases y Pseudo-element para crear estilos personalizados.\n- [x] Media Queries para mejorar el responsive design.\n- [ ] Scroll-driven-animations.\n\n### Licencia\n\nEste proyecto está licenciado bajo la **GNU General Public License v3.0**.  \n\u003cdiv align=\"center\"\u003e\n\n![GPLv3 Logo](https://www.gnu.org/graphics/gplv3-127x51.png)\n\n\u003c/div\u003e\n\n\u003e[!IMPORTANT]\n\u003ePese a ser un pequeño proyecto, la implementación de una licencia tiene como objetivo el practicar, aprender y familiarizarse con sus características, estableciendo una estructura adecuada que informe correctamente al usuario.\n\u003eEsta licencia copyleft exige que cualquier software derivado sea también distribuido bajo la GPL. Promueve el software libre de código abierto, protege contra reclamos de patentes y requiere atribución.\n\n### Información sobre la Licencia\n\n- **Tipo de Licencia**: GPL-3.0\n- **Fecha de publicación**: 20-10-2024\n- **Autor**: conan_cos.dev\n\n### Resumen de la Licencia\n\nLa GPL-3.0 garantiza a los usuarios las siguientes **libertades:**\n\n1. **Usar**: Puedes usar el software para cualquier propósito.\n2. **Estudiar**: Puedes estudiar cómo funciona el software y adaptarlo a tus necesidades.\n3. **Modificar**: Puedes modificar el software y compartir tus modificaciones.\n4. **Distribuir**: Puedes compartir copias del software original y de tus modificaciones con otros.\n\n### Protección de Patentes\n\nSi contribuyes al proyecto, renuncias a cualquier reclamo de patente relacionado con tus contribuciones. Esto significa que no podrás demandar a los usuarios por infracción de patentes en relación con el código que aportaste.\n\n\n### Más Información\n\nPara obtener más detalles, consulta el texto completo de la [GNU General Public License v3.0](https://www.gnu.org/licenses/gpl-3.0.html).\n\n### Fuentes de Datos, Funcionalidad y Diseño\n\nLas citas inspiradoras utilizadas en esta aplicación se obtienen de [**quotes.json**](https://gist.githubusercontent.com/camperbot/5a022b72e96c4c9585c32bf6a75f62d9/raw/e3c6895ce42069f0ee7e991229064f167fe8ccdc/quotes.json), proporcionado por camperbot.\n\nAsí mismo la funcionalidad y diseño están basados inicialmente sobre esta [**app**](https://random-quote-machine.freecodecamp.rocks/), siguiendo las especificaciones del [**ejercicio de freeCodeCamp**](https://www.freecodecamp.org/espanol/learn/front-end-development-libraries/front-end-development-libraries-projects/build-a-random-quote-machine).\n\n---\n\n\u003cdiv align=\"center\"\u003e\n\n### Link del sitio web: \u0026nbsp; [**random-quote-machine ↗**](https://conancos.dev/random-quote-machine/)\n\n\u003cbr\u003e\n\n[![URL LOGO](public/logo-conancos.png)](https://conancos.dev/portfolio)\n\nCopyright \u0026copy; 2024 conan_cos - bajo licencia \u003ca href=\"https://www.gnu.org/licenses/gpl-3.0.html\"\u003eGNU General Public License v3.0\u003c/a\u003e.\n\n\u003c/div\u003e\n\n\u003c!-- \nGoogle Chrome Versión 129.0.6668.103 (Build oficial) (64 bits)\nBrave1 Versión 1.71.114 Chromium: 130.0.6723.58 (Build oficial) (64 bits)\nMozilla Firefox (versión 90+)\nSafari (versión 14+)\n\n\n[!IMPORTANT] Si deseas agregar una función de traducción de citas integrada, por favor informa en la sección de issues.\n\nContribuciones\nSi deseas contribuir a la aplicación, por favor sigue los siguientes pasos:\n\nFork el repositorio.\nCrea una rama para tu contribución.\nRealiza tus cambios y pruebas.\nEnvía un pull request.\n[!TIP] Asegúrate de seguir las convenciones de codificación y estilo de la aplicación.\n --\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fconancos%2Frandom-quote-machine","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fconancos%2Frandom-quote-machine","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fconancos%2Frandom-quote-machine/lists"}