FeaturesTemplatesShowcaseTownie
AI
BlogDocsPricing
Log inSign up
cricks_unmixed4u

cricks_unmixed4u

authentication

Public
Like
authentication
Home
Code
7
frontend
2
lib
3
.vtignore
README.md
deno.json
knowledge.md
H
main.tsx
Branches
1
Pull requests
Remixes
History
Environment variables
1
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in milliseconds.
Sign up now
Code
/
README.md
Code
/
README.md
Search
7/5/2025
README.md

Val Town Authentication Library

A modular authentication library for Val Town with support for multiple OAuth providers.

Step 0 Implementation - GitHub OAuth

This implementation provides a complete GitHub OAuth 2.0 flow with the following features:

βœ… Implemented Features

  • GitHub OAuth 2.0 Authorization Code Flow - Secure OAuth implementation
  • JWT-based Session Management - Stateless authentication tokens
  • CSRF Protection - State parameter validation to prevent attacks
  • Secure HTTP-only Cookies - Prevents XSS token theft
  • Hono Middleware - Easy integration with Hono applications
  • React Hooks & Components - Ready-to-use frontend components
  • Modular Architecture - Adapter pattern for multiple auth providers

πŸ—οΈ Architecture

auth/
β”œβ”€β”€ core/
β”‚   β”œβ”€β”€ types.ts           # TypeScript interfaces
β”‚   β”œβ”€β”€ signer.ts          # JWT signing/verification
β”‚   └── adapters.ts        # Auth provider implementations
β”œβ”€β”€ hono/
β”‚   β”œβ”€β”€ createMiddleware.ts # Middleware factory
β”‚   └── github.ts          # GitHub-specific routes
β”œβ”€β”€ react/
β”‚   β”œβ”€β”€ createHook.ts      # React hook factory
β”‚   β”œβ”€β”€ createComponents.ts # Component factory
β”‚   └── github.tsx         # GitHub components
└── index.ts               # Main exports

πŸ”§ Setup

  1. Environment Variables

    GITHUB_CLIENT_ID=your_github_client_id GITHUB_CLIENT_SECRET=your_github_client_secret JWT_SECRET=your_secure_jwt_secret
  2. GitHub OAuth App Configuration

    • Authorization callback URL: https://your-domain.com/auth/github/callback
    • Requested scopes: user:email, read:user

πŸš€ Usage

import { Hono } from "hono"; import { createGitHubAuthRoutes, githubAuthMiddleware } from "./auth/hono/github.ts"; const app = new Hono(); // Add auth routes const authRoutes = createGitHubAuthRoutes(); app.route("/", authRoutes); // Protect API routes app.get("/api/me", githubAuthMiddleware, (c) => { const user = c.get("user"); return c.json(user); });

πŸ”’ Security Features

  • CSRF Protection: State parameter validation
  • Secure Cookies: HttpOnly, Secure, SameSite=Lax
  • JWT Validation: Proper token verification with expiration
  • Environment Variables: No hardcoded secrets
  • Error Handling: Proper error bubbling and logging

⏳ Placeholder Implementations

  • Val Town Adapter: Throws "not implemented" error
  • Password Adapter: Throws "not implemented" error

These will be implemented in future steps.

πŸ§ͺ Demo

Run the main.tsx file to see a working demonstration of the GitHub OAuth flow with a beautiful UI built using React and TailwindCSS.

πŸ“ Next Steps

  1. Implement Val Town API key authentication
  2. Implement password-based authentication
  3. Add refresh token support
  4. Add user profile management
  5. Add role-based access control
FeaturesVersion controlCode intelligenceCLI
Use cases
TeamsAI agentsSlackGTM
ExploreDocsShowcaseTemplatesNewestTrendingAPI examplesNPM packages
PricingNewsletterBlogAboutCareersBrandhi@val.townStatus
X (Twitter)
Discord community
GitHub discussions
YouTube channel
Bluesky
Terms of usePrivacy policyAbuse contact
Β© 2025 Val Town, Inc.