A project by Fiza Saleem and Caroline Englund

The Holiday Planner - Survey Project(week 5)

This is the weekly project in the course JavaScript and React by Techingo(https://www.technigo.io/). The main goal with this project was learn how to work with form and the useState() hook in React.

View it live

Project link: Holiday Planner - A React Project

About the Holiday Planner

The user can use this little website to plan their dream holiday. Based on the user's input and answers to the question the dream holiday is planned.

Getting Started with the Project

Dependency Installation & Startup Development Server

Once cloned, navigate to the project's root directory and this project uses npm (Node Package Manager) to manage its dependencies.

The command below is a combination of installing dependencies, opening up the project on VS Code and it will run a development server on your terminal.

npm i && code . && npm run dev

The Problem

The team worked on this project remotely using vscode, git, github, slack and figma as collaboration tools.

The project process

• Planning and task dividing
• Project setup UX flow
• Creating a basic styleguide
• Creating UI Components in React
• Developing the basic flow and interaction with React
• Styling the survey with CSS
• Working on form validation

Dev Technologies and Tools

• React
• Vite
• JavaScript
• CSS
• Figma

Future works

In the future, the app can be improved to enhance user experience by allowing users to press the Enter key to move to the next question instead of relying solely on the continue button. Additionally, there's a bug when navigating backward in the form that needs fixing.

Instructions

See instructions of this project