{"id":30034447,"url":"https://github.com/garyku0/nextjs-passkey-auth","last_synced_at":"2025-08-09T02:03:07.860Z","repository":{"id":307869420,"uuid":"1030924369","full_name":"GaryKu0/nextjs-passkey-auth","owner":"GaryKu0","description":"Modern passwordless authentication with WebAuthn passkeys, Next.js, and Supabase. Optimized for Cloudflare Pages with optional CAPTCHA protection.","archived":false,"fork":false,"pushed_at":"2025-08-02T17:03:33.000Z","size":4681,"stargazers_count":4,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-08-02T19:31:24.579Z","etag":null,"topics":["authentication","biometric","cloudflare","edge-runtime","nextjs","passkey","passwordless","security","supabase","typescript","webauthn"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/GaryKu0.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-08-02T16:15:34.000Z","updated_at":"2025-08-02T17:34:53.000Z","dependencies_parsed_at":"2025-08-02T19:41:43.976Z","dependency_job_id":null,"html_url":"https://github.com/GaryKu0/nextjs-passkey-auth","commit_stats":null,"previous_names":["garyku0/nextjs-passkey-auth"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/GaryKu0/nextjs-passkey-auth","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/GaryKu0%2Fnextjs-passkey-auth","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/GaryKu0%2Fnextjs-passkey-auth/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/GaryKu0%2Fnextjs-passkey-auth/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/GaryKu0%2Fnextjs-passkey-auth/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/GaryKu0","download_url":"https://codeload.github.com/GaryKu0/nextjs-passkey-auth/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/GaryKu0%2Fnextjs-passkey-auth/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":269348099,"owners_count":24401885,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-07T02:00:09.698Z","response_time":73,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["authentication","biometric","cloudflare","edge-runtime","nextjs","passkey","passwordless","security","supabase","typescript","webauthn"],"created_at":"2025-08-07T00:01:15.844Z","updated_at":"2025-08-08T01:02:54.259Z","avatar_url":"https://github.com/GaryKu0.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 🔐 Passkey Authentication with Next.js\n\n\u003cdiv align=\"center\"\u003e\n  \u003cimg src=\"public/icon.png\" alt=\"Passkey Authentication Logo\" width=\"120\" height=\"120\"\u003e\n\u003c/div\u003e\n\n\u003cbr\u003e\n\nA modern, passwordless authentication system built with Next.js, WebAuthn passkeys, and Supabase. Features bot protection via CAPTCHA and is optimized for deployment on Cloudflare Pages with Edge Runtime compatibility.\n\n## ✨ Features\n\n- **🔑 Passwordless Authentication**: Secure login using WebAuthn passkeys (Face ID, Touch ID, Windows Hello)\n- **🤖 Bot Protection**: Integrated Cap.js CAPTCHA system (configurable)\n- **⚡ Edge Runtime**: Optimized for Cloudflare Pages deployment\n- **🗃️ Supabase Integration**: User management and data persistence\n- **📱 Responsive Design**: Modern UI with Tailwind CSS and shadcn/ui components\n- **🔒 JWT Security**: Secure session management\n- **🌐 Cross-Platform**: Works across devices and browsers\n- **🛠️ TypeScript**: Full type safety throughout the codebase\n\n## 🚀 Quick Start\n\n### Prerequisites\n\n- Node.js 18+\n- pnpm (recommended) or npm\n- Supabase account\n- Cloudflare Pages account (for deployment)\n\n### Installation\n\n1. **Clone the repository**\n   ```bash\n   git clone https://github.com/GaryKu0/passkey-nextjs.git\n   cd passkey-nextjs\n   ```\n\n2. **Install dependencies**\n   ```bash\n   pnpm install\n   ```\n\n3. **Set up environment variables**\n   ```bash\n   cp .env.example .env\n   ```\n   \n   Configure your `.env` file with:\n   - Supabase credentials\n   - JWT secret\n   - Domain configuration\n   - CAPTCHA settings (optional)\n\n4. **Set up Supabase database**\n   \n   Create a `users` table in your Supabase project:\n   ```sql\n   CREATE TABLE users (\n     id UUID DEFAULT gen_random_uuid() PRIMARY KEY,\n     username TEXT UNIQUE NOT NULL,\n     email TEXT,\n     display_name TEXT,\n     credentials JSONB DEFAULT '[]'::jsonb,\n     created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),\n     updated_at TIMESTAMP WITH TIME ZONE DEFAULT NOW()\n   );\n   \n   -- Create indexes for better performance\n   CREATE INDEX idx_users_username ON users(username);\n   CREATE INDEX idx_users_email ON users(email);\n   ```\n\n5. **Run the development server**\n   ```bash\n   pnpm dev\n   ```\n\n6. **Open your browser**\n   \n   Navigate to `http://localhost:3000` to see the application.\n\n## 🔧 Configuration\n\n### Environment Variables\n\n| Variable | Description | Required |\n|----------|-------------|----------|\n| `NEXT_PUBLIC_SUPABASE_URL` | Your Supabase project URL | ✅ |\n| `NEXT_PUBLIC_SUPABASE_ANON_KEY` | Supabase anonymous key | ✅ |\n| `JWT_SECRET` | Secret for JWT signing | ✅ |\n| `NEXT_PUBLIC_RP_ID` | WebAuthn Relying Party ID | ✅ |\n| `NEXT_PUBLIC_RP_NAME` | Your application name | ✅ |\n| `NEXT_PUBLIC_RP_ORIGIN` | Your application origin URL | ✅ |\n| `ENABLE_CAPTCHA` | Enable/disable CAPTCHA protection | ⚠️ |\n| `CAP_SECRET_KEY` | Cap.js secret key | ⚠️ |\n\n⚠️ = Required only if CAPTCHA is enabled\n\n### CAPTCHA Configuration\n\nThe application supports optional CAPTCHA protection during registration:\n\n**Enable CAPTCHA:**\n```bash\nENABLE_CAPTCHA=true\nNEXT_PUBLIC_ENABLE_CAPTCHA=true\nCAP_ENDPOINT=https://your-captcha-service.com\nCAP_SECRET_KEY=your_secret_key\nNEXT_PUBLIC_CAP_SITE_KEY=your_site_key\n```\n\n**Disable CAPTCHA (for development/testing):**\n```bash\nENABLE_CAPTCHA=false\nNEXT_PUBLIC_ENABLE_CAPTCHA=false\n```\n\n## 🚢 Deployment\n\n### Cloudflare Pages\n\nThis application is optimized for Cloudflare Pages deployment:\n\n1. **Connect your repository** to Cloudflare Pages\n2. **Set build settings:**\n   - Build command: `pnpm build`\n   - Build output directory: `.next`\n   - Framework preset: `Next.js (Static HTML Export)`\n\n3. **Configure environment variables** in Cloudflare Pages dashboard\n\n4. **Deploy** - Your application will be available on Cloudflare's global CDN\n\n### Other Platforms\n\nThe application also works on:\n- Vercel\n- Netlify\n- Railway\n- Any platform supporting Next.js Edge Runtime\n\n## 🏗️ Architecture\n\n```\n┌─────────────────┐    ┌─────────────────┐    ┌─────────────────┐\n│   Client App    │    │   API Routes    │    │    Supabase     │\n│                 │    │                 │    │                 │\n│ • React/Next.js │◄──►│ • Edge Runtime  │◄──►│ • User Storage  │\n│ • WebAuthn      │    │ • JWT Auth      │    │ • PostgreSQL    │\n│ • Cap.js Widget │    │ • CAPTCHA Check │    │                 │\n└─────────────────┘    └─────────────────┘    └─────────────────┘\n```\n\n### Key Components\n\n- **Frontend**: Next.js 14 with App Router\n- **Authentication**: WebAuthn via @simplewebauthn/browser\n- **Database**: Supabase (PostgreSQL)\n- **Runtime**: Edge Runtime for optimal performance\n- **UI**: Tailwind CSS + shadcn/ui components\n- **Bot Protection**: Cap.js CAPTCHA system\n\n## 📚 API Documentation\n\nComprehensive API documentation is available in [`API_INTEGRATION_GUIDE.md`](./API_INTEGRATION_GUIDE.md).\n\n### Quick API Reference\n\n#### Registration\n```bash\nPOST /api/auth/register-begin\nPOST /api/auth/register-complete\n```\n\n#### Authentication\n```bash\nPOST /api/auth/login-begin\nPOST /api/auth/login-complete\n```\n\n#### User Management\n```bash\nGET /api/auth/me\nPOST /api/auth/logout\n```\n\n## 🛠️ Development\n\n### Scripts\n\n```bash\n# Development\npnpm dev          # Start development server\npnpm build        # Build for production\npnpm start        # Start production server\npnpm lint         # Run ESLint\npnpm type-check   # Run TypeScript checks\n```\n\n### Project Structure\n\n```\npasskey-nextjs/\n├── app/                    # Next.js App Router\n│   ├── api/auth/          # Authentication API routes\n│   ├── globals.css        # Global styles\n│   ├── layout.tsx         # Root layout\n│   └── page.tsx           # Home page\n├── components/            # React components\n│   ├── auth/             # Authentication components\n│   └── ui/               # shadcn/ui components\n├── hooks/                # Custom React hooks\n├── lib/                  # Utility libraries\n│   ├── auth-utils.ts     # Authentication utilities\n│   ├── cap-utils.ts      # CAPTCHA utilities\n│   ├── jwt.ts            # JWT handling\n│   ├── supabase.ts       # Supabase client\n│   └── webauthn.ts       # WebAuthn utilities\n└── docs/                 # Documentation\n```\n\n## 🔒 Security Features\n\n- **WebAuthn Standard**: Industry-standard passwordless authentication\n- **CAPTCHA Protection**: Bot prevention during registration\n- **JWT Security**: Secure session management with signed tokens\n- **Edge Runtime**: Enhanced security with Cloudflare's global network\n- **Input Validation**: Comprehensive server-side validation\n- **Rate Limiting**: Built-in protection against abuse\n\n## 🌍 Browser Support\n\n| Browser | Version | Status |\n|---------|---------|---------|\n| Chrome | 67+ | ✅ Full Support |\n| Firefox | 60+ | ✅ Full Support |\n| Safari | 14+ | ✅ Full Support |\n| Edge | 79+ | ✅ Full Support |\n\n## 🤝 Contributing\n\nContributions are welcome! Please feel free to submit a Pull Request.\n\n1. Fork the repository\n2. Create your feature branch (`git checkout -b feature/amazing-feature`)\n3. Commit your changes (`git commit -m 'Add some amazing feature'`)\n4. Push to the branch (`git push origin feature/amazing-feature`)\n5. Open a Pull Request\n\n## 📄 License\n\nThis project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.\n\n## 🙏 Acknowledgments\n\n- [SimpleWebAuthn](https://simplewebauthn.dev/) - WebAuthn library\n- [Supabase](https://supabase.com/) - Backend as a Service\n- [Cap.js](https://cap.js.dev/) - CAPTCHA solution\n- [shadcn/ui](https://ui.shadcn.com/) - UI components\n- [Cloudflare Pages](https://pages.cloudflare.com/) - Deployment platform\n\n## 📞 Support\n\nIf you encounter any issues or have questions:\n\n1. Check the [API Integration Guide](./API_INTEGRATION_GUIDE.md)\n2. Search existing [Issues](https://github.com/GaryKu0/passkey-nextjs/issues)\n3. Create a new issue with detailed information\n\n---\n\n**Built with ❤️ for the passwordless future**","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgaryku0%2Fnextjs-passkey-auth","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgaryku0%2Fnextjs-passkey-auth","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgaryku0%2Fnextjs-passkey-auth/lists"}