Alexander Lichter

Nuxt.js - Just Vue 3 and a bit of magic?

What if your Vue app had a full-stack backend built right in? See how Nuxt 3's server engine makes it possible with typed APIs and universal deployment.

Nuxt.js - Just Vue 3 and a bit of magic?
#1about 2 minutes

Understanding the core features of Nuxt 3

Nuxt 3 is a versatile Vue-based framework that supports various rendering modes and universal deployment to platforms like Node.js, serverless, and the edge.

#2about 4 minutes

Setting up a project and creating file-based routes

Initialize a new Nuxt application and create pages using the file-based routing system within the `pages` directory, rendering them with the `<NuxtPage>` component.

#3about 7 minutes

Fetching data and creating dynamic page routes

Use the `useFetch` composable to retrieve data from an external API and create dynamic routes using bracket notation in filenames to display content based on URL parameters.

#4about 2 minutes

Creating type-safe server API routes with Nitro

Build backend API endpoints directly within your Nuxt project using the `server` directory and Nitro's `defineEventHandler`, which provides automatic type inference for frontend data fetching.

#5about 4 minutes

Connecting to persistent storage with Unstorage drivers

Integrate persistent data storage by configuring an Unstorage driver like Cloudflare KV in `nuxt.config.ts` and interacting with it using the `useStorage` composable in Nitro server routes.

#6about 5 minutes

Implementing a backend-for-frontend to cache API calls

Create server routes that act as a proxy to an external API, caching the results in persistent storage to build a resilient backend-for-frontend (BFF) pattern.

#7about 1 minute

Summary of Nuxt's benefits and advanced features

A review of Nuxt's powerful developer experience and a look at other advanced features like dev tools, layouts, modules, and state management that were not covered in the demo.

Related jobs
Jobs that call for the skills explored in this talk.

Matching moments

Navigating the growing complexity of modern CSS
09:00 MIN

Navigating the growing complexity of modern CSS

WeAreDevelopers LIVE – You Don’t Need JavaScript, Modern CSS and More

The only frontend stack that truly matters
11:10 MIN

The only frontend stack that truly matters

WeAreDevelopers LIVE – Frontend Inspirations, Web Standards and more

Why you might not need JavaScript for everything
02:33 MIN

Why you might not need JavaScript for everything

WeAreDevelopers LIVE – You Don’t Need JavaScript, Modern CSS and More

Exploring modern JavaScript performance and new CSS features
08:07 MIN

Exploring modern JavaScript performance and new CSS features

WeAreDevelopers LIVE – AI, Freelancing, Keeping Up with Tech and More

The industry's focus on frameworks over web fundamentals
11:32 MIN

The industry's focus on frameworks over web fundamentals

WeAreDevelopers LIVE – Frontend Inspirations, Web Standards and more

The value of progressive enhancement and semantic HTML
03:31 MIN

The value of progressive enhancement and semantic HTML

WeAreDevelopers LIVE – You Don’t Need JavaScript, Modern CSS and More

Improving the developer feedback loop with specialized tools
03:16 MIN

Improving the developer feedback loop with specialized tools

Developer Time Is Valuable - Use the Right Tools - Kilian Valkhof

The challenge of keeping up with modern CSS
07:46 MIN

The challenge of keeping up with modern CSS

WeAreDevelopers LIVE – AI, Freelancing, Keeping Up with Tech and More

Featured Partners

Related Videos

See all videos
Modern Web Development with Nuxt341:43

Modern Web Development with Nuxt3

Alexander Lichter

Building Better with Nuxt 341:22

Building Better with Nuxt 3

Daniel Roe

Building for the Edge - Crafting a Next-Gen Framework43:41

Building for the Edge - Crafting a Next-Gen Framework

Daniel Roe

Fast & Furious - Going headless with Nuxt.js!42:21

Fast & Furious - Going headless with Nuxt.js!

Samuel Snopko

WeAreDevelopers LIVE - Whats Nuxt and Next for app development, 20 years AJAX and more1:03:53

WeAreDevelopers LIVE - Whats Nuxt and Next for app development, 20 years AJAX and more

Chris Heilmann & Daniel Cranney & Alexander Lichter

petite-vue - Progressively enhancing every application?44:40

petite-vue - Progressively enhancing every application?

Alexander Lichter

Next, Nest, Nuxt… Nust?26:30

Next, Nest, Nuxt… Nust?

Marius Obert

To New Frontiers: The Future of Frontend Development26:00

To New Frontiers: The Future of Frontend Development

Rainer Hahnekamp

Related Articles

View all articles
BR
Benjamin Ruschin
The HTML Elements That You’re Probably Over-Engineering
As frameworks have become more and more commonplace in the world of web development, so too has the over-engineering of features made possible by our humble old friend, HTML. The mental models that come with using state management in React, Vue and o...
The HTML Elements That You’re Probably Over-Engineering
LM
Luis Minvielle
The Best 7 Frontend Frameworks for Developers in 2025
Which frontend frameworks should developers focus on in 2025? We’re listing them for you and showing advantages and drawbacks. You’ll notice we included some libraries as well, because you can’t miss those in 2025.What is the best front end framework...
The Best 7 Frontend Frameworks for Developers in 2025

From learning to earning

Jobs that call for the skills explored in this talk.