skills.rest
flavien-ia
flavien-iaCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

add-push-notification

Configure VAPID keys, subscription tables, and service worker handlers for Web Push in Next.js.

34|6|Updated Jun 30, 2026
Search Tags:#notifications#push#pwa#service-worker#web-push#vapid
One-click install
npx skills add https://github.com/flavien-ia/hypervibe-harness --skill add-push-notification
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: add-push-notification
Source: https://github.com/flavien-ia/hypervibe-harness/tree/main/skills/add-push-notification
Command: npx skills add https://github.com/flavien-ia/hypervibe-harness --skill add-push-notification

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires web-push, @types/web-push, and includes scripts (resource) components.

What problem does it solve?

This skill solves the challenge of re-engaging users by enabling system-level push notifications that reach users even when your web application is closed.

Core Features & Use Cases

  • System Integration: Automatically configures VAPID keys, database tables, and service worker handlers.
  • Cross-Platform Reach: Enables native-like notification capabilities for Progressive Web Apps (PWAs).
  • Use Case: Use this to send timely alerts for appointment reminders, new messages, or order updates directly to a user's device notification center.

Quick Start

Run the add-push-notification skill to configure push messaging for this project.

Frequently Asked Questions about add-push-notification

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add push notifications to a Next.js PWA?▼

You can add push notifications to a Next.js PWA by configuring VAPID keys, setting up database subscription tables, and implementing service worker event handlers. This enables native-like system alerts even when the web app is closed.

What do I need to configure web push notifications in a web app?▼

To configure web push notifications, you need an existing PWA setup, a database for device subscriptions, and user authentication. The process also requires generating VAPID keys and implementing server-side delivery helpers.

How do VAPID keys work for web push notifications?▼

VAPID keys allow your application server to securely identify itself to the push service. They are automatically configured during setup to authorize the delivery of system-level push notifications to subscribed user devices.

Can I send user-specific push notifications through a trpc router?▼

Yes, user-specific push notifications are supported via server-side helpers and trpc routers. This allows you to send targeted alerts like appointment reminders or order updates directly to a user's device notification center.

Do I need a database to manage service worker push subscriptions?▼

Yes, a database is required to manage device push subscriptions. The setup process automatically configures the necessary database subscription tables to store user device endpoints for cross-platform notification delivery.

Related Skills

Explore More Software Engineering Skills→
elijahmurrayelijahmurray
2

setup-ticket-system

Configure GitHub Issues, Linear, Jira, or GitLab for issue tracking.

Community
Basic
Nick777-PixelNick777-Pixel

trpc-router

Guide TRPC router design with procedures, middleware, and type-safe endpoints.

Community
Intermediate
apakouapakou

NOTIF_ServiceWorkerSetup

Generate a service-worker.js file with push event listeners for React/Next.js apps.

Community
Intermediate
jamshujamshu
4

add-odoo-model

Add an Odoo Studio model to an existing PWA project.

Community
Advanced