Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Multi-Step Form Using Vite + React

#react#vite
Leonardβ€’ 1,025

@leoikeh99

Desktop design screenshot for the Multi-step form coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
4advanced
View challenge

Design comparison


SolutionDesign

Solution retrospective


Any feedback is welcomed

Community feedback

Arseniyβ€’ 170

@ArseniyX

Posted

Hello, very nice work!

Requirements miss matches:

  1. Name field should accept: only word's characters and spaces
  2. Phone field should accept only numbers and + symbol
  3. Cannot submit form any numbers show invalid phone number

Technical problems:

  1. css variables convention is wrong --White should be kebab case and don't use color name as var name it should be like main-background-color
  2. index.jsx you use as main file of component. it will make difficult to find files
  3. its return undefined sometimes plan ${plan.option === selectedPlan && "selected"}

Marked as helpful

1
visualdennisβ€’ 8,255

@visualdenniss

Posted

Hey,

congrats on completing the project! It is nice that you validate the form, but i'm stuck on invalid number, even if i entered the placeholder suggestion itself like +1 234 567 890 it still says invalid number. You might consider fixing that.

Hope that's helpful.

Marked as helpful

1

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord