AroMaa - Food Recipes App (Next.js 15)

Tech Stack: Next.js 15, Tailwind CSS, Shadcn/UI, DummyJSON API

AroMaa is a cutting-edge, responsive food recipe app leveraging the latest web technologies for superior performance, accessibility, and SEO.

---

Key Features

• ISR (Incremental Static Regeneration): Ensures fast builds and fresh content without requiring full rebuilds.
• Streaming with Suspense: Enables progressive data rendering for a seamless user experience.
• Server-Side URL-Based Pagination & Filtering: Optimized for large recipe collections with shareable, SEO-friendly URLs.
• Bookmarkable URLs: Easily share specific filtered views or recipes.
• Latest Async Request API: Efficiently handles params and searchParams.
• React 19: Built on the latest React version for modern capabilities.
• Next Font: Provides performance-optimized typography.
• Dynamic Sitemap Generation: Automatically creates up-to-date sitemaps for search engines.
• Static and Dynamic Metadata Generation: Enhances SEO and social sharing with auto-generated metadata.
• URL-Based State Management: Allows bookmarking and sharing specific filters and views.
• Best Web Vitals Scores (Lighthouse): Exceptional performance metrics verified by Lighthouse.
• Fully Mobile-Responsive Design: Optimized for all screen sizes and devices.

---

Performance

Check out the Lighthouse Report for AroMaa:

---

Themes

The app supports both Dark and Light themes, providing a user-friendly, accessible interface.

---

Responsiveness

AroMaa is fully optimized for all screen sizes, ensuring a seamless experience across devices.

---

Previews

Home Page (Dark Theme)

Home Page (Light Theme)

Recipes Page (Dark Theme)

Recipes Page (Light Theme)

Recipe Details Page (Dark Theme)

Recipe Details Page (Light Theme)

---

Built with:

• Next.js 15 for unmatched performance.
• Tailwind CSS for responsive design.
• Shadcn/UI for modern, polished components.