Sign Up

​

Email + password

The <SignUpForm /> will create a new user in your database and create a session for them. Uses simple <Email /> and <Password /> fields, along with the useSignUp() hook. In most cases, you want to supply a callbackUrl, which is where the user will be redirected upon successful sign up and sign in.

​

Error handling

In the case of errors from the API, or you want to do something more custom with the response, a Response object will come back from the onSuccess function. This is true even for HTTP error status codes such as 4XX and 5XX. The API will return text informing you of the error, so simply use response.text() to obtain your error, or response.json() in the event that the API returned an ok response.

export default function SignUpPage() {
  const [error, setError] = error('')
  return (
    <SignUpForm 
      beforeMutate={() => {
        setError('')
      }}
      onSuccess={async (res) => {
        if (res.ok) {
          // something good happened
        } else {
          const error = await res.text();
          setError(error);
        }
      }}
      onError={(e)=> {
        console.error('Catastrophic failure 😭', e)
      }}
    />
  )
}

​

Custom sign up form

​

Related Components

• Sign In
• Sign Out
• User Profile