# 🔐 WebAuthn Passkey Demo (Angular + NestJS)

This is a full-stack demonstration of **passwordless authentication using WebAuthn passkeys**, built with:

- **Frontend**: Angular 20 (Standalone Components + Material)
- **Backend**: NestJS
- **Authentication**: WebAuthn via [@simplewebauthn](https://github.com/MasterKale/SimpleWebAuthn)

---

## ✨ Features

- 🔐 Passkey-only login — no email input required
- ✅ Discoverable credentials (platform or cross-device)
- 📲 Cross-device support using synced passkeys
- 🎨 Clean Angular Material UI
- 🧪 Ideal for learning, demos, or prototyping WebAuthn

---

## 🧰 Tech Stack

| Layer     | Tech                          |
|-----------|-------------------------------|
| Frontend  | Angular 20, Angular Material  |
| Backend   | NestJS                        |
| Auth      | @simplewebauthn/server + browser |
| Hosting   | NestJS serves Angular build   |
| Tunnel    | [ngrok](https://ngrok.com/) for HTTPS development

---

## 🚀 Getting Started

### 1. Clone or Download the Project

Download this project from Google Drive or clone it if hosted on Git later.
https://chat.google.com/dm/hDsHMQAAAAE/79WHykPDGEQ/79WHykPDGEQ?cls=10
```bash
cd your-project-directory
```

### 2. Clone or Download the Project
dependencies already installed in this case. just extract the program.


### 3. Expose via ngrok or preferred method
setup: https://dashboard.ngrok.com/get-started/setup/windows
npx ngrok http 3000
Copy the exposed Url

### 4. Update Config Files
Update the URLs ..\Mobile Authentication Sample\sample-auth-backend\src\config.ts
<RPID must match>
Update the URL ..\Mobile Authentication Sample\web-app\src\app\config.ts


### 5. Angular Build 
npm run nest
This will enable NestJS to serve the frontend statically


### 5. Start the app
in  ..\Mobile Authentication Sample\sample-auth-backend run npm run start