How to Add Web Push Notifications to a Next.js App

React
How to Add Web Push Notifications to a Next.js App

Learn how to implement Web Push notifications in a Next.js 16 app step by step. This guide explains how push works, how to configure VAPID keys and service workers, and how to send real-time notifications to your users — even when your site isn’t open.

How to Create a Global Custom 404 Page for Route Groups in Next.js

React
How to Create a Global Custom 404 Page for Route Groups in Next.js
Image generated by ChatGPT (DALL·E)

Implementing a custom 404 page in Next.js becomes unexpectedly tricky when using route groups. While group-specific not-found.jsx files work as expected, unmatched routes fall back to the default Next.js 404, breaking visual consistency. This article explains why this happens and shows a practical workaround using the experimental globalNotFound option to create a reusable, fully styled global 404 page.

Next.js 15 Tutorial: Build a Full-Stack App with Ant Design & React Query

React
Next.js 15 Tutorial: Build a Full-Stack App with Ant Design & React Query
Image generated by ChatGPT (DALL·E)

Next.js 15 is redefining server-side React development, offering built-in optimizations for routing, caching, and image handling. In this step-by-step tutorial, we will build a dynamic records management app using Ant Design 5 for UI components and React Query 5 for efficient data fetching. Learn how to streamline development, minimize boilerplate, and optimize performance with Next.js best practices. Get started today!