Understand the Flow
Learn how the authentication protocol works under the hood. Authentication Flow →
Quick Start
Quick Start Guide
Section titled “Quick Start Guide”Get passwordless authentication working in your application in just a few minutes.
Prerequisites
Section titled “Prerequisites”Before you begin, make sure you have:
- ByteVault App - Download from App Store or Google Play
- API Credentials - Get your API key from the Developer Portal
- Registered Domain - Register your domain to receive authentication webhooks
Choose Your Framework
Section titled “Choose Your Framework”Install the Package
Section titled “Install the Package”composer require bytefederal/byteauth-laravelPublish Configuration
Section titled “Publish Configuration”php artisan vendor:publish --tag=byteauth-configConfigure Environment
Section titled “Configure Environment”Add to your .env file:
BYTEAUTH_DOMAIN_REGISTERED=yourdomain.comBYTEAUTH_API_KEY=your_api_key_hereAdd Routes
Section titled “Add Routes”In routes/web.php:
use ByteFederal\ByteAuthLaravel\Controllers\WebhookController;
Route::post('/webhook/registration', [WebhookController::class, 'handleRegistration']);Route::post('/webhook/login', [WebhookController::class, 'handleLogin']);Route::get('/api/check', [WebhookController::class, 'check']);Add Login Component
Section titled “Add Login Component”In your Blade template:
<livewire:byteauth-qr-login />Install the Package
Section titled “Install the Package”npm install @bytefederal/byteauth-nextjs# oryarn add @bytefederal/byteauth-nextjsConfigure Environment
Section titled “Configure Environment”Create or update .env.local:
BYTEAUTH_DOMAIN=yourdomain.comBYTEAUTH_API_KEY=your_api_key_hereBYTEAUTH_WEBHOOK_SECRET=your_webhook_secretCreate API Routes
Section titled “Create API Routes”Create app/api/byteauth/[...byteauth]/route.ts:
import { ByteAuthHandler } from '@bytefederal/byteauth-nextjs';
export const { GET, POST } = ByteAuthHandler({ callbacks: { async onLogin(user) { // Handle successful login console.log('User logged in:', user.publicKey); }, async onRegister(user) { // Handle new registration console.log('New user registered:', user.publicKey); }, },});Add Login Component
Section titled “Add Login Component”import { ByteAuthQR } from '@bytefederal/byteauth-nextjs/client';
export default function LoginPage() { return ( <div> <h1>Login</h1> <ByteAuthQR onSuccess={(user) => { // Redirect to dashboard window.location.href = '/dashboard'; }} /> </div> );}Test Your Integration
Section titled “Test Your Integration”-
Start your development server
Run your application locally.
-
Open the login page
Navigate to your login page where the QR code is displayed.
-
Open ByteVault
Launch the ByteVault app on your phone.
-
Scan the QR code
Tap the scan button and point at the QR code.
-
Authenticate
Confirm with Face ID, Touch ID, or your device passcode.
-
Done!
You should be logged into your application.
What’s Next?
Section titled “What’s Next?”Configure Webhooks
Set up webhook handlers for registration and login events. Webhook Guide →
Customize Components
Style the QR component to match your application’s design. Customization →
API Reference
Explore the complete API documentation. API Docs →