🍹 Greene King Bar Website

[] [] [] []

A modern, responsive, and interactive bar website built with React, Vite, and Tailwind CSS. Featuring smooth animations, Lottie files, and Radix UI components, this website provides an engaging experience for bar visitors.

---

🌐 Live Demo

Check the live version here:

👉 https://greeneking-client.vercel.app/

---

✨ Features

• ✅ Fully responsive for all devices (mobile, tablet, desktop)
• ✅ Smooth animations with AOS, Framer Motion, and animate.css
• ✅ Lottie animations for engaging visuals
• ✅ Radix UI components for accessible design
• ✅ Routing using React Router DOM
• ✅ Forms handled with React Hook Form
• ✅ Notifications via React Toastify and SweetAlert2
• ✅ SEO optimization with React Helmet Async
• ✅ Firebase integration for backend services

---

🎨 Screenshots

Homepage

Menu Section

Contact / Reservation

---

---

🧰 Tech Stack

• Frontend: React 18, Vite, Tailwind CSS
• Animations: Framer Motion, AOS, Animate.css, Lottie
• UI Components: Radix UI, Lucide React Icons
• Forms & Validation: React Hook Form
• HTTP Requests: Axios
• Notifications: React Toastify, SweetAlert2
• Routing: React Router DOM
• State Management / Data Fetching: @tanstack/react-query
• Backend / Services: Firebase

---

💻 Installation

Clone the repository:

git clone https://github.com/najatul6/greeneking-Client.git
cd greeneking-Client

Install dependencies:

npm install

---

⚡ Usage

Run the development server:

npm run dev

Open http://localhost:5173 to view in the browser.

Build for production:

npm run build

Preview the production build:

npm run preview

---

📁 Folder Structure

greeneking-Client/
│
├─ public/              # Static assets (images, videos, fonts)
├─ src/
│  ├─ assets/           # Images, videos, Lottie files
│  ├─ components/       # Reusable React components
│  ├─ pages/            # Page components (Home, About, Contact)
│  ├─ hooks/            # Custom React hooks
│  ├─ utils/            # Utility functions
│  ├─ App.jsx           # Main app component
│  └─ main.jsx          # Entry point
├─ package.json
├─ tailwind.config.js
└─ vite.config.js

---

🧪 Available Scripts

• npm run dev — Starts the development server
• npm run build — Builds the project for production
• npm run preview — Previews the production build
• npm run lint — Runs ESLint to check code quality

---

🤝 Contributing

Contributions are welcome!

1. Fork the repository
2. Create a new branch: git checkout -b feature/your-feature
3. Make changes and commit: git commit -m 'Add feature'
4. Push to the branch: git push origin feature/your-feature
5. Open a pull request

---

📄 License

This project is licensed under the MIT License.

---

📬 Contact

Created by Md Najatul Islam – feel free to reach out for questions or collaborations!