Particle AuthKit Vite Starter

This is a starter project demonstrating the integration of Particle Network's AuthKit into a Vite + React application.

Documentation

For more information on how to use AuthKit, please refer to the official documentation.

Getting Started

Follow these instructions to get the project up and running on your local machine.

1. Clone the repository

git clone https://github.com/soos3d/authkit-vite-starter.git
cd authkit-vite-starter

2. Install dependencies

npm install
# or
yarn install

3. Set up environment variables

You'll need to get your Particle Network credentials from the Particle Dashboard.

1. Create a new file named .env in the authkit-vite-starter directory.
2. Add the following environment variables to your .env file, replacing the placeholder values with your actual credentials from the Particle Dashboard:

VITE_PROJECT_ID=your_project_id
VITE_CLIENT_KEY=your_client_key
VITE_APP_ID=your_app_id

4. Run the development server

npm run dev
# or
yarn dev

Open http://localhost:5173 (or whatever port is shown in your terminal) to view it in the browser.

Configuration

You can easily customize the authentication options and blockchain networks in src/Authkit.tsx.

Changing Social Logins

To modify the available social login options, edit the authTypes array in src/Authkit.tsx.

// src/Authkit.tsx

// ...
authTypes: [
  AuthType.email,
  AuthType.google,
  AuthType.twitter,
  AuthType.github,
  // Add or remove auth types here
],
// ...

Changing Chains

To change the supported blockchain networks, you need to:

1. Import the desired chain from @particle-network/authkit/chains.
2. Add the imported chain to the chains array.

Here's an example of how to add the Polygon mainnet:

// src/Authkit.tsx

import { baseSepolia, matic, mainnet } from "@particle-network/authkit/chains"; // 1. Import the new chain

// ...

// List the chains you want to include
chains: [
    baseSepolia,
    matic,
    mainnet,
],

// ...