Todo/DOCKER_PUSH_NOTIFICATIONS_SETUP.md

Push Notifications Setup for Docker

Quick Setup (3 Steps)

Step 1: Generate VAPID Keys

Run this on your host machine (not in Docker):

npx web-push generate-vapid-keys

Or if you prefer, you can run it in a temporary container:

docker run --rm -it node:20-slim sh -c "npm install -g web-push && web-push generate-vapid-keys"

This will output:

=======================================
Public Key:
BNxxx...

Private Key:
xxx...
=======================================

Step 2: Add Keys to .env File

Add these three lines to your .env file:

VAPID_PUBLIC_KEY=BNxxx...
VAPID_PRIVATE_KEY=xxx...
VAPID_SUBJECT=mailto:your-email@example.com

⚠️ Important:

• Replace BNxxx... with your actual public key
• Replace xxx... with your actual private key
• Replace your-email@example.com with your actual email
• Keep the VAPID_PRIVATE_KEY secret!

Step 3: Update Database Schema

Run this to add the PushSubscription table:

docker-compose exec app npx prisma db push

Or if your containers aren't running yet:

docker-compose up -d
docker-compose exec app npx prisma db push

Step 4: Rebuild and Restart

docker-compose down
docker-compose up --build

That's It!

Your app now has push notifications enabled! When users open the app:

• After 3 seconds, they'll see a notification prompt
• They can enable notifications with one click
• Notifications will be sent automatically for list events

Verify It's Working

1. Open your app at http://localhost:3500
2. Log in
3. Wait 3 seconds for the notification prompt
4. Click "Enable Notifications"
5. Open another browser/incognito window
6. Log in as a different user
7. Add an item to a shared list
8. See the notification in the first browser!

Troubleshooting

"Push notifications not configured" error

• Make sure VAPID keys are in .env
• Make sure you rebuilt the containers: docker-compose up --build
• Check logs: docker-compose logs app

Database table missing

• Run: docker-compose exec app npx prisma db push
• Check if it succeeded: docker-compose exec app npx prisma studio

Environment variables not loading

• Make sure .env is in the same directory as docker-compose.yml
• Restart containers: docker-compose restart
• Check if variables are loaded: docker-compose exec app env | grep VAPID

Docker-Specific Notes

• The web-push package is automatically installed during docker-compose up --build
• VAPID keys are loaded from your .env file into the container
• The database schema update must be run inside the container
• All notification functionality works the same in Docker as locally

Production Deployment

For production:

1. Generate production VAPID keys (different from dev)
2. Add them to your production environment variables
3. Run npx prisma db push in production container
4. Ensure your production URL uses HTTPS (required for push notifications)