Basics of GraphQL in Ruby on Rails - Introduction | Alex Deva | Skillshare

Basics of GraphQL in Ruby on Rails - Introduction

Alex Deva

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
7 Lessons (15m)
    • 1. Promotional video

      1:10
    • 2. Introduction

      1:36
    • 3. What is GraphQL?

      2:19
    • 4. GraphQL versus REST

      2:14
    • 5. Requirements

      2:11
    • 6. Graphiql

      2:13
    • 7. The default query

      2:52

About This Class

This course teaches the basics of using GraphQL in a Rails application. GraphQL is a query language invented by Facebook in 2012, and made open source in 2015. While it has certain clear advantages over REST, it also has a somewhat steeper learning curve.

Structured in a simple and accessible manner, these lectures will help you get on your way to using GraphQL to circulate data between back-end and front-end applications.

After an introductory class, in the next class we will learn about reading data; in the third, about changing data; and the slightly more advanced fourth class is about protecting data.

This is the first class: Introduction.

Transcripts

1. Promotional video: Welcome to this course about the basics of graphic Yuelin Ruby on rails. In this course, you will learn how to use the graph QL query language in your back and applications to talk to your front and clients. I designed this course for rails developers who are interested in better alternatives for a P I communication, which is exactly why Facebook created rough You'll by the end of this course, you'll be able to take advantage of this new language and make life easier for yourself or the front of developers that you work with. The course is structured into three major sections reading data, changing data on protecting data. Together we'll build a simple app on You'll have a little home or two. Three. Ideal student for this course is a ruby on rails developer looking to build performance backhand applications rights. Feel free to take a look to the course description, and I look forward to starting it with you. 2. Introduction: Hello and welcome to this course titled Basics of Graft. UL in Ruby, on rails, rails and graphic. UAL, Our modern Web technologies Graft Jewel is a query language for AP. Eyes and Rails is known for making beautiful AP eyes painless and easy. My name is Alex Data. I've been a Web developer since 1995 on the rails trainer since 2010. My website is a l xx dot r o. So what are the student prerequisites for the scores? Some experience with the ruby on rails would be really useful. And if you have already made some a P I apse with rails, it will also help. What will we learn in this course at the end of the course will be able to add graphic UAL to a rails application so that it can talk to any front and be desktop, web or mobile. We learn how to enable drafty well in an existing rail. Sepp How to use graph graphic You will, which is a query simulator. How to ask for data using queries, how to change data using mutations. On in the last section, we learn how to protect data using authorization techniques. The course is structured in four sections. Introduction, rating data, changing data and finally protecting data using the triple A authentication authorization on access control. I've attached the code you see on screen to each section so you can download it if you want . On. The last three sections also come with homework, and I've left my own solutions for those exercises in case you want to compare. And with that, it's time to get started. See you in the next lecture. 3. What is GraphQL?: So what's the use case of graphic? You will. In what particular scenario does it fit in? Well, if you have these modern and fashionable scenario in which we have an AP application as the back end and several types of application on the front end, which can be death stop, they can be web of different kinds, and they can be mobile of different kinds. And they can be things, as in the Internet of things. If you think of this scenario, then there's always there's obviously a need of the front end to communicate the back end in a very consistent and easy to implement way. And that's where graph cool comes into play. Graft, you will, is a very, very, ah helpful tool. But what is it exactly? Well, graphical describes itself as acquiring language for your a p I. And we have here on the graphic your website. Some examples of how data is described. This isn't ah, written in Ruby, but it's pretty self explanatory of how a query is made, which is to say how to ask for what you want, and it shows that you get predictable results, which is very important. So in graphic. You will you ask for just what you need, and you get exactly that. You don't have to make calls to get a new object with tens dozens more fields, which you may or may not not need and are there just in case you just ask for exactly what you want and graft, you'll just send you that and you can ask for more resource in the same in the same request . You don't have to make subsequent requests for multiple objects. You can just ask for all of them in the same request, and that's very handy. And there's a type system, very powerful type system, which makes it possible for these teams. Just consult the schema documentation and see what's what. And it has very powerful developmental graphic. UAL, which we have dedicated a lecture for is a is a simulator for queries. And obviously there are things that we won't cover in this course, because this is just the basics course, like evolving the A P I without versions. In the next lecture, we're going to compare graft you well with rest, which is the other major standard when it comes to communication between front and back and and we'll see who wins 4. GraphQL versus REST: many of you will have come by this course with some experience with rest already. So for those of you, it might be interesting to know how graft your compares to rest. Now. The first thing that's important to know is that gradual was created by Facebook in 2012 and then it was open sourced three years later, and they made it because they were unhappy with rest. One thing that graft you well and rest share in common is that they both work over http, and they can also work over other protocols such as Web sockets graph. You'll differs from rest in that it only has one endpoint in the back end, whereas rest has multiple endpoints. You has one end point for each resource, and that is a situation which must always be synchronized with the front end. You have to keep touch with all the front and developers and tell them every time you're adding or removing or changing an endpoint. Whereas graphic you'll only has one end point. There's nothing to synchronize with graphic. You will you make fewer network requests because he can bunch many resources together, whereas if you use rest correctly, as the specifications suggest, you should make one request for resource. So if you need ah, 10 resource is you have to make 10 requests. And ah, over and under fetching, which is a concept describing how we often get less data than we need or more later than we need with rest. Because there's only so much that's been made available by the back. And this is avoided by graft, you'll because all the data is always available with crafty well, but you can just select the fields that you need at any particular point in time in any particular context. So you don't you don't ever have to ask for more than you actually need, and you always have access to everything that you need. So in light of this comparison, it might be said the graft US is a better fit than rest for many projects. But obviously the final decision is up to you. If, however, you decide Teoh see what Dracul is about and learn how to use it. You are welcome to join me in the next lecture 5. Requirements: So let's get started with some code in this lecture, we're going to create the rails up, and I'm going to use Ruby Mine for it. Remind is, ah, code editor. That has the advantage that everything happens in the same window, so I won't have to tuggle windows as much. I'm just going to creating your project and I'm going to call it Bookshelf and this is going to be a rail C P A project at the time I do this, The latest rails version is 5 to 0. I'm just going to go ahead and let Ruby mine create the empty rail step for me. Now the editor has conveniently opened a few files from including Jim File on. That's good, because I'm going to add the graphical Jim someplace in this file. Jim Graphic. You will, as soon as I save it. Really, Man will detect that there's, Ah, there's a new gym, add it in gym file and offer to install it. I can type bungling stolen a terminal window, or I can just or I can just install it from here. Good. Once that's done, there's only one thing left to do on this time I am going to do that from a terminal window just for them, sake of doing things differently. And that is to Ron a graphic You'll generator, which is called graph killing Store. So just type rails G graphic you will install right this Ah generator created a few file a few files in our application. They released it here, but we're going to look at them right here in the APP directory. We know have a directory called Graft You will, which on its turn contains mutations and types on then a file called schema. We're going to talk about all of these things in turn, in the course. For now, you're going to find a resource in this lecture with the application as it is up to this point with with the graphical gym installed on the new file generated, you can Donald this resource and use it if you haven't already created your own app using the steps I've outlined so far 6. Graphiql: in this lecture, we're going to put code aside for a moment and think about how are we going to test all the all the code that we're going to write, not having a front and up in front of our back and up? How are we going to try our queries and see that our graphic UL works well, There's an app for that on it's called Graphic UL graphic. You will, as it says here is a graphical user interface for editing and testing graphical queries and mutations. It can be downloaded, um, as an app on Mac or Lennox machines. And I suspect there's something equivalent for windows, too. On it looks like this. So with the with graphic, you well, we simply have to specify on endpoint Onda, then tribal query, Any graphical query I'm going to get We're going to test the the outcome of it. One end point that we can test again right now is ah, something called graph. Look on here. We already can use the Documentation Explorer. This is a very helpful tool that allows us to see the A p I that is exposed by the end point that we have entered and we can see here that there's one route type. We're going to see what route types are. Ah, little later on. It has one Get location. Field on DA. That returns something called a location data which has these fields. It doesn't really matter right now. We can really quickly try a query on a graphical query. Looks like this Get location. Graphical will helpfully I feel things in for me. Sometimes I'll just I'm just going to type Ah, a night be from Google and were well looked to get location registered. For that I pee in latitude and longitude. If you run this query, we helpfully get the answer in latitude and longitude. Agrees. So this is how graphic UAL works and will delve a lot deeper into how queries were made and what the response is look like in the coming lectures 7. The default query: and now it's time to return to the code in the previous lecture with you Stole crafty well on made sure that is working. Now it's time to take a closer look at what graphic UAL installed for us in our application . You'll notice that we have a new directory called Rock You'll on DA. It has to. The directories named Mutations and Types will also notice that there's an extra file called Bookshelf Schema, not RB. If remember, bookshelf is the name that we gave to our application. All that this file contains this time is two lines defining the mutation on the query, and we're going to explain what these lines mean a little later. Now let's just look into the file called query type inside types, and we'll notice that there's a field here, a test field, which came with graphic You'll a sort of default data that we can remove once we start working. No, we're going to leave it in place so that we can see it in the graphical Inspector in graphic. You will for that. First, we'll have to start our up on. I'll do that right here in Ruby mine with the app started. All we have to do is switch over to graphic will and use local host as as a nun. Point on, we already have access to the documentation of Ah, the little scheme on it we're exposing on. If we click on Query will notice that the test field is here and this is very, very handy. As I've said in the pros and cons selector, everything that we creating the application can be instantly seen by others in the documentation of the scheme are that we are exposing. This is an example of such a situation in which we can see the test field, the description that was left by the graft your developers in this case on example, Field added by the generator. And if we click on that, we can see that it has a type of string. If I were to test this, I would write a simple query, which must be prefixed on post fixed by curly brackets. As you've seen in the previous lecture, I'm just going to type test field Onda, which is already suggested for me. And if I run this query, I'm going to get the result Hello world which is exactly what the test field here should return according to the code. So this is an example of a query which comes packaged with graphic. You will, and we're going to learn how queries work, what mutations are, how to read data and how to change data using graphical in the coming section, which is reading data using graphic you'il.