{"id":19092791,"url":"https://github.com/basedhound/spotlight_portfolio_next","last_synced_at":"2026-04-07T08:02:12.312Z","repository":{"id":245812158,"uuid":"817401413","full_name":"basedhound/spotlight_portfolio_next","owner":"basedhound","description":"Portfolio concept built on Next.js, using : Three.js for rendering 3D elements, Framer motion + Aceternity UI for beautiful animations, and styled with Tailwind.","archived":false,"fork":false,"pushed_at":"2024-08-06T15:42:21.000Z","size":51978,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-10-27T10:10:11.621Z","etag":null,"topics":["bento-grid","nextjs","nextjs14","r3f","react","react18","sentry","tailwind","three-fiber","threejs","typescript"],"latest_commit_sha":null,"homepage":"https://spotlight-fv.netlify.app","language":"TypeScript","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/basedhound.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-06-19T16:16:52.000Z","updated_at":"2025-04-13T16:09:47.000Z","dependencies_parsed_at":"2024-11-09T03:34:15.396Z","dependency_job_id":null,"html_url":"https://github.com/basedhound/spotlight_portfolio_next","commit_stats":null,"previous_names":["basedhound/pf-design_modern_next","basedhound/spotlight_portfolio_next"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/basedhound/spotlight_portfolio_next","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/basedhound%2Fspotlight_portfolio_next","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/basedhound%2Fspotlight_portfolio_next/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/basedhound%2Fspotlight_portfolio_next/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/basedhound%2Fspotlight_portfolio_next/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/basedhound","download_url":"https://codeload.github.com/basedhound/spotlight_portfolio_next/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/basedhound%2Fspotlight_portfolio_next/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31504897,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-07T03:10:19.677Z","status":"ssl_error","status_checked_at":"2026-04-07T03:10:13.982Z","response_time":105,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"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":["bento-grid","nextjs","nextjs14","r3f","react","react18","sentry","tailwind","three-fiber","threejs","typescript"],"created_at":"2024-11-09T03:21:57.651Z","updated_at":"2026-04-07T08:02:12.295Z","avatar_url":"https://github.com/basedhound.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n    \u003ca href=\"https://spotlight-fv.netlify.app\" target=\"_blank\"\u003e\n      \u003cimg src=\"public/design/preview.png\" alt=\"Project Banner\"\u003e\n    \u003c/a\u003e\n  \u003ch3 align=\"center\"\u003eSpotlight Portfolio\u003c/h3\u003e\n\u003c/div\u003e\n\n##  \u003cbr /\u003e 📋 \u003ca name=\"table\"\u003eTable of Contents\u003c/a\u003e\n\n- ✨ [Introduction](#introduction)\n- ⚙️ [Tech Stack](#tech-stack)\n- 📝 [Features](#features)\n- 🚀 [Quick Start](#quick-start)\n\n##  \u003cbr /\u003e \u003ca name=\"introduction\"\u003e✨ Introduction\u003c/a\u003e\n\n**[EN]** Built with Next.js for handling the user interface, Three.js for rendering 3D elements, Framer motion for beautiful animations, and styled with TailwindCSS, this portfolio demonstrates the developer's skills in a unique manner that creates a lasting impact.\n\n**[FR]** Conçu avec Next.js pour l'interface utilisateur, Three.js pour le rendu 3D, Framer Motion pour des animations élégantes, et stylisé avec TailwindCSS, ce portfolio illustre les compétences du développeur de manière moderne et marquante.\n\n##  \u003cbr /\u003e \u003ca name=\"tech-stack\"\u003e⚙️ Tech Stack\u003c/a\u003e\n\n- [**Next.js**](https://nextjs.org/docs) is a React framework known for its server-side rendering (SSR) and static site generation (SSG) capabilities, enhancing performance and SEO for web applications. It offers features like automatic code splitting, API routes for server-side logic, and a plugin system for extensibility.\n\n- [**Three.js**](https://threejs.org/docs/) is a JavaScript library that enables the creation and display of 3D computer graphics in web browsers using WebGL. It provides extensive capabilities for rendering 3D scenes, including support for geometries, materials, lighting, and animations.\n\n- [**Framer Motion**](https://www.framer.com/motion/) is a React animation library designed for creating smooth, interactive animations and transitions. It simplifies complex animations with a straightforward API, supports gesture-based interactions, and offers physics-based animations for realistic motion effects.\n\n- [**Tailwind**](https://v2.tailwindcss.com/docs) is a utility-first CSS framework that speeds up UI development by providing a set of pre-built utility classes. It allows developers to quickly build custom designs without writing traditional CSS, promoting rapid prototyping and design consistency.\n\n\n\n## \u003cbr/\u003e \u003ca name=\"features\"\u003e📝 Features\u003c/a\u003e\n\n👉 **Hero**: Captivating introduction featuring a spotlight effect and dynamic background.\n\n👉 **Bento Grid**: Modern layout presenting personal information using cutting-edge CSS design techniques.\n\n👉 **3D Elements**: Interactive 3D design elements, such as a GitHub-style globe and card hover effects, adding depth and engagement.\n\n👉 **Testimonials**: Dynamic testimonials area with scrolling or animated content for enhanced engagement.\n\n👉 **Canvas Effect**: Innovative use of HTML5 canvas to create visually striking effects in the \"approaches\" section.\n\n👉 **Responsiveness**: Seamless adaptability across all devices, ensuring optimal viewing experience for every user.\n\n\n## \u003cbr /\u003e \u003ca name=\"quick-start\"\u003e🚀 Quick Start\u003c/a\u003e\n\nFollow these steps to set up the project locally on your machine.\n\n\u003cbr/\u003e**Prerequisites**\n\nMake sure you have the following installed on your machine:\n\n- [Git](https://git-scm.com/)\n- [Node.js](https://nodejs.org/en)\n- [npm](https://www.npmjs.com/) (Node Package Manager)\n\n\u003cbr/\u003e**Cloning the Repository**\n\n```bash\ngit clone {git remote URL}\n```\n\n\u003cbr/\u003e**Installation**\n\nLet's install the project dependencies, from your terminal, run:\n\n```bash\nnpm install\n# or\nyarn install\n```\n\n\u003cbr/\u003e**Set Up Environment Variables**\n\nCreate a new file named `.env` in the root of your project and add the following content:\n\n```env\nSENTRY_AUTH_TOKEN=\n```\n\nReplace the placeholder values with your actual respective account credentials:\n\n- [Sentry](https://sentry.io/features/dashboards)\n\n\n\u003cbr/\u003e**Running the Project**\n\nInstallation will take a minute or two, but once that's done, you should be able to run the following command:\n\n```bash\nnpm run dev\n# or\nyarn dev\n```\n\nOpen [`http://localhost:3000`](http://localhost:3000) in your browser to view the project.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbasedhound%2Fspotlight_portfolio_next","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbasedhound%2Fspotlight_portfolio_next","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbasedhound%2Fspotlight_portfolio_next/lists"}