🍽️ Foodie - Modern Food Ordering Application

A full-stack food ordering application built with React, TypeScript, Node.js, and MongoDB. Features a modern, responsive UI with smooth animations and a comprehensive food ordering experience.

✨ Features

• 🔐 User authentication (Register/Login)
• 🍕 Browse food menu with beautiful card layouts
• 🛒 Shopping cart functionality
• 👨‍🍳 Meet our chefs section
• 📱 Fully responsive design
• 🖱️ Interactive mouse trail effects
• 🏠 Dynamic homepage with hero section
• 💫 Modern UI with smooth animations
• 📞 Contact form for customer support

🛠️ Tech Stack

Frontend

• React 18 with TypeScript for robust type safety
• Tailwind CSS for modern, responsive styling
• Vite as build tool for fast development
• React Router v6 for client-side routing
• Context API for state management
• Framer Motion for smooth animations
• Axios for API requests
• React Icons for consistent iconography

Backend

• Node.js with Express.js framework
• MongoDB with Mongoose ODM
• JWT for secure authentication
• Bcrypt for password hashing
• CORS for cross-origin resource sharing
• Express Validator for request validation
• Multer for file uploads
• Nodemailer for email notifications

🚀 Getting Started

Prerequisites

• Node.js (v16 or higher)
• MongoDB installed and running
• npm or yarn package manager

Installation

1. Clone the repository

git clone <repository-url>
cd Food-App

2. Install dependencies for both client and server

# Install client dependencies
cd client
npm install

# Install server dependencies
cd ../server
npm install

3. Set up environment variables Create .env files in both client and server directories with necessary configurations.

4. Start the development servers

# Start backend server
cd server
npm start

# In a new terminal, start frontend
cd client
npm run dev

📁 Project Structure

Food-App/
├── client/                 # Frontend React application
│   ├── src/
│   │   ├── Components/    # Reusable UI components
│   │   ├── pages/        # Page components
│   │   ├── context/      # React context providers
│   │   ├── data/         # Static data and configurations
│   │   └── hooks/        # Custom React hooks
│   │
├── server/                # Backend Node.js application
│   ├── Controllers/      # Request handlers
│   ├── Models/           # Database models
│   ├── Routes/           # API routes
│   └── DB/              # Database configuration

🔥 Features in Detail

• Authentication: Secure user registration and login system
• Food Menu: Browse through various food items with detailed descriptions
• Shopping Cart: Add items, adjust quantities, and proceed to checkout
• Popular Foods: Showcase of trending and popular food items
• Chef Profiles: Meet the talented chefs behind the delicious food
• Responsive Design: Works seamlessly on desktop, tablet, and mobile devices

🤝 Contributing

We welcome contributions to improve Foodie! Here's how you can help:

1. Fork the repository
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add: AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

Please ensure your Pull Request adheres to the following guidelines:

• Follow the existing code style
• Update documentation as needed
• Test your changes thoroughly
• Write descriptive commit messages

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

📞 Support

If you encounter any issues or have questions, please:

• Open an issue in the GitHub repository
• Contact us through the application's contact form
• Email us at [support email]

🌟 Acknowledgments

• Thanks to all contributors who have helped shape Foodie
• Special thanks to our amazing chef partners
• Icons provided by [icon provider]
• UI inspiration from modern food delivery apps

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.

---

Made with ❤️ by Durgeshwar