Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Lessons:23Length:3.3 hours

Next lesson playing in 5 seconds


Free Preview: Build an App With GraphQL, Laravel, and Vue


  • Overview
  • Transcript

RESTful APIs have many issues. They can require multiple round trips to multiple endpoints in order to fetch related data, and they're prone to over or under fetch data. GraphQL, a relative newcomer to the web API space, aims to solve those issues with more flexible queries and better tooling. GraphQL promises to provide API end users with a more dynamic and robust API for fetching and submitting data.

Join Jeremy McPeak in this course as he teaches you how to create GraphQL APIs with PHP and consume them with JavaScript. You'll learn how to create a GraphQL server for your Eloquent data with minimum boilerplate, and then you'll learn how to consume the GraphQL API from Vue.js. On the front-end, you'll learn how to query GraphQL without any special client libraries as you understand how all the requests and responses work. Along the way, you'll build a complete single-page web app with this cutting-edge API technology.

1. Introduction

1.1 Introduction

So you've built RESTful API's and you've been looking for something better. I mean, Not to knock REST but it does have its issues. The biggest is that it can take multiple round trips to multiple end points to fetch related data. Thus requiring more code, more bandwidth, and that all just boils down to more time. But then there's GraphQL, which is a relative newcomer to the web API space. It was developed by Facebook, yes the same company that brought us React and that promises to provide end users with a more dynamic and robust API for fetching and submitting data. Hi, I am Jeremy McPeak and I invite you to spend a few hours with me as I build a single page app completely from scratch using Laravel, Vue, and the GraphQL API. Will start at the very beginning and you'll learn the basic tenants of GraphQL and how it is designed to let you choose what data you need for your clients application. You'll learn how to build and query a GraphQL API, which proves to be very different from REST. From there, we'll talk about how mutations affect changes on the server and how to incorporate authentication with your GraphQL API. We'll then talk about input types and how they can simplify how you send data to and work with it on the server, we have a lot of ground to cover. So when you're ready, queue up the next video and we will get started.

2. First Steps

2.1 Setting Up the Project

Normally the first video after the introduction usually goes over all of the things you need to follow along. However I figure if you are interested in using GraphQL in a Laravel application, you already have everything you need. Your composer PHP, some kind of database and a web server, all that stuff that you need to develop PHP applications. So we're just going to skip all that. And if you need that, I would recommend that you start someplace else because I'm going to assume that you are familiar with Laravel. You don't have to necessarily be familiar with GraphQL but I'm not going to be explaining really anything as far as Laravel is concerned. So if you don't know Laravel or at least have a basic understanding of it, then I recommend that you get up to speed with Laravel first. All right, so I'm just going to jump right in. We're going to create a new project. I'm gonna call it project-manager. And I should point out that I have the latest version of Laravel as of this recording which is five dot eight. And that's important because there are some other frameworks that don't necessarily work well or work at all with Laravel five eight or five seven. Like for example, since we are going to be building essentially a Web API. Well, we typically need to have some kind of authentication and authorization involved. And usually that involves tokens like JWT. Well, unfortunately JWT doesn't work with the later versions of Laravel. So there are some things that we can use, or some things we can't. And unfortunately JWT is one of those, but that's okay. We don't necessarily have to use JWT in order to provide some kind of token authentication, which we will get into at a later time. And after your project is created, then we can go ahead and install the package that we need for incorporating GraphQL within our application. So be sure that you are in the directory for your project. And we are going to use composer to install a package called rebing/graphql-laravel. And one of the great things about using this with a later version of Laravel like Laravel five point five and above, we don't really have to do anything as far as configuration is concerned. It's going to automatically pick up this package so that we don't have to go and then tell our project, hey, this is something that we need to add to the whole pipeline. It's automatically going to be done for us. Now, there are some things that we will need to do as far as the configuration is concerned like setting up our queries and things like that. But as far as just getting up and running this is all that we have to do except that we will need to publish this. So once this is done installing which doesn't take very long, we will then run Artisan to publish this package. And so we will say php artisan vendor: publish --provider. Is going to be Rebing/GraphQL/GraphQLServiceProvider, and that's it. So, once that's done we can go ahead and open up our code editor and start setting up our project so that we can start using GraphQL. So the first thing I'm going to do is open up the dots in V file so that we can provide the appropriate database connection. Now as far as my information is concerned, everything is correct except the database, which we need to create, don't we? So we're going to call it projects_ manager, and then the user name is root and the password is root. Of course, the user name and password is going to vary based upon what your particular setup uses. And of course, if you're using some other type of database, then you will need to make the necessary changes there. And since we're talking about the database stuff, let's go ahead and create that. So you can use whatever tool that you want to use to interface with your database. I'm going to use the MySQL Workbench. This is provided by MySQL and it gives you a graphical interface. There's some that are command line, if you want to go to command then feel free. When it comes to working with databases, however, I like to have a graphical interface. So, very quickly, we're just going to create the database. Which is very simple. I just need to right click somewhere and create schema. We're going to call this project_manager where you will apply and that's really all that we are going to need. Now if you wanted to keep this open in order to just look at the database stuff, that's fine. Which I'll probably leave this up and running for at least a little bit. But thankfully, most of the database work that we're going to be doing will be through Eloquent and Artisan to create our migrations, which we will do in the next lesson.