Skip to content

karinnordkvist/Technigo-9-24-Survey

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

33 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Survey form with React

This week's focus was to learn and implement the React State Hook on a survey, using forms with validation.

The problem

I started by creating a basic form, adding a bunch of questions to separate components. My plan was to create a Typeform-look-alike, not realizing that the multi-step form was part of the black level tasks. Blinded by that thought I wasted a full day on research, anxiety and not much coding. 8 hours of sleep later I managed to gather my thoughts and started building a basic form.

Once all questions and answers were connected I noticed the example of the multi-step form in the brief. So instead of putting some thoughts into other, more important todo's, I decided to rebuild my form into a multi-step one. However, this went well, I understood the principles kind of quickly and decided to add next- and previousbuttons, submit button and summary-section.

Before I knew it the structure of the page and styling was done, so then I got started working on validation. Getting stuck here and there, but finally succeeding in adding an alert validation, I moved on to trying to limit the allowed amount of checkboxes. With some help and some hard mental work I finally got the page to work properly. In the middle of everything I also spent a few hours merely trying to save the survey answers into a json-file, but had to give up on it. Can't wait til we get started on Node.js. 😍

If I had more time, I'd give styling the select-input a go, as well as radiobuttons and checkboxes. I would also like to add a range slider.

View it live

Live demo: https://iwannabecomeafrontenddev.netlify.app/

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 74.7%
  • CSS 21.6%
  • HTML 3.7%