Intro to Vuex and the Server
4:01
Connecting to a REST Server
8:20
Loading Server data into Vuex
10:18
Switching to JSON API
5:09
Data Relationships with JSON API and Vuex
19:11
Tags Page
7:15
Our First Reusable Component
6:19
0% done with Vuex: Loading data using axios and deserializing JSON API relationships

Chapter 2 of 27 in Building VueScreencasts.com
Data Relationships with JSON API and Vuex

Getting data relationships from an API can seem difficult at first... but thanks to JSON API's consistent format, we're able to load our videos and tags, and their relationships, with ease.

In this lesson, we learn how to do some basic munging on incoming data, so it's easier to use within our app, and then attach the tags to the videos and display them as nice green buttons.

Ruby on Rails code

Github: loading JSONAPI relationship (note: this one has some MirageJS mixed in, ignore that if you're not going that path.

Github: showing tags on videos

MirageJS Video

What do others think of VueScreencasts?
"Your series has really helped... even for seasoned developers!"
—D Durham
"Great tips great video thanks"
—Happyoe
"Wow Im gonna follow your video tutorial journey :D"
—Mathias Jacobsen
"Thanks for the tutorial. Subscribed!!!! :)"
—Zenish Shrestha
Take your career to the next level