This is the README file for the capstone project of my Meta Front-End Developer Certificate. The project is titled Little Lemon Restaurant.

https://littlelemon-vert.vercel.app/

Little Lemon Restaurant is a web application developed using React, Tailwind CSS, react-hot-toast, Jest, react-router-dom, and i18next for translation. The app includes various features such as image animation, responsive design, multilingual support (English, French, German), page routing using react-router, toast notifications with react-hot-toast, and a reservation form for reserving organization at Little Lemon Restaurant. Additionally, it includes a contact page with a contact form.

To run this project locally, please follow these steps:

Clone the repository: git clone https://github.com/asimowsky/Meta-Frontend-Dev-Capstone.git Navigate to the project directory: cd Meta-Frontend-Dev-Capstone Install dependencies: npm install Start the development server: npm start The application will then be accessible at http://localhost:3000.

Image Animation The web app incorporates image animation to enhance the user experience and make the interface more engaging.

Responsive Design The application is built with a responsive design, ensuring that it adapts and looks great on different devices and screen sizes.

Multilingual Support Little Lemon Restaurant supports three languages: English, French, and German. The i18next library is used for translation purposes, allowing users to switch between languages seamlessly.

Page Routing React Router is utilized for page routing, enabling users to navigate through different sections of the web app easily.

Toast Notifications Toast notifications are implemented using the react-hot-toast library. Users receive notifications when performing certain actions, providing them with feedback and updates.

Reservation Form The main feature of the app is a reservation form for reserving an organization at Little Lemon Restaurant. When a user makes a reservation, the data is saved to local storage, and the reservation details are displayed as cards below the form. Users also have the ability to delete a reservation if needed.

Contact Page The application includes a contact page with a contact form. Users can fill out the form to get in touch with the organization or leave feedback.

React: JavaScript library for building user interfaces. Tailwind CSS: Utility-first CSS framework. react-hot-toast: Library for toast notifications. Jest: JavaScript testing framework. react-router-dom: Declarative routing for React applications. i18next: Internationalization framework for translating web apps.

Here are some potential areas for future enhancements:

Adding user authentication for personalized reservations and contact interactions. Implementing a backend server to store reservation data securely. Improving accessibility by adding proper ARIA attributes and focus management. Enhancing the reservation form with validation and input restrictions. Integrating an external map API to display the location of Little Lemon Restaurant.

Contributions to this project are currently not open. However, you're welcome to fork the repository and make any modifications or improvements for your personal use. Some images are used from unsplash and pexels (Free) also some free icons from flaticon.

This project is licensed under the MIT. Feel free to review the LICENSE file for more information.

Special thanks to META Team for their guidance and support throughout the capstone project.

For any questions or inquiries regarding this project, please contact Me at [email protected].

Feel free to visit my GitHub profile: https://github.com/asimowsky