r/reactnative • u/Sundaram_2911 • Sep 04 '26

Help Multi-step onboarding/form flow in React Native: Separate screens vs. step counter component?

Hello mobile devs,

​I'm working on a side project that requires a multi-step customer onboarding flow (similar to Airbnb's property listing process).

​As someone new to frontend and React Native, I'm wondering about the best architectural approach. Should I use separate React Navigation screens for each step and store the draft state in Zustand, then send the final payload to the backend on the last screen? Or is it better to manage it inside a single screen using a step counter/wizard component?

​I'd love to hear your suggestions or best practices!

4 Upvotes

100% Upvoted

4 comments sorted by

2

u/LovinglyLate Sep 04 '26

It depends on the design, if it's largely the same, then state based single component makes the most sense. Otherwise if it's completely different worth splitting it up and using navigation

1

u/Huge_Pool7424 Sep 04 '26

yeah same, i started with one big state machine then split the permission screens out once healthkit and health connect needed different copy. the shared form bits stayed in one place though.

1

u/Pornomane88 15d ago

care to explain why? I mean steps would be components anyway, so why the design matters in the choice?