🍽️: Food Order App

This application allows users to place food orders. The form includes the following inputs: dish name, preparation time, and dish type (pizza, sandwich, or soup). Depending on the selected type, additional inputs are displayed.

Creating the project took me approximately 12 hours.

TypeScript • React • React Final Form • React Router • SCSS • Git • Figma

---> check out the live project

💡 Features

• Design the application layout using Figma.
• Implement the application using React and TypeScript.
• Utilize React Final Form for efficient form handling.
• Apply SCSS for styling the user interface.
• The form contains the following input fields:
  • Dish name: Allows users to enter the name of the dish (text input).
  • Preparation time: Enables users to specify the time required for dish preparation (formatted as 00:00:00).
  • Dish type: Offers a selection of pizza, sandwich, or soup (select input).
• Depending on the selected dish type, additional input fields are dynamically displayed.
• The form data is submitted via a POST request as JSON to the endpoint: https://umzzcc503l.execute-api.us-west-2.amazonaws.com/dishes/.

⚙️ Installation and Usage

The project uses node v16.13.1, npm 9.3.1. To run it locally you should install all dependencies:

npm i

To run webpack and create a localhost port you should type:

npm start

 

📫 Feel free to contact me: krolikowska.ann@gmail.com