From the course: Learning Nuxt.js

Unlock the full course today

Join today to access over 24,400 courses taught by industry experts.

Challenge: Create an image gallery

Challenge: Create an image gallery

From the course: Learning Nuxt.js

Start my 1-month free trial Buy for my team

Challenge: Create an image gallery

“

(upbeat electronic music) - [Instructor] It's time for another challenge. In this one, you get a chance to practice what you've learned about data fetching. Your challenge is to create an image gallery using data provided from an API source. To get you started, I've provided an API endpoint where you can get sample images to use for this challenge. You can check the exercise files for the link to the API endpoint. Here's the challenge objectives. First, I would like for you to open the API endpoint in your browser or API clients to see what data is available for you to consume. Next, create a gallery.vue component and inside the component, use the asyncData hook and either the HTTP or the Axios module to consume the endpoint. Populate the data you receive in a grid or gallery formats and also feel free to style this however you want.

Contents