{"id":51476010,"url":"https://github.com/alberto2005-coder/pexel-gallery-react","last_synced_at":"2026-07-06T21:01:07.895Z","repository":{"id":341817130,"uuid":"1171599922","full_name":"alberto2005-coder/pexel-gallery-react","owner":"alberto2005-coder","description":"Esta aplicación es una galería de imágenes dinámica que permite buscar y visualizar fotografías de alta calidad utilizando la API de Pexels. Implementa patrones modernos de React como Hooks personalizados, Adapters para limpiar la data de la API, y TanStack Query para la gestión del estado asíncrono.","archived":false,"fork":false,"pushed_at":"2026-03-03T12:13:44.000Z","size":43,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-03-03T15:40:44.762Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/alberto2005-coder.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":"2026-03-03T12:07:35.000Z","updated_at":"2026-03-03T12:14:00.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/alberto2005-coder/pexel-gallery-react","commit_stats":null,"previous_names":["alberto2005-coder/pexel-gallery-react"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/alberto2005-coder/pexel-gallery-react","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alberto2005-coder%2Fpexel-gallery-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alberto2005-coder%2Fpexel-gallery-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alberto2005-coder%2Fpexel-gallery-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alberto2005-coder%2Fpexel-gallery-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/alberto2005-coder","download_url":"https://codeload.github.com/alberto2005-coder/pexel-gallery-react/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alberto2005-coder%2Fpexel-gallery-react/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":35205739,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-07-06T02:00:07.184Z","response_time":106,"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":[],"created_at":"2026-07-06T21:01:06.680Z","updated_at":"2026-07-06T21:01:07.890Z","avatar_url":"https://github.com/alberto2005-coder.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 📸 Pexels Image Gallery - React + TypeScript\n\nBeautiful image gallery powered by the Pexels API, built with React, TypeScript, and Vite.\n\n---\n\n## 🌐 Language / Idioma\n\n- [Español (Spanish)](#español)\n- [English](#english)\n\n---\n\n\u003ca name=\"español\"\u003e\u003c/a\u003e\n# 🇪🇸 Español\n\n## 📋 Índice\n1. [Descripción](#descripción-es)\n2. [Tecnologías](#tecnologías-es)\n3. [Instalación](#instalación-es)\n4. [Configuración](#configuración-es)\n5. [Uso](#uso-es)\n6. [Estructura del Proyecto](#estructura-es)\n\n\u003ca name=\"descripción-es\"\u003e\u003c/a\u003e\n### 1. Descripción\nEsta aplicación es una galería de imágenes dinámica que permite buscar y visualizar fotografías de alta calidad utilizando la API de Pexels. Implementa patrones modernos de React como Hooks personalizados, Adapters para limpiar la data de la API, y TanStack Query para la gestión del estado asíncrono.\n\n\u003ca name=\"tecnologías-es\"\u003e\u003c/a\u003e\n### 2. Tecnologías\n- **React 19**\n- **TypeScript**\n- **Vite** (Build Tool)\n- **TanStack Query (React Query)** (Gestión de datos)\n- **React Router Dom** (Navegación)\n- **CSS Modules / Vanilla CSS**\n\n\u003ca name=\"instalación-es\"\u003e\u003c/a\u003e\n### 3. Instalación\nPara instalar el proyecto localmente, sigue estos pasos:\n\n1. Clona el repositorio:\n   ```bash\n   git clone https://github.com/tu-usuario/pexel-gallery-react.git\n   ```\n2. Entra en la carpeta del proyecto:\n   ```bash\n   cd pexel-gallery-react\n   ```\n3. Instala las dependencias:\n   ```bash\n   npm install\n   ```\n\n\u003ca name=\"configuración-es\"\u003e\u003c/a\u003e\n### 4. Configuración\nPara que la aplicación funcione, necesitas una clave de API de Pexels.\n\n1. Crea un archivo `.env` en la raíz del proyecto.\n2. Añade tu clave de la siguiente manera:\n   ```env\n   VITE_PEXELS_API_KEY=tu_clave_aqui\n   ```\n   *Puedes usar `.env.example` como referencia.*\n\n\u003ca name=\"uso-es\"\u003e\u003c/a\u003e\n### 5. Uso\nInicia el servidor de desarrollo:\n```bash\nnpm run dev\n```\nLa aplicación estará disponible en `http://localhost:5173`.\n\n\u003ca name=\"estructura-es\"\u003e\u003c/a\u003e\n### 6. Estructura del Proyecto\n- `src/api`: Llamadas directas a la API de Pexels.\n- `src/adapters`: Transformación de los datos crudos de la API a interfaces del dominio.\n- `src/hooks`: Lógica reutilizable y gestión de datos con React Query.\n- `src/components`: Componentes visuales de la galería.\n\n---\n\n\u003ca name=\"english\"\u003e\u003c/a\u003e\n# 🇺🇸 English\n\n## 📋 Table of Contents\n1. [Description](#description-en)\n2. [Technologies](#technologies-en)\n3. [Installation](#installation-en)\n4. [Configuration](#configuration-en)\n5. [Usage](#usage-en)\n6. [Project Structure](#structure-en)\n\n\u003ca name=\"description-en\"\u003e\u003c/a\u003e\n### 1. Description\nThis application is a dynamic image gallery that allows searching and viewing high-quality photographs using the Pexels API. It implements modern React patterns such as custom Hooks, Adapters to clean API data, and TanStack Query for asynchronous state management.\n\n\u003ca name=\"technologies-en\"\u003e\u003c/a\u003e\n### 2. Technologies\n- **React 19**\n- **TypeScript**\n- **Vite** (Build Tool)\n- **TanStack Query (React Query)** (Data management)\n- **React Router Dom** (Navigation)\n- **CSS Modules / Vanilla CSS**\n\n\u003ca name=\"installation-en\"\u003e\u003c/a\u003e\n### 3. Installation\nTo install the project locally, follow these steps:\n\n1. Clone the repository:\n   ```bash\n   git clone https://github.com/your-username/pexel-gallery-react.git\n   ```\n2. Enter the project folder:\n   ```bash\n   cd pexel-gallery-react\n   ```\n3. Install dependencies:\n   ```bash\n   npm install\n   ```\n\n\u003ca name=\"configuration-en\"\u003e\u003c/a\u003e\n### 4. Configuration\nFor the application to work, you need a Pexels API key.\n\n1. Create a `.env` file in the project root.\n2. Add your key as follows:\n   ```env\n   VITE_PEXELS_API_KEY=your_key_here\n   ```\n   *You can use `.env.example` as a reference.*\n\n\u003ca name=\"usage-en\"\u003e\u003c/a\u003e\n### 5. Usage\nStart the development server:\n```bash\nnpm run dev\n```\nThe application will be available at `http://localhost:5173`.\n\n\u003ca name=\"structure-en\"\u003e\u003c/a\u003e\n### 6. Structure\n- `src/api`: Direct calls to the Pexels API.\n- `src/adapters`: Transformation of raw API data into domain interfaces.\n- `src/hooks`: Reusable logic and data management with React Query.\n- `src/components`: Gallery visual components.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falberto2005-coder%2Fpexel-gallery-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Falberto2005-coder%2Fpexel-gallery-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falberto2005-coder%2Fpexel-gallery-react/lists"}