🍿 Did you know this about Caching in Next.js?

Hey friend,

ICYMI, I've a Black Friday Sale on until Sunday 📣.

You can get 50% OFF using the code 'BLACKFRIDAY' on the below 2 products.

Developer to Leader Program 🚀

Learn how to lead a team & build a high-performing team even if you have less experience.

Check it out

Engineering Leader's Playbook 📚

Learn how to be successful in your first 90 days and what it takes to become a Leader.

Snag it

It has been a fantastic week for me. My YouTube channel 🎥 is growing, and I have received great feedback on the Tailwind course and other videos.

Check out the content if you want to become a better Frontend Developer!

Brand new course on Freecodecamp ✨

I also launched a FREE course on Becoming a Great Manager on FreeCodeCamp. I have often referred to Freecodecamp over the years, and it feels like a dream come true to see my content published there.

Our Weekly Snack: Purge Cache in Next.js Server Action 🍿

This week's weekly snack will be on Next.js Server Actions and how to purge cache and redirect the user on the server side.

Server Actions are now in React Canary and ready for frameworks and libraries to adopt! If you want to learn Server Actions in-depth and prefer a video walkthrough, check out this comprehensive video I created.

But if not, keep reading more about purging the cache in Next.js and redirecting the user.

But first, What are Server Actions?

Next.js server actions allow you to write backend code directly inside your React components. This eliminates the need to build a separate API endpoint to handle form submissions, data updates, and more.

Key takeaways:

Server actions let you run code directly on the server without a separate API.
Great for form handling, database updates, validation, redirects, etc.
Scales easily alongside your frontend code

createUserAction is a server action where you parse the formData and insert data into the database.

redirect function 🚀

In server actions, you can perform routing, which is quite neat.

Thanks to the redirect function. You can direct a user directly to another path.

But after re-directing, you may not see the latest data.

Because by default, Next.js will cache as much as possible to improve performance and reduce cost. This means routes are

statically rendered, and data requests are cached unless you opt-out.

You can read more here ↗️

revalidatePath 🚀

To purge the cache data at that specific route, you need to use revalidatePath now. This is what we did with `/posts`.

Latest Frontend News 🤫

Next.js supports Partial Pre-rendering 🔥

Next.js Vercel now has a feature that supports partial pre-rendering, which means you can defer rendering certain parts of your page.

This is awesome for speeding up your site's performance! For example, you can now hold off on displaying comments on a blog post until your reader reaches them. By the time they finish reading, voila! The comments will magically appear, all ready for

⚠️ This feature is experimental.

But check out this demo that Guillermo created. It's really cool.

Guillermo Rauch

@rauchg

I upgraded http://how-is-this-not-illegal.vercel.app to use partial-prerendering.

The speed is absolutely nuts. I see as low as 15ms TTFB from my home Wi-Fi in SF. The final result streams from us-east, where the core pokemon database is.

Speed *and* code simplification. Let's dive in 🧵

7:13 PM • Nov 11, 2023

101

Retweets

1423

Likes

Read 35 replies

A healthy battle between Next.js and Remix 🥊

Kent C Dodds shares why he won't use Next.js ↗️.

Then Lee Robinson adds a very healthy response: Why I'm using Next.js ↗️.

The Frontend Developers Toolbox 🧰

Auto detect and View Layout shifts in your pages on Vercel. Check here ↗️
A script ↗️ to add gravity to any site - it's really cool
A real reason why you are not a Senior Engineer and want to be, view this video ↗️ here.

I would love to hear from you 🙏

I'm on a mission to cook up some fresh, mind-blowing courses, and I want to know from you:

What's on YOUR wishlist? Whether it's a deep tech dive, an exploration of the unknown, or just something tickling your brain cells – spill the beans!

Just hit 'reply' to my email. Your ideas are like gold nuggets; I can't wait to turn them into something extraordinary.

Big thanks for being awesome🌟.

I hope you have a great day!