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

Rethinking frameworks with Nuxt, Nitro, and UnJS
04:25 MIN

Rethinking frameworks with Nuxt, Nitro, and UnJS

Building for the Edge - Crafting a Next-Gen Framework

Understanding Nuxt as a Vue-based meta-framework
05:42 MIN

Understanding Nuxt as a Vue-based meta-framework

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

The motivation behind Nuxt 3 and the UnJS ecosystem
03:37 MIN

The motivation behind Nuxt 3 and the UnJS ecosystem

Modern Web Development with Nuxt3

Built-in performance optimizations in Nuxt 3
03:23 MIN

Built-in performance optimizations in Nuxt 3

Modern Web Development with Nuxt3

Using Nuxt.js for server-rendered Vue.js applications
01:42 MIN

Using Nuxt.js for server-rendered Vue.js applications

Next, Nest, Nuxt… Nust?

Understanding the Nuxt 2 foundation and its benefits
02:27 MIN

Understanding the Nuxt 2 foundation and its benefits

Modern Web Development with Nuxt3

Learning from Nuxt 2 to define Nuxt 3 goals
03:31 MIN

Learning from Nuxt 2 to define Nuxt 3 goals

Building Better with Nuxt 3

Extending functionality with the Nuxt module ecosystem
02:20 MIN

Extending functionality with the Nuxt module ecosystem

Modern Web Development with Nuxt3

Featured Partners

Related Videos

See all videos
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

Modern Web Development with Nuxt341:43

Modern Web Development with Nuxt3

Alexander Lichter

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

To New Frontiers: The Future of Frontend Development26:00

To New Frontiers: The Future of Frontend Development

Rainer Hahnekamp

Next, Nest, Nuxt… Nust?26:30

Next, Nest, Nuxt… Nust?

Marius Obert

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

petite-vue - Progressively enhancing every application?

Alexander Lichter

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.