The Userfront Core JavaScript library is intended for use in frontend applications.
The Core library can be used for the following:
- Tokens: read the user's access token to send to your backend
- User info: information about the currently logged in user
- Authentication: signup, login, logout, and password reset tasks; these are useful for building custom forms and auth flows.
Full docs can be found in the Userfront guide:
https://userfront.com/docs/js.html
Install by npm (or yarn):
npm install @userfront/core --saveImport and initialize the library:
import Userfront from "@userfront/core";
Userfront.init("demo1234");// Import and initialize Userfront core JS
import Userfront from "@userfront/core";
Userfront.init("demo1234");
// Send a login link
Userfront.sendLoginLink("jane@example.com");
// Read the access token
Userfront.tokens.accessToken;
// => "eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJtb2RlIjoidGVzdCIsImlzQ29uZmlybWVkIjp0cnVlLCJ1c2VySWQiOjEsInVzZXJVdWlkIjoiZDAwNTlmN2UtYzU0OS00NmYzLWEzYTMtOGEwNDY0MDkzZmMyIiwidGVuYW50SWQiOiJwOW55OGJkaiIsInNlc3Npb25JZCI6IjRlZjBlMjdjLTI1NDAtNDIzOS05YTJiLWRkZjgyZjE3YmExYiIsImF1dGhvcml6YXRpb24iOnsicDlueThiZGoiOnsidGVuYW50SWQiOiJwOW55OGJkaiIsIm5hbWUiOiJVc2VyZnJvbnQiLCJyb2xlcyI6WyJhZG1pbiJdLCJwZXJtaXNzaW9ucyI6W119fSwiaWF0IjoxNjE3MTQ4MDY3LCJleHAiOjE2MTk3NDAwNjd9.gYz4wxPHLY6PNp8KPEyIjLZ8QzG3-NFJGPitginuLaU"
// Log the user out
Userfront.logout();
// Access the user's information
Userfront.user;
/** =>
* {
* email: "jane@example.com",
* phoneNumber: "+15558675309",
* name: "Jane Example",
* image: "https://res.cloudinary.com/component/image/upload/avatars/avatar-plain-9.png",
* data: {},
* username: "jane-example",
* isEmailConfirmed: true,
* isPhoneNumberConfirmed: false,
* confirmedEmailAt: "2020-01-01T00:00:00.000Z",
* confirmedPhoneNumberAt: "2020-01-01T00:00:00.000Z",
* isMfaRequired: false,
* createdAt: "2020-01-01T00:00:00.000Z",
* updatedAt: "2020-01-01T00:00:00.000Z",
* mode: "test",
* tenantId: "demo1234",
* userId: 1,
* userUuid: "d6f0f045-f6ea-4262-8724-dfc0b77e7dc9",
* }
*/-
npm build: build all library files
The build commands are split into two parts. build and build:beta both run these commands, which do not need to be run separately:
-
npm build:standard: build the standard library files:- ESM module
build/userfront-core.module.js - CJS module
build/userfront-core.js - UMD module
build/userfront-core.umd.js - Module with bundled dependencies, for import from CDN:
build/userfront-core.modern.mjs
- ESM module
