Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mibei-collins/little-lemon-web-application
https://github.com/mibei-collins/little-lemon-web-application
Last synced: 8 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/mibei-collins/little-lemon-web-application
- Owner: Mibei-Collins
- Created: 2024-02-15T07:55:38.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2024-02-15T08:13:43.000Z (12 months ago)
- Last Synced: 2024-11-16T13:05:43.796Z (2 months ago)
- Language: JavaScript
- Size: 81.6 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Little Lemon website
This is a concept website for a resturant named Little Lemon, which included the home page of the site + the reserving a table page
## Table of contents
- [Overview](#overview)
- [The challenge](#the-challenge)
- [Screenshot](#screenshot)
- [Built with](#built-with)
- [What I learned](#what-i-learned)
- [Continued development](#continued-development)
- [Useful resources](#useful-resources)## Overview
### The challenge
- Build out the project to the designs provided
- Making sure it's fully responsive and works for all screen widths
- Making sure the reserve a table page and forms inside it comply to Ux/Ui design prenciples### Screenshot
![](./src/components/imgs/HomePage1.png)
![](./src/components/imgs/HomePage2.png)
![](./src/components/imgs/HomePage3.png)
![](./src/components/imgs/Booking1.png)
![](./src/components/imgs/Booking2.png)### Built with
- Semantic HTML5 markup
- CSS custom properties
- Tailwind CSS
- Flexbox
- CSS Grid
- Mobile-first workflow
- [React](https://reactjs.org/) - JS library
- [TailwindCss](https://tailwindcss.com/) - CSS framework
- [Form library](https://formik.org/) - For forms
- [Yup library](https://www.npmjs.com/package/yup/) - For form validation
- [Framer Motion library](https://www.framer.com/motion/) - For element animations
- [Figma](https://www.figma.com/) - For designing mockups