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

Responsive Multi Step Form

#tailwind-css#typescript#vite#vue#accessibility
Mahmoud Tarekβ€’ 650

@mahmoudAcm

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


First-Time Vue Experience: Responsive Multi-Step Form Challenge

I recently took on a challenge to create a responsive multi-step form using Vue.js. Previously, I had tackled the same project using React. You can check out my React.js solution here.

I'm eager to receive feedback from the Vue.js community to ensure I made the right decisions for this specific Vue project, considering it's my first time using Vue. If there's a better way I could have built it or any improvements you suggest, please don't hesitate to share your insights. Your feedback will be greatly appreciated!

Happy coding! πŸš€

Community feedback

P
Felipe Stefaniβ€’ 330

@felipestefani

Posted

Hey, Mahmoud!!

Your designs are always great! I've been following you since a while and it's very good to see how your projects are.

In this one, the only observation to do is in your logic. When selecting the additional, whether selected or not, the total includes all of them. I didn't check the code at all, but thinking about it it's a simple thing to correct.

Beside that, as I've already said, I love to see the results you show to us ☺️

1

Mahmoud Tarekβ€’ 650

@mahmoudAcm

Posted

@felipestefani thank you for your words 😊

0
Mahmoud Tarekβ€’ 650

@mahmoudAcm

Posted

@mahmoudAcm do you talk about plan (second step)?

0
P
Felipe Stefaniβ€’ 330

@felipestefani

Posted

@mahmoudAcm the third one, on the pick add-ons

If you select one, three or even none, the total in the fourth step counts like if all are selected

0
Mahmoud Tarekβ€’ 650

@mahmoudAcm

Posted

@felipestefani no it is not the total this is the price of the plan select one and see the total you will understand.

0
P
Felipe Stefaniβ€’ 330

@felipestefani

Posted

@mahmoudAcm I don't really know what's happening!

If I go until the step 4, with some add-ons selected and then go back to change what I want, the next time I achieve the step four, doesn't matter what I selected... some box still selected.

Have to do some test to understand what I'm saying πŸ˜….

Try select some box and then change them to see if anything happens. Then let me know, cuz I'm confused rigth now lol πŸ˜‚πŸ˜‚

0
P
Felipe Stefaniβ€’ 330

@felipestefani

Posted

@mahmoudAcm It can be happening in my pc as well! Some kind of bug

0
Mahmoud Tarekβ€’ 650

@mahmoudAcm

Posted

@felipestefani maybe you are right

0
Mahmoud Tarekβ€’ 650

@mahmoudAcm

Posted

@mahmoudAcm i feel like it happened before trying to catch but didn't after you told me.

1
Mahmoud Tarekβ€’ 650

@mahmoudAcm

Posted

@mahmoudAcm Or I think I'm hallucinating

0
Eric Teyeβ€’ 40

@ericaimhigh1

Posted

I'd say that's a great one.

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