OnboardJS

Stop Reinventing the Onboarding Wheel. Start Building.

Your users need smooth flows. You need clean code, faster. OnboardJS handles the messy state stuff so that you can focus on building.

Get startedView on GitHub
WelcomeStep.tsx
stepsConfig.ts
function WelcomeStep() {
  const { next } = useOnboarding()
  return (
    <div>
      <button onClick={next}>Next</button>
    </div>
  )
}

Multi-Step Onboarding Example

This is a full code example of a multi-step onboarding flow using OnboardJS. It includes two steps:

  • First Step: A welcome screen with a button to start the onboarding experience.
  • Second Step: A persona selection step where users can choose their role and provide additional information.
The example demonstrates how to use the useOnboarding hook to manage the onboarding state and navigate between steps.

Dependencies

@shadcn/card @shadcn/label @shadcn/input @shadcn/button
Initializing...