Root-DevSprint

.agent/workflows/run-project.md

@@ -0,0 +1,35 @@
+---
+description: how to run the project
+---
+To run the Scenify project on your local machine, follow these steps:
+
+1. **Install Dependencies**
+   Open your terminal in the `devSprint` directory and run:
+   ```bash
+   npm install
+   ```
+
+2. **Configure Environment Variables**
+   Ensure you have a `.env.local` file in the root of the `devSprint` directory with the following keys:
+   ```env
+   GROQ_API_KEY=your_groq_key
+   SPOTIFY_CLIENT_ID=your_spotify_id
+   SPOTIFY_CLIENT_SECRET=your_spotify_secret
+   ```
+
+3. **Start the Development Server**
+   Run the following command to start the app:
+   ```bash
+   npm run dev
+   ```
+
+4. **Access the Application**
+   Open your browser and navigate to:
+   [http://localhost:3000](http://localhost:3000)
+
+5. **Build for Production (Optional)**
+   To create an optimized production build:
+   ```bash
+   npm run build
+   npm start
+   ```

.gitignore

@@ -0,0 +1,41 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/versions
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# env files (can opt-in for committing if needed)
+.env*
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

AGENTS.md

@@ -0,0 +1,5 @@
+<!-- BEGIN:nextjs-agent-rules -->
+# This is NOT the Next.js you know
+
+This version has breaking changes — APIs, conventions, and file structure may all differ from your training data. Read the relevant guide in `node_modules/next/dist/docs/` before writing any code. Heed deprecation notices.
+<!-- END:nextjs-agent-rules -->

CLAUDE.md

@@ -0,0 +1 @@
+@AGENTS.md

README.md

@@ -1,113 +1,43 @@
-# Development Sprint: 2-Hour Challenge
+This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
+Here is a video demonstrating its use: https://youtu.be/nFk2qWlXx7E
 
-Welcome to the Development Sprint. In this 2-hour team-based event, you will build a fully functional, responsive, and visually appealing frontend application from scratch. 
+## Getting Started
 
-This challenge evaluates your team's ability to rapidly prototype, effectively utilize a modern JavaScript/React ecosystem, and seamlessly integrate external APIs to build a compelling user interface.
+First, run the development server:
 
-**Below are listed libraries and Public APIs you can use.**
-**You must only use the given libraries, however you can use additional APIs for more functionality.**
+```bash
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
+# or
+bun dev
+```
 
-## 🏆 Judging Criteria
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
 
-Submissions will be evaluated on the following metrics:
-1. **Library Integration:** The quantity and quality of external libraries successfully implemented. We are looking for meaningful usage of these tools to solve frontend challenges.
-2. **Implementation & UX/UI:** The overall aesthetic, responsiveness, and usability of the application. Clean design and smooth user experiences will be highly rewarded.
-3. **Version Control:** Proper use of Git, including clear, descriptive commit messages and logical branching.
+You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
 
-## 🚀 Submission Guidelines
+This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
 
-Please follow these steps carefully to ensure your project is evaluated:
+## Learn More
 
-1. **Fork** this repository.
-2. **Clone** your forked repository to your local machines.
-3. Create a new directory named after your team (e.g., `team-horizon` or `team-byte`).
-4. Initialize your project within this directory.
-5. **Showcase Video:** Record a 1-2 minute screen recording demonstrating your working project. Highlight the specific APIs and UI components you implemented.
-6. **Commit & Push:** Add your project files and the showcase video (`.mp4` or a hosted link in your project's README) to your directory.
-7. Open a **Pull Request (PR)** to this main repository before the 2-hour deadline.
+To learn more about Next.js, take a look at the following resources:
 
-### Version Control Best Practices
-* Utilize feature branches for development (e.g., `feature/authentication`, `fix/layout-shift`).
-* Use conventional commit messages to maintain a clean history (e.g., `feat: added Recharts for data visualization` or `fix: resolved API CORS issue`).
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
 
----
+You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
 
-## 🛠️ Approved Libraries & Tools
+## Deploy on Vercel
 
-You are encouraged to utilize tools from the following categories to accelerate your development process and enhance your application's capabilities.
+The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
 
-### UI Components & Design Systems
-* **[shadcn/ui](https://ui.shadcn.com/)** - Beautifully designed, accessible components.
-* **[Chakra UI](https://chakra-ui.com/)** - Simple, modular, and accessible component library.
-* **[NextUI](https://nextui.org/)** - Fast and modern React UI library.
-* **[Radix UI](https://www.radix-ui.com/)** - Unstyled, accessible components for building design systems.
-* **[Mantine](https://mantine.dev/)** - A fully featured React components library.
+Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
+-Made by the help of antigravity, spotify web api and openai/gpt-oss-120b as the chatbot that looks for the music.
 
-### Icons & Typography
-* **[Lucide React](https://lucide.dev/)** - Consistent, clean icon toolkit.
-* **[React Icons](https://react-icons.github.io/react-icons/)** - Comprehensive library of popular icon sets.
-* **[Heroicons](https://heroicons.com/)** - Hand-crafted SVG icons by the Tailwind CSS team.
 
-### Animation & 3D Graphics
-* **[Framer Motion](https://www.framer.com/motion/)** - Production-ready motion library for React.
-* **[AutoAnimate](https://auto-animate.formkit.com/)** - Zero-config, drop-in animations.
-* **[GSAP](https://gsap.com/)** - Advanced, professional-grade web animation.
-* **[Three.js](https://threejs.org/) & [@react-three/fiber](https://docs.pmnd.rs/react-three-fiber/getting-started/introduction)** - Tools for building 3D scenes in React.
 
-### Data Fetching & State Management
-* **[React Query (TanStack Query)](https://tanstack.com/query/latest)** - Robust asynchronous state management.
-* **[Zustand](https://zustand-demo.pmnd.rs/)** - Fast, scalable, and minimalistic state management.
-* **[Axios](https://axios-http.com/)** - Promise-based HTTP client.
 
-### Forms, Validation & Editors
-* **[React Hook Form](https://react-hook-form.com/)** - Performant and flexible form handling.
-* **[Zod](https://zod.dev/)** - TypeScript-first schema validation.
-* **[TipTap](https://tiptap.dev/)** - Headless, highly extensible rich text editor.
-
-### Maps, Charts & Data Visualization
-* **[Recharts](https://recharts.org/)** - Composable charting library built on React components.
-* **[Chart.js](https://www.chartjs.org/) & [react-chartjs-2](https://react-chartjs-2.js.org/)** - Flexible JavaScript charting.
-* **[React Leaflet](https://react-leaflet.js.org/)** - Interactive maps integration for React.
-
-### Advanced Utilities
-* **[dnd-kit](https://dndkit.com/)** - Modern drag-and-drop toolkit for React.
-* **[date-fns](https://date-fns.org/)** - Comprehensive date utility library.
-* **[Wagmi](https://wagmi.sh/) & [viem](https://viem.sh/)** - React Hooks for Ethereum/Web3 integration.
-* **[Sonner](https://sonner.emilkowal.ski/)** - Opinionated toast notification component.
-
----
-
-## 📡 Public APIs
-
-You must integrate at least one of the following APIs to populate your application with dynamic data. 
-
-### Finance & Crypto
-* **[CoinGecko API](https://www.coingecko.com/en/api)**: Cryptocurrency data, live prices, and historical charts.
-* **[Alpha Vantage](https://www.alphavantage.co/)**: *(Free key required)* Real-time and historical stock market data.
-
-### E-commerce & Mock Data
-* **[DummyJSON](https://dummyjson.com/)**: Mock data for products, recipes, users, and carts.
-* **[Fake Store API](https://fakestoreapi.com/)**: E-commerce prototype data including products and categories.
-
-### Entertainment & Media
-* **[The Movie Database (TMDB) API](https://developer.themoviedb.org/docs)**: *(Free key required)* Comprehensive data on movies, TV shows, and cast members.
-* **[Spotify Web API](https://developer.spotify.com/documentation/web-api)**: *(Authentication required)* Metadata for artists, albums, and tracks.
-* **[PokeAPI](https://pokeapi.co/)**: Extensive Pokémon database.
-* **[Jikan API](https://jikan.moe/)**: Unofficial MyAnimeList API for anime and manga data.
-
-### Science & Geography
-* **[NASA Open APIs](https://api.nasa.gov/)**: *(Free key required)* Astronomy Picture of the Day, Mars Rover photos, and near-Earth object data.
-* **[REST Countries](https://restcountries.com/)**: RESTful API for global country data (population, demographics, flags).
-* **[OpenWeatherMap](https://openweathermap.org/api)**: *(Free key required)* Current weather data and forecasts.
-
-### Sports
-* **[TheSportsDB](https://www.thesportsdb.com/api.php)**: Crowd-sourced sports data, team information, and artwork.
-* **[balldontlie](https://www.balldontlie.io/)**: NBA statistics and game data.
-
----
-
-## ⚠️ Rules of Engagement
-
-* **No Pre-built Templates:** Utilizing standard initializers (like Vite, Create React App, or Next.js) is permitted. However, cloning a full boilerplate containing pre-built application features or routing architectures is strictly prohibited.
-* **AI Assistance:** AI tooling (e.g., GitHub Copilot, Gemini, ChatGPT) may be used for debugging, syntax, and scaffolding. The core architectural decisions and library integrations must remain your team's own work.
-* **Time Limits:** All Pull Requests must be opened before the 120-minute mark. Late submissions will be subject to point deductions.
+Groove on :)

eslint.config.mjs

@@ -0,0 +1,18 @@
+import { defineConfig, globalIgnores } from "eslint/config";
+import nextVitals from "eslint-config-next/core-web-vitals";
+import nextTs from "eslint-config-next/typescript";
+
+const eslintConfig = defineConfig([
+  ...nextVitals,
+  ...nextTs,
+  // Override default ignores of eslint-config-next.
+  globalIgnores([
+    // Default ignores of eslint-config-next:
+    ".next/**",
+    "out/**",
+    "build/**",
+    "next-env.d.ts",
+  ]),
+]);
+
+export default eslintConfig;

next.config.ts

@@ -0,0 +1,7 @@
+import type { NextConfig } from "next";
+
+const nextConfig: NextConfig = {
+  /* config options here */
+};
+
+export default nextConfig;