The Marwa project is a high-performance, responsive, multi-page restaurant website built with a modern stack centered on Next.js 16 (App Router) and TypeScript. It uses Tailwind CSS for styling and prioritizes a smooth user experience through advanced animation tools like GSAP and the View Transition API for seamless page navigation. The architecture is designed for speed, utilizing features like lazy loading and optimized image delivery to meet high Core Web Vitals standards.. View Demo 🌐

• 🎨 Fully responsive layout ensures an optimal viewing and booking experience on all devices.
• 🎯 The entire codebase is written in TypeScript for enhanced type safety and maintainability.
• 🔰 Utilizes GreenSock Animation Platform for fluid and engaging transitions and UI feedback.
• 🦄 Implements the latest View Transition API for smooth, native-feeling page navigation.
• ⚡️ Ensures fast load times by lazily loading visual content and optimizing asset delivery.
• 🚀 Built with a strong emphasis on Core Web Vitals and accessible design principles.

• Framework: Next.js 16 with App Router
• Language: TypeScript
• Styling: Tailwind CSS
• Animation / Interaction: GSAP, lenis (smooth scroll), next-view-transitions
• UI helpers: SwiperJS, react-icons

• Core Web Vitals: Prioritizes LCP, FID, and CLS for a smooth user experience.
• Image Optimization: Uses next/image for lazy loading and modern formats.
• Code Splitting: Next.js App Router automatically splits code by route.
• View Transitions: Provides seamless navigation without full reloads.
• Smooth Scrolling: Lenis implementation for optimized scroll performance.

├── public/
│   └── img/
├── src/
│   ├── app/
│   │   ├── about-us/
│   │   ├── booking/
│   │   ├── contact-us/
│   │   ├── menu/
│   │   ├── privacy-policy/
│   │   ├── globals.css
│   │   ├── layout.tsx
│   │   ├── not-found.tsx
│   │   └── page.tsx
│   ├── assets/
│   │   └── img/
│   ├── components/
│   │   ├── animations/
│   │   ├── cards/
│   │   ├── flags/
│   │   ├── sections/
│   │   ├── shared/
│   │   ├── ui/
│   │   ├── Footer.tsx
│   │   ├── Header.tsx
│   │   └── LoaderHandler.tsx
│   ├── data/
│   │   ├── dishes.ts
│   │   └── reviews.ts
│   ├── lib/
│   │   ├── contants.ts
│   │   ├── customEases.ts
│   │   └── utils.ts
│   └── types.ts
├── eslint.config.mjs
├── next-env.d.ts
├── next.config.ts
├── package.json
├── postcss.config.mjs
├── README.md
└── tsconfig.json

We welcome contributions to enhance our application. Please follow these steps:

1. Fork the repository.

2. Create a new branch (git checkout -b feature/amazing-feature).

3. Commit your changes (git commit -m 'feat: Add amazing feature').

4. Push to the branch (git push origin feature/amazing-feature).

5. Open a Pull Request.

Repository owner: EL-OUARDY
Contact: contact@wadi3.codes