Astro ATProto OAuth Starter#

A minimal Astro starter template demonstrating OAuth authentication with AT Protocol (ATProto), the decentralized social networking protocol used by Bluesky and other services.

This starter includes:

• Complete OAuth authentication flow using @atproto/oauth-client-node
• Cookie-based session management
• Profile display after authentication
• Login/logout endpoints
• Tailwind CSS and DaisyUI styling

🚀 Getting Started#

1. Install dependencies:

   npm install
   

2. Configure environment variables:

   cp .env.template .env
   

   Edit .env if you need to change the port (default: 4321) or set a public URL.

3. Start the development server:

   npm run dev
   

   The app will be available at http://localhost:4321

4. Try logging in: Enter your AT Protocol handle (e.g., alice.bsky.social) to authenticate.

📁 Project Structure#

/
├── public/
├── src/
│   ├── lib/
│   │   ├── context.ts      # OAuth client singleton
│   │   ├── oauth.ts        # OAuth client configuration
│   │   ├── session.ts      # Session management
│   │   └── storage.ts      # Cookie-based stores
│   ├── pages/
│   │   ├── api/
│   │   │   ├── login.ts    # Login endpoint
│   │   │   ├── logout.ts   # Logout endpoint
│   │   │   └── oauth/
│   │   │       └── callback.ts  # OAuth callback handler
│   │   └── index.astro     # Main page with login UI
│   └── styles.css
└── package.json

🧞 Commands#

All commands are run from the root of the project, from a terminal:

📚 Learn More#

• Astro Documentation
• AT Protocol Documentation
• @atproto/oauth-client-node
• Bluesky