Skip to Content
Demo App
View .md

Alien SSO Demo App: Live Example and Source Code

Explore a complete working example of Alien SSO integration in a React application.

Live Demo: Try Alien SSO in Action

Try the demo app to see how Alien SSO works in practice:

View Demo App → 

Clone the Demo Repository

The complete source code is available in the sso-sdk-js monorepo:

Repository: github.com/alien-id/sso-sdk-js/tree/main/apps 

Run the Demo Locally

Prerequisites

  • Node.js 20 or higher
  • npm or pnpm

Setup

# Clone the repository
git clone https://github.com/alien-id/sso-sdk-js.git
cd sso-sdk-js
 
# Install dependencies
npm install
 
# Build all packages (required before running demo)
npm run build
 
cd ./apps/example-sso-app/
 
# Copy .env.example and fill in the values below
cp .env.example .env
 
# Run the example SSO app
npm run dev

The .env file needs two values:

VITE_ALIEN_SSO_BASE_URL=https://sso.alien-api.com
VITE_ALIEN_PROVIDER_ADDRESS=your-provider-address

Get the provider address by registering your app in the Developer Portal .

The demo app will be available at http://localhost:3000 (or another port if 3000 is occupied).

Project Structure

apps/example-sso-app/
├── src/
│   ├── index.tsx           # Entry point (ReactDOM.createRoot renders <App />)
│   ├── App.tsx             # Mounts AlienSsoProvider; defines AuthVerifier and AppContent inline
│   ├── App.css
│   ├── index.css
│   └── reportWebVitals.ts
├── index.html
├── package.json
└── vite.config.ts

Next Steps

Last updated on
ReactIntroduction