Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/codingbygopal/aromaa-next.js
AroMaa is built with Next.js 15, Tailwind CSS, and Shadcn/UI, leveraging ISR (Incremental Static Regeneration), Streaming with Suspense, server-side pagination, and filtering with URL state management. The app also supports Dark/Light mode and achieves top-tier Lighthouse performance.
https://github.com/codingbygopal/aromaa-next.js
foodrecipeapp front-end-development frontend incremental-static-regeneration next-js nextjs nextjs-typescript nextjs15 nextjs15-rc nextjs15example reactjs responsive seo seo-optimization shadcn shadcn-ui tailwindcss
Last synced: 23 days ago
JSON representation
AroMaa is built with Next.js 15, Tailwind CSS, and Shadcn/UI, leveraging ISR (Incremental Static Regeneration), Streaming with Suspense, server-side pagination, and filtering with URL state management. The app also supports Dark/Light mode and achieves top-tier Lighthouse performance.
- Host: GitHub
- URL: https://github.com/codingbygopal/aromaa-next.js
- Owner: CodingByGopal
- Created: 2024-11-06T14:41:15.000Z (about 2 months ago)
- Default Branch: master
- Last Pushed: 2024-11-29T08:22:33.000Z (26 days ago)
- Last Synced: 2024-12-02T23:07:35.935Z (23 days ago)
- Topics: foodrecipeapp, front-end-development, frontend, incremental-static-regeneration, next-js, nextjs, nextjs-typescript, nextjs15, nextjs15-rc, nextjs15example, reactjs, responsive, seo, seo-optimization, shadcn, shadcn-ui, tailwindcss
- Language: TypeScript
- Homepage: https://aromaa.vercel.app
- Size: 6.44 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 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:
![Lighthouse Score](https://raw.githubusercontent.com/CodingByGopal/imagesAsLink/refs/heads/main/aromaa/aromaa-lighthouse.JPG)---
## **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 Dark](https://raw.githubusercontent.com/CodingByGopal/imagesAsLink/refs/heads/main/aromaa/home-dark.png)### **Home Page (Light Theme)**
![Home Light](https://raw.githubusercontent.com/CodingByGopal/imagesAsLink/refs/heads/main/aromaa/home-light.png)### **Recipes Page (Dark Theme)**
![Recipes Dark](https://raw.githubusercontent.com/CodingByGopal/imagesAsLink/refs/heads/main/aromaa/recipes-dark.png)### **Recipes Page (Light Theme)**
![Recipes Light](https://raw.githubusercontent.com/CodingByGopal/imagesAsLink/refs/heads/main/aromaa/recipes-light.png)### **Recipe Details Page (Dark Theme)**
![Details Dark](https://raw.githubusercontent.com/CodingByGopal/imagesAsLink/refs/heads/main/aromaa/details-dark.png)### **Recipe Details Page (Light Theme)**
![Details Light](https://raw.githubusercontent.com/CodingByGopal/imagesAsLink/refs/heads/main/aromaa/details-light.png)---
**Built with**:
- **Next.js 15** for unmatched performance.
- **Tailwind CSS** for responsive design.
- **Shadcn/UI** for modern, polished components.