Development Sprint: 2-Hour Challenge

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.

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.

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.

🏆 Judging Criteria

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.

🚀 Submission Guidelines

Please follow these steps carefully to ensure your project is evaluated:

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.

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).

---

🛠️ Approved Libraries & Tools

You are encouraged to utilize tools from the following categories to accelerate your development process and enhance your application's capabilities.

UI Components & Design Systems

• shadcn/ui - Beautifully designed, accessible components.
• Chakra UI - Simple, modular, and accessible component library.
• NextUI - Fast and modern React UI library.
• Radix UI - Unstyled, accessible components for building design systems.
• Mantine - A fully featured React components library.

Icons & Typography

• Lucide React - Consistent, clean icon toolkit.
• React Icons - Comprehensive library of popular icon sets.
• Heroicons - Hand-crafted SVG icons by the Tailwind CSS team.

Animation & 3D Graphics

• Framer Motion - Production-ready motion library for React.
• AutoAnimate - Zero-config, drop-in animations.
• GSAP - Advanced, professional-grade web animation.
• Three.js & @react-three/fiber - Tools for building 3D scenes in React.

Data Fetching & State Management

• React Query (TanStack Query) - Robust asynchronous state management.
• Zustand - Fast, scalable, and minimalistic state management.
• Axios - Promise-based HTTP client.

Forms, Validation & Editors

• React Hook Form - Performant and flexible form handling.
• Zod - TypeScript-first schema validation.
• TipTap - Headless, highly extensible rich text editor.

Maps, Charts & Data Visualization

• Recharts - Composable charting library built on React components.
• Chart.js & react-chartjs-2 - Flexible JavaScript charting.
• React Leaflet - Interactive maps integration for React.

Advanced Utilities

• dnd-kit - Modern drag-and-drop toolkit for React.
• date-fns - Comprehensive date utility library.
• Wagmi & viem - React Hooks for Ethereum/Web3 integration.
• Sonner - 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: Cryptocurrency data, live prices, and historical charts.
• Alpha Vantage: (Free key required) Real-time and historical stock market data.

E-commerce & Mock Data

• DummyJSON: Mock data for products, recipes, users, and carts.
• Fake Store API: E-commerce prototype data including products and categories.

Entertainment & Media

• The Movie Database (TMDB) API: (Free key required) Comprehensive data on movies, TV shows, and cast members.
• Spotify Web API: (Authentication required) Metadata for artists, albums, and tracks.
• PokeAPI: Extensive Pokémon database.
• Jikan API: Unofficial MyAnimeList API for anime and manga data.

Science & Geography

• NASA Open APIs: (Free key required) Astronomy Picture of the Day, Mars Rover photos, and near-Earth object data.
• REST Countries: RESTful API for global country data (population, demographics, flags).
• OpenWeatherMap: (Free key required) Current weather data and forecasts.

Sports

• TheSportsDB: Crowd-sourced sports data, team information, and artwork.
• balldontlie: 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.