- Four pages: Home, Menu, About and Contact.
- Header and Footer at every page.
- Burger menu at mobile version.
- Burger menu animation.
- Helper with a list of items from the menu.
- Modal for each menu item to select quantity of sushi units to order.
- Map marker from Google API available in the About section.
- Adapt layout through different screen sizes.
- Persist menu status (open/closed) in the mobile version.
- React JS: An open-source JavaScript library for building user interfaces (UI) for web applications, known for its efficiency and component-based development paradigm.
- Styled-components: A library for React and React Native enabling writing CSS within JavaScript files using CSS-like syntax, facilitating styled component creation with encapsulated styles.
- React-router-dom: A library for handling navigation between pages in React web applications, enabling route creation and rendering specific components for each route.
- React-icons: A library providing high-quality icons for use in React applications, easily integrable with React components for visually appealing user interfaces.
- Google Maps JavaScript API: programming interface provided by Google that allows developers to embed interactive maps and location-based services into web applications using JavaScript.
- How to make a color filter for background image. It was important for contrast between image and text.
- Handle a helper to assist data to the Menu component.
- How to create and style modal component.
- Create a burger menu animation that 3 stripes switch to a 'X'.
- Consume the Google Maps API to show the restaurant geolocation.
- To work with form in React and handle functions.
- To set LocalStorage in the application.
- Clone the Repository:
git clone https://github.com/Antonio-Savio/sushi-restaurant.git
Create a clone of the project.
- Navigate to the Project Directory:
cd sushi-restaurant
Will change the path to the directory where the React application is located.
- Install Dependencies:
npm install
This command will install all the required dependencies listed in the package.json file.
- Run the Application:
npm start
This command starts the development server and opens your default web browser to display the React application.