Get to know our frameworks

Select an app template built on your preferred framework.

Build apps on our native app editor. Use drag and drop elements, Velo code and Wix APIs to develop custom features.

Streamline your app development process with the Wix CLI. Get a familiar developer experience with minimal setup and configuration.

Take full control over your app's tech stack, deployment, and hosting.

App templates

Wix Blocks templates

Wix CLI templates

Self-hosted templates

Kickstart your app development with templates built on your preferred Wix developer tool. Browse templates for practical foundation and get to know the Wix ecosystem.

Wix App Templates for Developers

This example apps can be used as a starting point for building your own app, for concrete examples of how to use Wix framework, or for inspiration.

Choose a template.<0 />Build an app.

Browse by:

How to build it step by step:

This template is built with:

Read how this template was built, step by step.

How we built this template

Deployment instructions:

Choose a package manager and run the command in your terminal.

Copy command

Before you get started, make sure you have the following:

Prerequisite steps

Get started with Wix CLI

Begin by setting up your Next.js project with your preferred hosting platform.

Select your hosting service

Start the deployment flow and set up your template repo on Netlify. After you finish set up, come back here and add your Netlify custom domain.

Copy the code from our Git repo to deploy your app on any platform that supports Next.js.

Start the deployment flow and set up your template repo on Vercel. After you finish set up, come back here and add your Vercel generated URL.

Add the base URL and give your app a name.

App details

Go to the app dashboard and test your app to ensure a smooth integration within the Wix ecosystem. <0>Learn more about app checks and testing</0>

Define your environment

Terminal

Related templates

Note

Warning

Your app name will be used as the namespace suffix.

Name your app to generate a namespace. This lets you refer to your app in code later on.

Go Headless

Build Apps

Client

API Preview

Ricos

Develop Websites

REST

Velo

GraphQL (Alpha)

options

ApproveOptions

Approves a pending member using an ID, email address or approval token.

Tokens must be approved within 30 hours of token creation.
Use the `approvalToken` parameter returned from the
[`register()`](#register) function when approving a member by `token`.

> **Note:**
> A new member's status is `"PENDING"` when the site's membership policy is set to manual approval.
> To learn more about setting your site's membership approval policy, see
> [Editing Your Member Signup Settings](https://support.wix.com/en/article/editing-your-member-signup-settings-for-the-default-form).

Members are typically associated with a contact, each having a distinct member and contact ID. When passing the ID as a parameter, avoid presuming the IDs are identical since they represent separate entities.

import { authentication } from 'wix-members.v2';

async function approve(options) {
  try {
    const result = await authentication.approve(options);
    return result;
  } catch (error) {
    console.error(error);
    // Handle the error
  }
}


approve example for dashboard page code

import { authentication } from 'wix-members.v2';
import { webMethod, Permissions } from 'wix-web-module';
import { elevate } from 'wix-auth';

const elevatedApprove = elevate(authentication.approve);

export const approve = webMethod(
  Permissions.Anyone,
  async (options) => {
    try {
      const result = await elevatedApprove(options);
      return result;
    } catch (error) {
      console.error(error);
      // Handle the error
    }
  }
);


approve example for exporting from backend code

approve

ApproveMemberResponse

Options for blocking a member from logging in.

BlockOptions

Blocks a member from logging in to the site using an ID or email address.

To unblock the member and allow them to log in to the site, use the [`approve()`](#approve) function.

import { authentication } from 'wix-members.v2';

async function block(options) {
  try {
    const result = await authentication.block(options);
    return result;
  } catch (error) {
    console.error(error);
    // Handle the error
  }
}


block example for dashboard page code

import { authentication } from 'wix-members.v2';
import { webMethod, Permissions } from 'wix-web-module';
import { elevate } from 'wix-auth';

const elevatedBlock = elevate(authentication.block);

export const block = webMethod(
  Permissions.Anyone,
  async (options) => {
    try {
      const result = await elevatedBlock(options);
      return result;
    } catch (error) {
      console.error(error);
      // Handle the error
    }
  }
);


block example for exporting from backend code

block

void

string

newEmail

Options for changing a login email address.

ChangeLoginEmailOptions

Changes a member's login email address.

After running this function, the specified member can log in with the new email address. If the member uses social login (for example, Google login) and the member tries to log in with the old email address, they will be re-registered with the old email address.

Site collaborators can use `changeLoginEmail()` to change another member's login email. Members who are not site collaborators can use `changeLoginEmail()` to change their own login email only.

> **Note:** `changeLoginEmail()` cannot be used to change the login email of a site collaborator. Site collaborators can change their login emails from their Wix [account settings](https://manage.wix.com/account/account-settings).

import { authentication } from 'wix-members.v2';

async function changeLoginEmail(id, newEmail, options) {
  try {
    const result = await authentication.changeLoginEmail(id, newEmail, options);
    return result;
  } catch (error) {
    console.error(error);
    // Handle the error
  }
}


changeLoginEmail example for dashboard page code

import { authentication } from 'wix-members.v2';
import { webMethod, Permissions } from 'wix-web-module';
import { elevate } from 'wix-auth';

const elevatedChangeLoginEmail = elevate(authentication.changeLoginEmail);

export const changeLoginEmail = webMethod(
  Permissions.Anyone,
  async (id, newEmail, options) => {
    try {
      const result = await elevatedChangeLoginEmail(id, newEmail, options);
      return result;
    } catch (error) {
      console.error(error);
      // Handle the error
    }
  }
);


changeLoginEmail example for exporting from backend code

changeLoginEmail

ChangeLoginEmailResponse

email

password

LoginOptions

Logs in a registered member with an email and password.

The `login()` function only works with existing members. To register a new member use the [`register()`](#register) function.

To complete the login, the returned session token must be applied using the `applySessionToken()` function in the wix-members-frontend API.

import { authentication } from 'wix-members.v2';

async function login(email, password, options) {
  try {
    const result = await authentication.login(email, password, options);
    return result;
  } catch (error) {
    console.error(error);
    // Handle the error
  }
}


login example for dashboard page code

import { authentication } from 'wix-members.v2';
import { webMethod, Permissions } from 'wix-web-module';
import { elevate } from 'wix-auth';

const elevatedLogin = elevate(authentication.login);

export const login = webMethod(
  Permissions.Anyone,
  async (email, password, options) => {
    try {
      const result = await elevatedLogin(email, password, options);
      return result;
    } catch (error) {
      console.error(error);
      // Handle the error
    }
  }
);


login example for exporting from backend code

login

LoginResponse

Login email address for the new site member.

Password the new site member will use to log in.

Must be 4 to 15 ASCII-printable characters.

RegisterOptions

Registers a new site member.

The specified `password` must be between 4 and 100 ASCII characters.

>**Note:** The `register()` function behaves differently depending on your site's [member signup settings](https://dev.wix.com/docs/develop-websites/articles/wix-apps/wix-members/enabling-custom-site-registration).

import { authentication } from 'wix-members.v2';

async function register(email, password, options) {
  try {
    const result = await authentication.register(email, password, options);
    return result;
  } catch (error) {
    console.error(error);
    // Handle the error
  }
}


register example for dashboard page code

import { authentication } from 'wix-members.v2';
import { webMethod, Permissions } from 'wix-web-module';
import { elevate } from 'wix-auth';

const elevatedRegister = elevate(authentication.register);

export const register = webMethod(
  Permissions.Anyone,
  async (email, password, options) => {
    try {
      const result = await elevatedRegister(email, password, options);
      return result;
    } catch (error) {
      console.error(error);
      // Handle the error
    }
  }
);


register example for exporting from backend code

register

RegisterResponse

Login email of the member whose password will be set.

SendSetPasswordEmailOptions

Sends a site member an email with a link to set their password.

The set password link is valid for 3 hours,
and it can be used only once.
If the link expires, the original password remains.

import { authentication } from 'wix-members.v2';

async function sendSetPasswordEmail(email, options) {
  try {
    const result = await authentication.sendSetPasswordEmail(email, options);
    return result;
  } catch (error) {
    console.error(error);
    // Handle the error
  }
}


sendSetPasswordEmail example

import { authentication } from 'wix-members.v2';
import { webMethod, Permissions } from 'wix-web-module';

export const sendSetPasswordEmail = webMethod(
  Permissions.Anyone,
  async (email, options) => {
    try {
      const result = await authentication.sendSetPasswordEmail(email, options);
      return result;
    } catch (error) {
      console.error(error);
      // Handle the error
    }
  }
);


sendSetPasswordEmail example for exporting from backend code

sendSetPasswordEmail

SendSetPasswordEmailResponse

velo-deps_wix-members.v2_authentication

Address

city

2-letter country code in an [ISO-3166 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2) format.

country

postalCode

region

street

AppleLogin

JWT signed by apple, contains target (aud), email etc

token

session

Session

Login email address of the member to approve.

BatchGetMembersResponse

members

BatchGetOptions

unique identifier of the requested member(required)

includeContactDetails

boolean

includeGroupsDetails

Login email address of the member to block.

Member with the updated login email address.

member

Member

CustomField

dateValue

numValue

strValue

name

DeleteOptions

isBulkAction

DialogData

appId

initiator

visitorId

EmailVerification

6-digit code for verification.  Code can be between 100000 and 999999.

verificationId

FacebookLogin

AccessToken created by Facebook, used to later fetch details over API

FilterBy

groupId

privacyStatus

SiteMemberPrivacyStatus

roles

status

GetAuthorizedPagesOptions

GetAuthorizedPagesResponse

authorizedPages

GetMemberResponse

GetMemberRoleResponse

contactId

member's role:

`OWNER` - member that belongs to site owner
`CONTRIBUTOR` - member that belongs to a contributor in site
`MEMBER` - other members that registered to site

role

Role

SiteMemberStatus

userId

GetMemberRolesResponse

idsToRoles

GetOptions

GetResetPasswordLinkResponse

Reset password link.
Valid for one use, up to two weeks from when it is created.

resetPasswordLink

GetRolesOptions

GetUserMembershipsOptions

paging - offset and limit ( the max limit for page is 200)

paging

Paging

GetUserMembershipsResponse

sequence of member's of the user with there metaSiteId

userMemberships

GoogleLogin

JWT signed by Google, contains target (aud), email etc

Group

type

ListMembersResponse

pagination

PaginationResponse

ListOptions

partial response request - list of field names to get back in response

fields

for paging - maximum number of records to retrieve

limit

number

offset

sort order - list of field and direction tuples. e.g. `["first_name:asc", "last_name:desc"]`

order

addresses

Date and time when the member was created.

creationDate

Custom fields, structured as key:object pairs. Custom field keys are defined in the Contacts Extended Fields API. The paired object contains the `name` and `value` properties, where `name` is the display name and `value` is the value stored for the member.

Only custom fields added to the member profile in the Dashboard are available through the Members API. Empty fields are not returned.

When updating a member, `name` is ignored.

block( )