Mastering Nuxt's Avatar

Mastering Nuxt

@masteringnuxt.com

Learn how to develop and deploy fast, production-ready Nuxt apps. Courses developed in collaboration with @nuxt.com Powered by @bitterbrains.com

330
Followers
54
Following
440
Posts
06.11.2024
Joined
Posts Following

Latest posts by Mastering Nuxt @masteringnuxt.com

Post image

Nuxt Tip πŸ’‘

The stale-while-revalidate pattern: Serve fast, update in background. Users get instant responses (even if slightly stale) and the cache rebuilds in the background.

Here's how you can do this in Nuxt/ Nitro.πŸ‘‡

24.02.2026 14:49 πŸ‘ 2 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Post image

Nuxt 4's cachedEventHandler is a fantastic feature.πŸ”₯

All you do is wrap your API routes to cache responses!

17.02.2026 14:33 πŸ‘ 2 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Post image

Unpopular opinion: Many plugins should be composables instead.

Plugins load on every page.

But composables load only when you use them.

10.02.2026 14:33 πŸ‘ 2 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Post image

Nuxt Tip πŸ’‘

Want to reduce your initial bundle size?

Use the Lazy prefix on component.

Components behind v-if still get bundled unless you add "Lazy" to the name. Then they only load when needed.

03.02.2026 13:09 πŸ‘ 4 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Preview
Performance Optimization in Nuxt 3 What makes Nuxt to be considered performant. This articles dives into Nuxt 3 performance optimization techniques and features for building lightning-fast web apps. Explore hybrid rendering, lazy loading, smart caching, image optimization, and Core Web Vitals improvements.

πŸ’¨Β Nuxt 3 is fast by default. But the real gains come from how you use it.

Hybrid rendering, lazy loading, smart caching, image optimization, and Core Web Vitals explained in one practical guide πŸ‘‡
https://masteringnuxt.com/blog/performance-optimization-in-nuxt-3

22.01.2026 14:33 πŸ‘ 1 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Preview
Certificates.dev Free Weekend | Free access to JavaScript Developer Certification Training Unlock 48 hours of free access to the Certified JavaScript Developer Training on Feb 7-8 2026 . Dive into theory, coding challenges, quizzes, and a trial exam.

JavaScript skills don’t grow by accident.
They grow when they’re challenged. ⚑

Get 48 hours FREE access to our Mid-Level JavaScript study guide on Feb 7–8 & put your skills to the test.

πŸ’»18 Code Challenges 🧠42 Quizzes πŸ“š17 Lessons πŸ“Trial Exam

Sign upπŸ‘‡
https://go.certificates.dev/jsfwx

15.01.2026 13:32 πŸ‘ 4 πŸ” 3 πŸ’¬ 0 πŸ“Œ 0
Post image

Happy 2026! πŸŽ†

May your Nuxt apps load faster, your components stay lazy, and your dev workflow stay blissfully bug-free.

What feature or improvement do you really hope Nuxt brings in 2026? πŸ”₯

01.01.2026 09:13 πŸ‘ 4 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Post image

If you encounter an error during server-side rendering, Nuxt provides the `<NuxtClientFallback>` component to display fallback content.

It shows a custom UI when a server-rendered component fails.

You must enable it by setting `experimental.clientFallback` to `true`.

30.12.2025 09:13 πŸ‘ 3 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Post image

Happy Holidays from the Mastering Nuxt team πŸ’š

We want to send a big thank you to our amazing community of devs & Nuxt enthusiasts.

Here’s to more coding, creativity, and incredible Nuxt apps in 2026 πŸ’«

24.12.2025 15:13 πŸ‘ 1 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Post image

Nuxt Tip of the Week πŸ’‘

If you want to run code on the client before Nuxt does any initialization, use the `onPreHydrate` composable.

This lets you manipulate the DOM or add event listeners using only vanilla JavaScript

22.12.2025 13:10 πŸ‘ 4 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Preview
Mastering Nuxt | The official courses for learning Nuxt The complete guide to developing and deploying fast, production-ready Nuxt apps. MasteringNuxt is the most in-depth, fun, and realistic course made on Nuxt.

Building with @nuxt_js in 2026? Start strong before the year ends.

End of Year Sale is now live - get can get access to the official Nuxt 4 course for less:
⚑️ Up to 33% off the Full Stack Unleashed Complete
⚑️ 59% off the Super Bundle

Get yours todayπŸ‘‡
https://masteringnuxt.com/

19.12.2025 14:33 πŸ‘ 1 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Post image

Tip of the Day πŸ’‘

With @nuxt_js, you can access the entire payload sent from the server to the client using the `useNuxtApp` composable.

This allows you to inspect all the data and state transferred during SSR or hydration.

18.12.2025 15:35 πŸ‘ 1 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Post image

Did you know that Nuxt Image v2 allows you to programmatically transform images from within your Nitro endpoint πŸ‘‡

11.12.2025 14:33 πŸ‘ 3 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Preview
Mastering Nuxt | The official courses for learning Nuxt The complete guide to developing and deploying fast, production-ready Nuxt apps. MasteringNuxt is the most in-depth, fun, and realistic course made on Nuxt.

Serious Nuxt apps need serious knowledge - now’s your chance to learn! πŸ’»

Cyber Monday is your last shot to grab Mastering Nuxt Full Stack Unleashed, the official course for Nuxt, with full-stack projects, AI chat apps & more - up to 60% off πŸ‘‡
https://vue.school/mnbf25x

01.12.2025 14:33 πŸ‘ 2 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Preview
Mastering Nuxt | The official courses for learning Nuxt The complete guide to developing and deploying fast, production-ready Nuxt apps. MasteringNuxt is the most in-depth, fun, and realistic course made on Nuxt.

Learn Nuxt 4 the official way this Black Friday!πŸš€

πŸ’£ 40% off the Complete Bundle
OR
πŸ’₯Go all-in with the Super Bundle at 62% off

Unlock 100+ lessons & everything Michael Thiessen & the Nuxt team helped build into the official course.πŸ‘‡
https://vue.school/mnbf25x

28.11.2025 09:30 πŸ‘ 3 πŸ” 1 πŸ’¬ 0 πŸ“Œ 0
Post image

Nuxt Tip of the Day πŸ’‘

In Nuxt 4.2, you can pass in your own AbortController when data fetching if you need fine-grained control over when requests are canceledπŸ‘‡

26.11.2025 14:54 πŸ‘ 2 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Preview
26 Nuxt Features You May Have Missed Explore the most impactful features from Nuxt 3.0 to 3.17 you may have missed β€” with clear examples, explanations, and upgrade notes for Nuxt 4 users.

Turns out Nuxt versions 3.0 to 3.17. had hidden gems all along. πŸ’Ž

We’ve rounded up 26 hidden features, route groups, preview mode, delayed hydration, and more - with examples and tips for upgrading to Nuxt 4.

Discover them here πŸ‘‡
https://masteringnuxt.com/blog/26-nuxt-features-you-may-missed

24.11.2025 14:33 πŸ‘ 3 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Preview
Mastering Nuxt | The official courses for learning Nuxt The complete guide to developing and deploying fast, production-ready Nuxt apps. MasteringNuxt is the most in-depth, fun, and realistic course made on Nuxt.

Mastering Nuxt Fullstack Unleashed is the official @nuxt.com 4 course! πŸ†

Built with @michaelthiessen.bsky.social & the Nuxt team, it has 100+ lessons, a full AI chat app, real-world production patterns & more

Master full-stack Nuxt dev today - up to 70% off πŸ‘‡
vue.school/mnseb25x

21.11.2025 14:36 πŸ‘ 0 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Preview
10 Dev Tricks to Build Your Nuxt App Faster Practical tips and tricks to speed up your Nuxt development workflow, from auto-imports to DevTools and beyond.

You’re probably building your Nuxt app slower than you need to.

Not because you're doing anything wrong… but because Nuxt hides a ton of shortcuts in plain sight.

Here are 10 tricks that instantly speed up your workflow. πŸ‘‡

https://masteringnuxt.com/blog/10-dev-tricks-to-build-your-nuxt-app-faster

17.11.2025 14:53 πŸ‘ 1 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Post image

When working with Nuxt, the `nitroApp` object inside plugins gives you access to various runtime hooks.

These hooks include `close`, `error`, `render:response`, `request`, `beforeResponse`, & `afterResponse`.

You can use these to run custom logic at different stages of the server lifecycle.

13.11.2025 15:36 πŸ‘ 2 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Preview
Certification of Competency for Modern Developers Get Certified! Have your developer skills validated and stand out in the crowd for promotions and new positions.

Forget the hardware upgrades - this Black Friday, upgrade you!πŸ’ͺ

The Black Friday Early Bird Deal is LIVE: up to 60% OFF @vuejs.org, @nuxt.com, React, Angular, & JavaScript Certification + get bonus items with Mid or Senior Certification🎁

Don’t miss our biggest deal everπŸ‘‡
go.certificates.dev/eb25X

11.11.2025 16:19 πŸ‘ 5 πŸ” 2 πŸ’¬ 0 πŸ“Œ 0
Post image

Nuxt Tip Of The Week πŸ’‘

When you want to create a redirect in a server route, Nuxt lets you use the `sendRedirect` method from h3.

By default, this sends a 302 (temporary) redirect, but you can specify a different status code if needed.

06.11.2025 14:32 πŸ‘ 0 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Preview
Understanding useState in Nuxt: The Simple Way to Share State Need a simple shared state management solution for your Nuxt app? In this article, explore `useState` : Nuxt’s built-in composable for shared reactive data that works seamlessly with SSR.

Tired of passing props through a maze of components? πŸŒ€

Learn how `useState` keeps your app reactive, SSR-ready, and perfectly simple - no complex setup, no data leaks, just clean global state that works.

https://masteringnuxt.com/blog/understanding-usestate-in-nuxt-the-simple-way-to-share-state

03.11.2025 14:32 πŸ‘ 3 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Post image

Nuxt Tip Of The DayπŸ’‘

With Nuxt, since version 3.9, you can control how fetch requests are deduplicated using the dedupe parameter in the useFetch composable.

By setting dedupe to 'cancel', the previous request is cancelled and a new one is made whenever parameters change.

14.10.2025 14:26 πŸ‘ 4 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Post image

Nuxt TipπŸ’‘

With Nuxt, you can access the entire payload sent from the server to the client using the useNuxtApp composable.

This allows you to inspect all the data and state transferred during SSR or hydration.

08.10.2025 14:41 πŸ‘ 1 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Post image

πŸ’‘ Did you know that with Nuxt you can access the entire payload sent from the server to the client using the `useNuxtApp` composable?

This allows you to inspect all the data and state transferred during SSR or hydration.

02.10.2025 14:32 πŸ‘ 4 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Post image

Tip of the day πŸ’‘

When working with Nuxt, you can control where your code runs by checking the environment. Use if (!import.meta.server) to skip code on the server, and if (!import.meta.client) to skip code on the client.

29.09.2025 10:27 πŸ‘ 2 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Preview
ViteConf The Official in-person Vite Conference organised in collaboration with the Creator of Vite, Evan You and Vite Core Team!

πŸ”₯Β ViteConf 2025 is almost here! πŸ”₯

Join Evan You, Daniel Roe, Anthony Fu, and more for two days of deep Vite talks, workshops, and the latest in web tech.

See how Vite is powering Nuxt and shaping the future of web development.

🎟️ Info & Tickets here: https://viteconf.amsterdam/

25.09.2025 14:32 πŸ‘ 4 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0
Post image

When writing unit tests, Nuxt provides a way to opt-in to a Nuxt environment by adding `.nuxt.` to your test filenames.

For example, you can name your test file like this πŸ‘‡

23.09.2025 10:27 πŸ‘ 2 πŸ” 0 πŸ’¬ 0 πŸ“Œ 0