Building Cloud Functions as Services for Firestore in Firebase

Building Cloud Functions as Services for Firestore in Firebase  In the world of serverless development, Firebase has revolutionized how we build scalable apps with its seamless integration of authentication, real-time databases, and hosting. At the heart of many Firebase projects lies Firestore, a NoSQL document database that excels at handling structured data with real-time synchronization.… Continue reading Building Cloud Functions as Services for Firestore in Firebase

Published
Categorized as Next.Js

DevOps CI/CD?

CI/CD stands for Continuous Integration and Continuous Deployment (or sometimes Continuous Delivery). It’s a set of practices and tools used to automate the process of building, testing, and deploying your code, making development faster and more reliable  Continuous Integration (CI): This is about frequently merging your code changes into a shared repository (e.g., GitHub). Each… Continue reading DevOps CI/CD?

DocumentReference in Firebase / Nextjs

What is it? A DocumentReference is a Firestore object that points to a specific document in a collection, like /users/abc123. It’s used to link related documents instead of duplicating data, keeping things consistent and storage-efficient. How it’s created? We use the doc() function from firebase/firestore, e.g., doc(db, ‘collectionName’, ‘documentId’). Why use it? It enables relational… Continue reading DocumentReference in Firebase / Nextjs

Published
Categorized as Next.Js

Implementing Interactive Zoom Functionality in a React Image Gallery

Introduction In modern web applications, providing an interactive and intuitive user experience is paramount, especially for image-heavy interfaces like galleries or product showcases. One powerful feature to enhance user interaction is zoom functionality, allowing users to closely inspect image details. This article explores the implementation of a zoom feature within a React-based image gallery component,… Continue reading Implementing Interactive Zoom Functionality in a React Image Gallery

Server Actions and React Server Components: Rethinking State in Next.js

Next.js supports React Server Components (RSC) and Server Actions, enabling a shift from client-heavy interactivity to server-driven rendering and logic. Key Topics: What are React Server Components (RSC)? How Server Actions replace client-side mutations Form submissions without client-side JavaScript Pros and cons: performance vs flexibility Ideal Audience: Advanced React/Next.js develop With the release of Next.js… Continue reading Server Actions and React Server Components: Rethinking State in Next.js

Authentication in Next.js 14 Using NextAuth.js and Middleware

Managing authentication in Next.js can be complex. This guide shows how to integrate NextAuth.js with the App Router, securing both pages and API routes using middleware. Key Topics: Setting up NextAuth.js with credentials or OAuth providers Using middleware for route protection (middleware.ts) Token management with JWT sessions UI-based login flows with React and TailwindCSS Ideal… Continue reading Authentication in Next.js 14 Using NextAuth.js and Middleware

Building Scalable APIs with Next.js App Router

Next.js has revolutionized modern web development by blending the best of server–side and client–side rendering. One of the most significant changes introduced with the App Router is the transformation of how API routes are defined, structured, and deployed. With Next.js 14, developers can now build robust, RESTful, and scalable APIs directly inside the /app directory,… Continue reading Building Scalable APIs with Next.js App Router

Blazing Fast Sites with Next.js 14: What’s New and How to Use It

1. Turbopack Now Production-Ready Turbopack, the Webpack replacement introduced in Next.js 13, is now officially stable. Built in Rust, it offers 10x faster local dev builds and instant HMR (Hot Module Replacement) feedback. Why it matters: No more waiting around during dev builds Better DX when working with large codebases Ideal for monorepos using tools… Continue reading Blazing Fast Sites with Next.js 14: What’s New and How to Use It

Published
Categorized as Next.Js Tagged

Fixing the Off-By-One Day Date Issue in React Due to Timezone Shifts

When working with date pickers in web applications, especially in form-based interfaces, developers often encounter a common and frustrating issue: a date that was selected by the user appears one day earlier when reloaded in an edit form. This article explores how we resolved this issue in a React application using react-datepicker, and what you… Continue reading Fixing the Off-By-One Day Date Issue in React Due to Timezone Shifts

Event Trigger Behavior in postgress

An event trigger fires whenever the event with which it is associated occurs in the database in which it is defined. Currently, the only supported events are login, ddl_command_start, ddl_command_end, table_rewrite and sql_drop. Support for additional events may be added in future releases. The login event occurs when an authenticated user logs into the system. Any bug in a trigger procedure for this… Continue reading Event Trigger Behavior in postgress