OnboardJS
Github

Headless Onboarding for React. No Overlays. Full Control.

State management, analytics, and persistence built-in. Skip the tour library limitations. Deploy custom flows in minutes.

Star us 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...