{"id":23733787,"url":"https://github.com/mrredu/sphere","last_synced_at":"2026-04-13T01:08:09.954Z","repository":{"id":270296305,"uuid":"908730871","full_name":"MrRedu/sphere","owner":"MrRedu","description":"🧱 Aplicación web para explorar y guardar animes","archived":false,"fork":false,"pushed_at":"2024-12-30T04:36:27.000Z","size":1184,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-20T15:13:41.521Z","etag":null,"topics":["framer","graphql","nextjs","zustand"],"latest_commit_sha":null,"homepage":"https://sphere-mrredu.vercel.app/","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/MrRedu.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-12-26T20:14:42.000Z","updated_at":"2025-01-10T04:46:48.000Z","dependencies_parsed_at":"2024-12-30T05:28:12.706Z","dependency_job_id":"9d6d8644-3742-4381-9f20-2b342b1f578a","html_url":"https://github.com/MrRedu/sphere","commit_stats":null,"previous_names":["mrredu/sphere"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MrRedu%2Fsphere","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MrRedu%2Fsphere/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MrRedu%2Fsphere/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MrRedu%2Fsphere/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/MrRedu","download_url":"https://codeload.github.com/MrRedu/sphere/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":239859562,"owners_count":19708863,"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":["framer","graphql","nextjs","zustand"],"created_at":"2024-12-31T05:19:34.313Z","updated_at":"2026-04-13T01:08:09.941Z","avatar_url":"https://github.com/MrRedu.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n   \u003cbr/\u003e\n   \u003ca href=\"https://sphere-mrredu.vercel.app/\" target=\"_blank\"\u003e\n    \u003cimg src=\"./public/logo.svg\" width=\"150\" \u003e\n   \u003c/a\u003e\n   \u003ch3 align=\"center\"\u003eSphere\u003c/h3\u003e\n   \u003cp align=\"center\"\u003e\n    嘘を言わないで\n   \u003c/p\u003e\n\u003c/p\u003e\n\n\u003cdetails open\u003e\n  \u003csummary\u003e\n  \u003ch2\u003eTabla de contenidos\u003c/h2\u003e\n  \u003c/summary\u003e\n  \u003cul\u003e\n    \u003cli\u003e\u003ca href=\"#-descripción\"\u003eDescripción\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#-características\"\u003eCaracterísticas\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#-demo\"\u003eDemo\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#-tecnologías\"\u003eTecnologías\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#-instalación\"\u003eInstalación\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#-uso\"\u003eUso\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#-contribución\"\u003eContribución\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"#-licencia\"\u003eLicencia\u003c/a\u003e\u003c/li\u003e\n  \u003c/ul\u003e\n\u003c/details\u003e\n\n## Descripción del Proyecto\n\nBienvenido a Sphere, tu portal definitivo al fascinante universo del anime. Con nuestra aplicación web, podrás explorar una vasta colección de animes que abarcan desde los clásicos hasta los últimos estrenos. La interfaz intuitiva y responsiva te permite buscar tus series favoritas por nombre, puntuación o categoría, facilitando el descubrimiento de nuevos títulos que se ajusten a tus gustos personales.\n\nAdemás, podrás guardar tus animes preferidos en una lista de favoritos, lo que te permitirá acceder a ellos en cualquier momento. La experiencia de navegación es fluida y agradable, diseñada para que disfrutes al máximo mientras te sumerges en el mundo del anime. Únete a nosotros y transforma tu forma de disfrutar el anime con Sphere.\n\n## Características\n\n- **Página de Inicio**:\n\n  - Tenemos una sección principal con un deslizador horizontal con los animes más visto de todos los tiempos\n  - Una sección en grilla con los 4 animes más populares en el momento\n  - Por último, tenemos una galería de animes; en el que podemos filtrar por nombre, género, estado, score; además podemos agregar a favoritos\n\n- **Página de Detalles del Anime**:\n\n  - Detalle del anime con información completa: nombre (inglés y nativo), estado, episodios, puntuación, categorías, formato, fecha de salida con fecha de culminación y resumen.\n  - Imagen del anime incluida con animación de carta holográfica al hacerle hover.\n  - Botones; uno para agregar a favoritos y otro para ir al trailer directamente.\n\n- **Sistema de Favoritos**:\n\n  - Los usuarios pueden marcar animes como favoritos y almacenarlos en el almacenamiento local del navegador.\n  - Opción para filtrar favoritos por género, estado, score y también por nombre.\n\n- **Diseño Responsivo**:\n\n  - Todas las pantallas están adaptadas a diferentes dispositivos para una experiencia óptima en móviles y computadoras de escritorio.\n\n- **SEO Optimizado**:\n\n  - Implementación de estrategias efectivas de SEO con meta tags y rutas amigables para el usuario.\n  - Uso de técnicas de pre-rendering y Server-Side Rendering (SSR) para mejorar el rendimiento.\n  - Cada enlace de anime específico tiene sus meta-tags de SEO; para asi ver su información al compartir su enlace.\n\n- **Manejo de Errores**:\n\n  - Validación adecuada de entradas del usuario y respuestas de la API.\n  - Estados de carga y mensajes de error informativos.\n\n- **Calidad del Código**:\n\n  - Reglas de ESLint y Prettier configuradas para mantener un código limpio.\n  - Uso estricto de TypeScript con interfaces y tipos definidos.\n\n## Demo\n\n¡Descubre \u003cem\u003eSphere\u003c/em\u003e directamente desde tu navegador! \u003cbr\u003e\n[![Ver Deploy](https://img.shields.io/badge/Ver%20Deploy-Sphere-5fdd9d?style=for-the-badge\u0026logo=vercel)](https://sphere-mrredu.vercel.app/)\n\n## Tecnologías\n\n![Next.js][Next.js]![GraphQL][GraphQL]![Zustand][Zustand] \u003cbr\u003e\n![React.js][React.js]![TypeScript][TypeScript]![TailwindCSS][TailwindCSS]\u003cbr\u003e\n![Motion][Motion] \u003cbr\u003e\n![ESLint][ESLint]![Prettier][Prettier]\u003cbr\u003e\n\n## Instalación\n\nInstrucciones paso a paso para instalar el proyecto en un entorno local.\n\n1. Clona el repositorio:\n\n```bash\ngit clone https://github.com/MrRedu/sphere.git\n```\n\n2. Navega al directorio del proyecto:\n\n```bash\ncd sphere\n```\n\n3. Instala las dependencias:\n\n```bash\nnpm install\n```\n\n4. Configura las variables de entorno:\n\n   4.1 Crea un archivo `.env` en la raíz del proyecto:\n\n   ```bash\n   touch .env\n   ```\n\n   4.2 Rellena los campos del archivo `.env` utilizando el formato basado en el archivo `.env.template`:\n\n   ```bash\n   # Anilist API\n   ANILIST_API_URL=https://graphql.anilist.co\n\n   # Next Auth Provider\n   NEXTAUTH_URL='http://localhost:3000'\n   NEXTAUTH_SECRET='\u003copenssl rand -base64 32\u003e'\n\n   # Google Auth Provider\n   GOOGLE_CLIENT_ID=\u003cstring\u003e\n   GOOGLE_CLIENT_SECRET=\u003cstring\u003e\n   ```\n\n## Uso\n\nInstrucciones sobre cómo ejecutar la aplicación localmente.\n\n1. Para iniciar el servidor de desarrollo:\n\n```bash\nnpm run dev\n```\n\n2. Abre tu navegador y visita `http://localhost:3000` para ver la aplicación en acción.\n\n## Contribución\n\nInstrucciones sobre cómo contribuir al proyecto.\n\n1. Haz un fork del repositorio.\n2. Crea una nueva rama (`git checkout -b nombre-de-la-rama`).\n3. Realiza tus cambios y haz un commit (`git commit -m 'Añadir una nueva característica'`).\n4. Envía tus cambios (`git push origin nombre-de-la-rama`).\n5. Abre un Pull Request.\n\n## Licencia\n\nSphere está bajo la [Licencia MIT](LICENSE).\n\n\u003chr\u003e\n\u003cbr\u003e\n\u003cbr\u003e\n\u003cbr\u003e\n\n![Logotipo](./public/logotype.svg)\n\n\u003c!-- --\u003e\n\u003c!--  --\u003e\n\u003c!--   --\u003e\n\u003c!--    --\u003e\n\u003c!--     --\u003e\n\u003c!--      --\u003e\n\n\u003c!-- MARKDOWN LINKS--\u003e\n\n[Next.js]: https://img.shields.io/badge/next.js-000000?style=for-the-badge\u0026logo=nextdotjs\u0026logoColor=white\n[React.js]: https://img.shields.io/badge/React-20232A?style=for-the-badge\u0026logo=react\u0026logoColor=61DAFB\n[Zustand]: https://img.shields.io/badge/Zustand-3e432d?style=for-the-badge\u0026logo=zustand\u0026logoColor=white\n[TailwindCSS]: https://img.shields.io/badge/TailwindCSS-06b6d4?style=for-the-badge\u0026logo=tailwind-css\u0026logoColor=white\n[ESLint]: https://img.shields.io/badge/eslint-4b32c3?style=for-the-badge\u0026logo=eslint\u0026logoColor=white\n[Prettier]: https://img.shields.io/badge/prettier-f7b93e?style=for-the-badge\u0026logo=prettier\u0026logoColor=white\n[Motion]: https://img.shields.io/badge/motion-F6EC2E?style=for-the-badge\u0026logo=motion\u0026logoColor=white\n[GraphQL]: https://img.shields.io/badge/GraphQl-E10098?style=for-the-badge\u0026logo=graphql\u0026logoColor=white\n[TypeScript]: https://img.shields.io/badge/TypeScript-3178C6?style=for-the-badge\u0026logo=typescript\u0026logoColor=white\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmrredu%2Fsphere","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmrredu%2Fsphere","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmrredu%2Fsphere/lists"}