Docs

Quickstart

This quickstart will get you up and running with auth in about 10 minutes.

1. Add your signup form

HTMLReactVue

Install the Userfront Toolkit

Install @userfront/toolkit with npm (or yarn).

Use the Vue signup form component

Initialize the Userfront Vue library with your workspace ID using Userfront.init().

Import SignupForm and add it as a component in your <script> section.

Add the <signup-form /> component to your <template>.


View a working example

2. Use your signup form

Give it a try: fill out your signup form and submit it.

Upon successful signup, the form does 2 things:

  1. Redirects the browser to /dashboard.

    We'll edit this next.

  2. Adds a secure access token named access.WORKSPACE_ID to your browser's cookies.

    This token is a JWT with the user's information, which you can send to your own backend.

Your form is in test mode, which means it creates a user record in your test environment when the form is submitted.

3. Set your redirect & domain

In your Paths & routing page, update the After-signup path to /home.

Now when you re-submit your signup form, you should be redirected to /home.

4. Add login and others

Follow the same process for your other tools:

Add a login form to your /login page.
Add a password reset form to your /reset page.
Add a logout button anywhere you need it.

When you deploy your tools to any of your live domains, they will work in live mode automatically.

Finished

Congratulations, you've added auth to your site.

To enable live mode, add your website to the list of live domains on the Live domains page.

Whenever a form loads at a live domain, it will automatically be in live mode.