Skip to content

Web3-Auth Solana template #149

Description

@GuiBibeau

Background

The Solana Foundation maintains a templates repo with both official and community templates. Developers use these templates with create-solana-dapp to quickly scaffold projects.
Web3 authentication remains a significant barrier for mainstream adoption. Many dApps need flexible authentication options that go beyond traditional wallet connections. This task proposes adding a Web3Auth template that demonstrates social logins and email authentication using Web3Auth SDK (https://web3auth.io), providing a smooth onboarding experience for mainstream users who may not have crypto wallets.


Goal

Add a community template at community/web3-auth that includes:

  • A Next.js + Tailwind + TypeScript application with Web3Auth authentication flows
  • Web3Auth SDK integration for social logins (Google, Twitter, Discord, GitHub, etc.)
  • Email passwordless authentication
  • SMS authentication option
  • Embedded wallet generation for new users
  • Session management and JWT token handling
  • Protected routes and middleware
  • User profile management with wallet details
  • Environment variables for auth providers and configuration

Deliverables

  1. community/web3-auth/ directory with working template code
  2. README.md explaining:
    • Web3Auth account setup at https://web3auth.io
    • Dashboard configuration for auth providers
    • Verifier setup and custom authentication
    • Session management strategy
    • Security best practices
    • Private key management
    • Links to Web3Auth documentation and guides
  3. Authentication components:
    • Web3Auth login modal with provider selection
    • Social login buttons (Google, Twitter, Discord, GitHub)
    • Email passwordless form
    • SMS authentication form
    • User profile dropdown with wallet info
    • Session status indicators
  4. API routes for:
    • Session validation
    • Token refresh
    • User data management
  5. Middleware for route protection
  6. Wallet functionality:
    • Display generated wallet address
    • Sign message example
    • Send transaction example
  7. package.json with a create-solana-dapp block for post-install guidance
  8. Type definitions for Web3Auth responses and user sessions
  9. Registration in templates.json for discoverability

Acceptance Criteria

  • A new directory community/web3-auth exists with scaffolded Next.js project
  • Web3Auth SDK integrated with at least 4 social providers (Google, Twitter, Discord, GitHub)
  • Email passwordless authentication working
  • SMS authentication option available
  • Embedded wallet generation for authenticated users
  • Session persistence across page refreshes
  • Protected routes that redirect unauthenticated users
  • User profile page showing:
    • Auth method used
    • Generated wallet address
    • User info from provider
  • Logout functionality that clears all session data
  • Environment variables for:
    • Web3Auth client ID
    • Web3Auth network (mainnet/testnet/cyan)
    • Chain configuration
    • JWT secret
    • Session duration
  • README.md includes:
    • Web3Auth dashboard setup walkthrough
    • Provider configuration steps
    • Custom verifier setup guide
    • Whitelisting domains for production
    • Troubleshooting common issues
    • Migration from testnet to mainnet
  • Example of signing a message with the embedded wallet
  • Example of sending a transaction
  • Error handling for failed authentications
  • Loading states during auth flows
  • Mobile-responsive authentication UI
  • Template registered in templates.json with proper metadata
  • Repo builds successfully with the new template
  • Scaffolding via CLI works: npm create solana-dapp@latest -t gh:solana-foundation/templates/community/web3-auth

Risks

  • Provider API changes: Social auth providers may change their APIs; documentation should reference Web3Auth's official docs
  • Key management: Users' private keys must be handled securely; Web3Auth's key management should be properly configured
  • Network selection: Must ensure correct network configuration between Web3Auth and Solana
  • Rate limits: Web3Auth has rate limits on testnet; documentation should mention this

Definition of Done

  • All acceptance criteria met
  • Template merged into solana-foundation/templates
  • Authentication flow tested with all configured providers
  • Web3Auth integration verified on both testnet and mainnet configurations
  • Video walkthrough or GIF demonstrating social login flow added to PR

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions