/nuxt-async-data

🗂 Source code for the Async Data with Nuxt.js course

Primary LanguageVue

Async Data with Nuxt.js

This repository contains the example code for the Async Data with Nuxt.js course.

It can be difficult and cumbersome to set up a custom system to fetch asynchronous data before you serve your application to your users and render everything on the server-side. Since JavaScript was designed to mainly run client-side, it comes with a few unwanted traits.

Nuxt.js has made it breathtakingly easy to fetch asynchronous data and render our entire application on the server-side before we serve it to our users. In this course, you will learn a few different methods to fetch asynchronous data and what to be careful with. Secondly, you'll learn how to fetch asynchronous data and render your Nuxt applications server-side.

Server-side rendering brings invaluable performance and SEO benefits.

Even though it is impressively smooth to fetch and render async data server-side with Nuxt.js, you need to know the basics of Nuxt. If you do not, we recommend our Nuxt.js Fundamanetals course.

After this course, you will be familiar with:

  • How to best fetch asynchronous data according to your applications needs
  • The caveats of the fetch method when it comes to server-side rendering
  • The benefits of using Nuxt modules
  • How to extend the Nuxt.js framework with plugins
  • Fetching async data and render your Vuex store server-side
  • Impressed with how easy it is to squeeze out extra performance and SEO of your JavaScript applications with Nuxt.js

This course is made together with Nuxt.js core member Alexander Lichter.

Click here to watch the course


Build Setup

# install dependencies
$ yarn install

# serve with hot reload at localhost:3000
$ yarn run dev

# build for production and launch server
$ yarn run build
$ yarn start

# generate static project
$ yarn run generate

For detailed explanation on how things work, checkout Nuxt.js docs.