Tonni Akter - Full Stack Web Developer

Tonni Akter - Full Stack Web Developer MERN Stack Developer | Scalable Web Applications | SaaS | React.js | Node.js | MongoDB | 4+ Years Experience | Serving Worldwide Clients

⚑ Next.js Cache Issue? Why Your Updates Are Not ShowingSometimes, after deploying a Next.js website, your users see old ...
04/04/2026

⚑ Next.js Cache Issue? Why Your Updates Are Not Showing

Sometimes, after deploying a Next.js website, your users see old content.

The culprit: caching issues in ISR (Incremental Static Regeneration) or browser cache.

Quick fix:

export async function getStaticProps() {
return {
props: { data },
revalidate: 10, // regenerates every 10 seconds
}
}

πŸ’‘ Always set proper revalidation time and clear CDN cache for instant updates.

Question for developers: How do you manage ISR caching on large projects?

πŸš€ **Full Stack React & Node.js E-Commerce Project**Excited to share one of my **Full Stack Web Development Projects** th...
22/03/2026

πŸš€ **Full Stack React & Node.js E-Commerce Project**

Excited to share one of my **Full Stack Web Development Projects** that I built using **React.js and Node.js**.

πŸ”— Live Demo: https://shopcart.reactbd.com/

This project is a **modern eCommerce website** designed to demonstrate how scalable and fast web applications can be built using the **MERN stack architecture**.

πŸ’» **Technology Used**
βœ” React.js (Frontend UI Development)
βœ” Node.js (Backend Server)
βœ” REST API Integration
βœ” Modern Component Based Architecture
βœ” Responsive UI Design

πŸ›’ **Core Features**
β€’ Product Listing System
β€’ Shopping Cart Functionality
β€’ Dynamic UI Rendering
β€’ Fast React Performance
β€’ Clean & Scalable Code Structure

As a **Full Stack Developer**, I focus on building **fast, scalable and SEO-friendly web applications** for businesses and startups.

If you need a **React, Next.js, Node.js or MERN Stack website**, feel free to connect with me.

πŸ‘©β€πŸ’» **Tonni Akter**
Full Stack Developer (React | Node | MERN)

; ; ; ; ; ; ; ; ; ; ; ; ; ; ;

⚑ Why Your Next.js Website Loads Slowly on First VisitEven well-built Next.js websites can feel slow on the first visit....
18/03/2026

⚑ Why Your Next.js Website Loads Slowly on First Visit

Even well-built Next.js websites can feel slow on the first visit.

This usually happens because:

β€’ Large JavaScript bundle
β€’ Too many API requests
β€’ Heavy images

πŸ’‘ Optimizing first contentful paint (FCP) is critical for user experience.

Improvement methods:

β€’ Image optimization
β€’ Lazy loading components
β€’ Reducing bundle size

πŸš€ Next.js Website Works Locally But Fails After DeploymentMany developers face this issue.The website runs perfectly in ...
18/03/2026

πŸš€ Next.js Website Works Locally But Fails After Deployment

Many developers face this issue.

The website runs perfectly in development.

But after deployment:

❌ Page crashes
❌ Environment variables missing
❌ API routes failing

The reason usually involves:

β€’ Incorrect environment configuration
β€’ Missing dependencies
β€’ Build errors

πŸ’‘ Always test production build locally.

npm run build
npm start

πŸ’‘ Why Some Third-Party Scripts Break Next.js PagesWhile integrating a chat widget in a Next.js website, the page suddenl...
17/03/2026

πŸ’‘ Why Some Third-Party Scripts Break Next.js Pages

While integrating a chat widget in a Next.js website, the page suddenly crashed.

The reason?

The script tried to access:

window
document

But during Server Side Rendering, these objects do not exist.

Fix

Load scripts only in the browser:

useEffect(()=>{
loadScript()
},[])

πŸ’‘ This prevents server-side crashes.

Question πŸ‘‡

Have you ever faced SSR errors caused by third-party scripts?

⚑ Next.js Edge Runtime Not Supporting Some Node.js APIsWhen trying to deploy a middleware function using Edge Runtime, I...
17/03/2026

⚑ Next.js Edge Runtime Not Supporting Some Node.js APIs

When trying to deploy a middleware function using Edge Runtime, I faced a limitation.

Some Node.js modules simply did not work.

Example:

fs module
crypto module

These modules are not supported in Edge Runtime environment.

πŸ’‘ Developers must use Web APIs instead of Node APIs when writing Edge functions.

Question for developers πŸ‘‡

Have you tried using Edge Runtime for performance improvements?

⚠️ Next.js Build Size Too Large? Your Website Might Be Slower Than You ThinkWhile analyzing a production build in Next.j...
17/03/2026

⚠️ Next.js Build Size Too Large? Your Website Might Be Slower Than You Think

While analyzing a production build in Next.js, I noticed something concerning.

The build output showed:

πŸ“¦ Large JavaScript bundle

This usually happens when developers import heavy libraries unnecessarily.

Example problem:

import * as lodash from "lodash"

Instead use:

import debounce from "lodash/debounce"

πŸ’‘ Smaller bundle size means:

β€’ Faster website load
β€’ Better SEO score
β€’ Improved mobile performance

Question πŸ‘‡

Do you check bundle size before deploying a project?

πŸ”Ž Why Your Next.js Website Is Not Showing Correct SEO Meta TagsWhile testing a Next.js project, I noticed something stra...
17/03/2026

πŸ”Ž Why Your Next.js Website Is Not Showing Correct SEO Meta Tags

While testing a Next.js project, I noticed something strange.

The page title and description looked correct in the code.

But when sharing the link on Facebook or LinkedIn, the preview showed:

❌ Wrong title
❌ Missing description
❌ Incorrect image

The reason?

The meta tags were not rendered properly on the server side.

Example fix using Next.js Head:

import Head from "next/head"


My Website



πŸ’‘ Proper meta tags improve:

β€’ Google search ranking
β€’ Social media preview
β€’ Website click-through rate

Question for developers πŸ‘‡

Do you manually manage SEO tags or use an SEO library?



Tonni Akter

πŸ“„ Next.js Page Not Updating Even After Changing Data?This issue surprised me when working with Static Site Generation (S...
17/03/2026

πŸ“„ Next.js Page Not Updating Even After Changing Data?

This issue surprised me when working with Static Site Generation (SSG) in Next.js.

I updated the database.

But the website still showed old content.

The reason?

The page was generated during build time only.

Example:

export async function getStaticProps(){
return {props:{data}}
}

This means the page does not update until the site is rebuilt.

Fix

Use Incremental Static Regeneration (ISR):

revalidate:60

Now the page refreshes every 60 seconds automatically.

πŸ’‘ This is one of the biggest differences between:

β€’ Static Generation
β€’ Server Side Rendering

Understanding this helps developers choose the right rendering strategy.

Question πŸ‘‡

Do you prefer SSR or SSG when building production apps?

⚑ Next.js API Routes Becoming Slow?While building backend APIs inside a Next.js project, I noticed something unusual.The...
17/03/2026

⚑ Next.js API Routes Becoming Slow?

While building backend APIs inside a Next.js project, I noticed something unusual.

The frontend UI was optimized.

But API responses were taking 3–5 seconds.

After analyzing the code, the issue was inside the API route.

Example:

const data = await db.users.find()

The database query was returning too much data, which slowed down the response.

Fix

Optimize database queries:

const data = await db.users.find().limit(10)

πŸ’‘ Efficient APIs improve:

β€’ Website performance
β€’ User experience
β€’ SEO ranking

Because slow APIs mean slow websites.

Question for developers πŸ‘‡

Which database do you use most with Next.js?

πŸ” User Logged In… But Logged Out After Refresh?This is a very common issue when building authentication systems in Next....
16/03/2026

πŸ” User Logged In… But Logged Out After Refresh?

This is a very common issue when building authentication systems in Next.js applications.

Everything seems to work:

βœ” Login successful
βœ” Dashboard loads

But when the user refreshes the page…

❌ Session disappears

The user becomes logged out again.

After debugging the authentication system, the problem is usually related to cookie configuration.

Common mistakes include:

β€’ Token stored only in React state
β€’ Missing cookie expiration
β€’ Secure cookie settings not configured

Example solution:

Store the session token in a cookie:

res.setHeader("Set-Cookie","token=abc123; HttpOnly; Path=/")

πŸ’‘ Proper session storage ensures users stay logged in across page refresh and navigation.

Question for developers πŸ‘‡

Do you prefer JWT authentication or session-based login?

🚨 Next.js Middleware Redirect Loop β€” A Bug That Can Crash Your WebsiteWhile implementing authentication in a Next.js pro...
16/03/2026

🚨 Next.js Middleware Redirect Loop β€” A Bug That Can Crash Your Website

While implementing authentication in a Next.js project, I once faced a strange problem.

The login system worked perfectly.

But after deploying the website, users started reporting:

⚠️ β€œToo many redirects” error

The page kept refreshing again and again.

After debugging the middleware, I discovered the issue.

The middleware was redirecting every route to /login, including the login page itself.

Example problem:

if(!user){
return NextResponse.redirect("/login")
}

Since /login also triggered the middleware, it created an infinite redirect loop.

Fix

Exclude authentication routes:

if(!user && pathname !== "/login"){
return NextResponse.redirect("/login")
}

πŸ’‘ Middleware is powerful in Next.js, but one small logic mistake can break the entire website.

Question for developers πŸ‘‡

Have you ever created an infinite redirect loop by mistake?

Address

Dhaka
1229

Website

Alerts

Be the first to know and let us send you an email when Tonni Akter - Full Stack Web Developer posts news and promotions. Your email address will not be used for any other purpose, and you can unsubscribe at any time.

Share

Category