Add Password Based Accounts to Your App

Now, in addition to signing in with Google, your users can create their own password based accounts for your app. 

To maximize conversion, the sign up process for your app needs to be as flexible as possible. That’s why we’re launching password based user registration this week. Previously, Midtype projects could only allow their users to sign in and register with a valid Google account. Now, any user can create an account for your Midtype project with their email and a custom password.

How to Use It

  1. Start by ensuring your Midtype app has a name. This will be used in email verification messages sent to your users. Go to the project settings page and click “Edit” next to where it says “Project Name.”

Give your project a display name.
Give your project a display name.

  1. Once your project has a name, go to the project authentication page, where you’ll see a new section called “Custom User Registration.” Before you can enable it, you must add at least one verification URL. When a new user enters their email to sign up, Midtype will send them an email with this link to verify they own that address. Midtype will append a verification code to the end of the URL as a query parameter, for example, https://foo.com/verify?code=?token=[VERIFICATION_CODE]. You will need this code to create an account for the user.

Add at least one verification URL and enable Custom User Registration.
Add at least one verification URL and enable Custom User Registration.

  1. Now, you can enable Custom User Registration and deploy a new version of your project.

  2. Once your project is deployed, you’re ready to start registering new users. On your site, perform a GraphQL mutation to mVerifyEmail with the user’s email and the verification URL to use (this must be one of the URLs in step 2):

mutation {
  mVerifyEmail(
    input: { email: "jane.doe@example.com", url: "https://foo.com/verify" }
  ) {
    success
  }
}
  1. The user will receive an email with the verification link. When they click it, they’ll be redirected to your site, with the verification code as a query parameter. Your frontend must grab the code and use it in the second GraphQL mutation.

  2. Ask the user for other information for their profile, mainly their name and a valid password (at least 8 characters). Use this information in a second GraphQL mutation to createMUser that includes the code included in the URL:

mutation {
  createMUser(
    input: {
      name: "Jane Doe"
      password: "[PASSWORD]"
      token: "[VERIFICATION_CODE]"
    }
  ) {
    jwtToken
  }
}

The response to this mutation includes the JWT that you can now use to authenticate subsequent API requests with the user’s credentials.

Need to launch your web app tomorrow? Leave it to Midtype.

Midtype helps builders launch and iterate on web apps at light speed. We provide a hosted backend with user login, payments, a database, and much more built in. We allow you to focus on your core product without reinventing the wheel.

Midtype as a Firebase Alternative

Firebase is a great platform on which to build a web app. It provides authentication, a massively scalable NoSQL datastore with real-time…

Introducing the Midtype Developer Plan

Based on customer feedback, Midtype is launching a budget-friendly $5/month Developer plan. After launching Midtype broadly last week, we…

Announcing Assets Storage and Invite-Only Registration

Announcing asset storage, a way for you to efficiently upload and retrieve files attached to your project.We spent a long time thinking…