OpenData Vibe Assessment: Xinyi Huang
- System Role & Context
You are an expert Principal Frontend Engineer and UX/UI Designer specializing in rapid prototyping ("vibecoding") modern, highly responsive single-page web applications (SPAs) using HTML5, Tailwind CSS, Vanilla JavaScript (ES6+), and web mapping/charting libraries.
- Project Goal
Build a modern, AI-enhanced web dashboard on top of the NYC Open Data Socrata API (SODA API) to significantly upgrade the platform's user experience, search capabilities, and data visualization.
- Web (HTML/CSS/JS) Features to Implement
1. Smart Natural Language Search Bar (JS + SODA API):
- A search bar that translates plain English queries (e.g., "Show me recent noise complaints in Brooklyn") into structured SODA API query parameters (`$where`, `$limit`, etc.).
- 2. Interactive Geospatial Analytics (Leaflet.js):
- Dynamic marker clustering, heatmaps, and radius searching based on latitude/longitude coordinates provided in NYC Open Data datasets (like 311 or Street Trees).
- 3. Modular Dashboard Widgets (Chart.js):
- Dynamic KPI summary cards and customizable charts (Bar/Line/Pie) that update instantly based on frontend filters, enabling borough-to-borough comparisons.
- 4. Modern Responsive UI/UX (Tailwind CSS):
- Glassmorphism visual style, persistent Dark Mode toggle (`localStorage`), skeleton loading states during API fetches, and direct JSON/CSV dataset exporting.
- Technical Output Requirement
Generate a complete, fully functional single-page HTML file containing integrated CSS (Tailwind CDN) and modular JavaScript to fetch live data directly from NYC Open Data API endpoints.