So there I was—building my ninth side project that’ll never launch 😅, trying to decide which frontend framework would let me ship fast and still feel in control. I had a drawer full of unfinished React apps, a dozen starter templates bookmarked, and an itch to try something new. That’s when Nuxt caught my eye.
It looked boring for someone who so used to set things up from "scratch". A lot of magic. Too many folders. But a weekend with it changed how I think about building apps. This isn’t just Vue with routing. It’s something else. Something more cohesive. Something React still doesn’t have.
Vue, But With Batteries Included
Nuxt isn’t a framework on top of Vue — it’s Vue preconfigured for reality. Think of it like TanStack Query, React Router, Vite, and a sprinkle of server boilerplate — all stitched together, but without the seams showing 😌.
There’s no need to make 15 decisions before writing your first line of code. Just drop a .vue
file into the pages/
folder, and you're live. Want layouts? Use layouts/
. Need a backend? Drop your handlers in server/api/
.
Routing Without Routing
Nuxt uses filesystem routing like Next.js, but it feels less verbose (at least so far!). It's like the goodness of TanStack Router inside Next.js 😍, best of both the worlds.
Compare that to React (Router 🤫), where you end up stitching layouts with nested route trees, and it always feels fragile.
Data Fetching: The Battle of Opinions vs. Just Working™
In React and Next.js, data fetching is… an opinion war 🥲.
You’ve got useEffect
, useSWR
, React Query
, getServerSideProps
, getStaticProps
, Server Actions, Suspense boundaries, and what not! All subtly different, all context-dependent, all needing mental overhead.
You pause to ask:
- Is this server or client?
- Should I preload or hydrate?
- Do I need a fallback UI?
- Am I about to trigger a double fetch?
It’s flexible, sure — but it's fragile. You're holding the wires together, hoping nothing breaks in hydration.
Then I tried Nuxt:
const { data, pending, error } = await useFetch('/api/posts')
That’s it. SSR-safe. Client-ready. Automatically tracks loading and errors. No extra hooks. No memoization rituals. No dependency arrays.
Want to preload server-side and share on client? Use useAsyncData
:
const { data } = await useAsyncData('posts', () => $fetch('/api/posts'))
Nuxt doesn’t ask you to choose how you want to fetch — it gives you a consistent, reactive API that “just works” everywhere.
At first, I was skeptical. I didn’t like the idea of a framework having such strong opinions. But then I gave it some time and realised… I never once missed useEffect
.
Dev Experience That Slaps
React devs have grown so used to the friction — setting up linters, babel plugins, waiting for Turbopack promises to land, gluing together Router + Query + Suspense + XState + TanStack + some new meta-framework that changes again next week.
With Nuxt, the DX is intentionally boring. You don’t have to "assemble" your stack before you build. You just… build.
It’s hard to explain how liberating this is until you feel it 🥰.
Even HMR feels more intuitive. Nuxt’s tight integration with Vite and Vue’s compiler gives you state-preserving updates that React Fast Refresh still struggles with.
The cherry on top? DevTools. Vue Devtools + Nuxt Devtools give you deep visibility into component state, server/client boundaries, performance, and even injected dependencies.
Honestly, after using Nuxt, going back to React feels like opening 5 tabs just to hydrate a list 😅.
The Road Ahead: Real Projects with Nuxt
Nuxt abstracts away the architecture headaches, so you can focus on building features. The dev experience is seamless, with built-in SSR, file-based routing, and a declarative way to fetch data.
However, it’s not without its drawbacks. The community, while solid, isn't always as comprehensive as React’s. There are a few quirks with how Nuxt handles plugin scoping and server-client distinctions, which may feel limiting if you're coming from React's flexibility.
So far in this series, we explored Vue’s reactivity, built a Tic-Tac-Toe app, and learned to think in Vue.
With Nuxt, we’re entering a new phase: production-grade development. In the next article, we’ll build something real — maybe a blog, a dashboard, or a hybrid app with markdown content and SSR APIs. We’ll test Nuxt’s composables, explore content module, authentication, and real deployment.
Top comments (0)