Blogs in Next JS category

Styled components have become a popular choice for styling React applications due to their simplicity and flexibility. When it comes to integrating styled components into a Next.js application, it’s essential to understand how to leverage them effectively within the app router. In this guide, we’ll explore step-by-step how to add styled components to a Next.js […]

Read More

In the fast-paced digital world, user engagement is key to the success of any website. One effective way to captivate your audience is by incorporating Google Web Stories into your Next JS website. These visually appealing and interactive stories can make your content more engaging and shareable. In this comprehensive guide, we’ll walk you through […]

Read More

Sending emails in web applications is a crucial feature, and in this article, we will explore how to send Emails in Next JS for free using Resend. Next JS is a popular framework for building React applications, and Resend is a handy tool for email integration. By the end of this guide, you’ll have the […]

Read More

Are you looking to enhance user authentication in your Next.js application? Integrating Social Login with Appwrite can be a game-changer. Add Google Login to your Next.js app with Appwrite. This article will guide you through the process, and practical tips to add Google Login in Next.js with Appwrite. GitHub Code: Google Login in Next.js with […]

Read More

In the world of web development, security is paramount. Whether you are building a simple blog or a complex web application, protecting certain routes and pages from unauthorized access is a crucial step. In this comprehensive guide, we will walk you through the process of adding protected routes in Next JS, ensuring that your web […]

Read More

In the ever-evolving world of web development, having a secure local development environment is crucial. If you’re working with Next.js and need to run localhost on HTTPS with port 3000, you’re in the right place. In this comprehensive guide, we will walk you through the process step by step, ensuring you have a secure and […]

Read More

In the world of web development and search engine optimization (SEO), ensuring that your website is easily accessible and properly indexed by search engines is paramount. One essential tool that aids in this process is the creation of a robots.txt file. In this comprehensive guide, we, the experts, will walk you through the process of […]

Read More

In today’s digital landscape, optimizing your website’s SEO is crucial to attracting more organic traffic and ranking higher on search engine result pages (SERPs). One essential aspect of SEO is creating a sitemap, which helps search engines crawl and index your website efficiently. If you’re using Next JS for your website development, this guide will […]

Read More

Progressive Web Apps (PWAs) have taken the web development world by storm, providing users with fast, reliable, and engaging web experiences. Among the various frameworks available for building PWAs, Next JS stands out as a popular choice due to its simplicity and flexibility. In this guide, we will explore the process of building a PWA […]

Read More

In today’s fast-paced digital world, URL shorteners have become essential tools for simplifying and sharing links. They provide concise and memorable URLs that are easier to manage and share across various platforms. If you’re looking to create your own URL shortener using Next JS and Sanity, you’re in the right place. This article will guide […]

Read More

SVG (Scalable Vector Graphics) is a powerful image format that allows for high-quality graphics and animations on the web. When used in conjunction with Next JS, a popular React framework for building web applications, SVG can enhance the visual appeal and interactivity of your projects. In this article, we’ll explore how you can effectively use […]

Read More

Next.js has gained popularity among web developers due to its powerful features and seamless integration with React. In this article, we will explore various Next.js project ideas to Boost Your Portfolio and enhance your web development skills. Whether you are a beginner or an experienced developer, these project ideas will inspire you to create amazing […]

Read More

The traditional Google AdSense installation is not compatible with the websites created using Next JS. Next JS’s conventional Adsense implementation is sometimes successful but isn’t always. And there is no official way to implement Google Adsense in Next JS. In this article, you will learn How to add Google AdSense in Next JS. After reading […]

Read More

When it comes to building web applications, React is one of the most popular frameworks out there. But with the emergence of Next JS, many developers are left wondering which one they should choose. In this article, we’ll see Next JS vs React to help you decide which one is best for your project. Next […]

Read More

Combining Next JS and Typescript allows developers to build powerful and scalable web applications that are easy to maintain and evolve. In this article, we will explore the benefits of using Next JS with Typescript and how to get started with this powerful combination. Next.js is a popular React-based framework that makes it easy to […]

Read More

In the previous article, we discussed how to use environment variables in Next JS. But that was in the local environment. But when we deploy our app then how we can add the env variables and also make them private? So in this article, we are going to learn Deploy Next JS with Environment Variables […]

Read More

We use a variety of services in our application while constructing projects. In the case of APIs, several technologies employ tokens or API keys to grant authorised users access to endpoints. These API keys are confidential and cannot be disclosed to anybody online. While deploying the code, we hide the key using an environment variable. […]

Read More

The most valuable commodity in the world right now is data. Therefore, if you want to grow your business, you must understand how your people are utilising your platform. And in the world of analytics, Google Analytics is the most used tool and it’s completely free to use. In this article, we are going to […]

Read More

Redirects are one of the essential features of a web app. With redirects, you can redirect a user to the login page if the user is not logged in. You can add a redirect from the old URL to your new URL. There are so many ways you can use the redirect. In this article, […]

Read More

An application programming interface (API) is the easiest way for applications to communicate with each other. And with the help of API, we can make out own UI with the help of existing data available on the internet. There are two major types of API available – REST API and GraphQL API. GitHub has also […]

Read More

How to Generate ZIP with file links after API call and download the ZIP file on the client side React JS and Next JS

Read More

Styling is important in every website but it is equally difficult to add CSS with just .css files. And when you’re using Next JS then you have so many options to choose from. But they are not easy to set up. Next JS supports CSS modules by default but CSS modules are not that interesting […]

Read More

This is how you can Highlight Code Syntax in Next JS in SSR with Highlight.js with lots of code themes in both light and dark mode.

Read More

A guide on How to Handle Cookie Consent in Next JS and React JS Applications with all customizable props and actions.

Read More

Recently Next JS introduced On-demand Revalidation. On v12.2.0 Next.js supports On-Demand Incremental Static Regeneration to manually purge the Next.js cache for a specific page. Now you can update your site in the following cases. To test this we need to disable cache in apollo-link or apollo-client. In the defeultOptions, fetchPolicy as no-cache avoids using the […]

Read More

Tailwind is a utility-first CSS framework packed with classes. It’s easy to use and can be composed to build any design, directly in your markup. Tailwind can be used in any framework like React JS, Next JS and even Vanilla JS. We are going to use SCSS with Tailwind in Next JS. This is A […]

Read More

In this post, we are going to make a simple contact form with Next JS and save Form data in Google Sheets. This form will have four files – Full Name, Email, Topic & Description. Also Read: Next JS Project Ideas to Boost Your Portfolio App Register for Google Sheet Here are the detailed step-by-step […]

Read More