Check out a free preview of the full Client-Side GraphQL with React, v2 course

The "Wrapping Up" Lesson is part of the full, Client-Side GraphQL with React, v2 course featured in this preview video. Here's what you'd learn in this lesson:

Scott wraps up the course by recommending building a UI where users can delete an issue using GraphQL mutations. He also mentions additional resources such as alternative libraries, code generation, and best practices in the GraphQL documentation.


Transcript from the "Wrapping Up" Lesson

>> Scott Moss: Cool, okay, so what I recommend doing is, especially if you are going to take the Serverside GraphQL course that talks about the back end of this, but you don't have to take it to do what I'm about to recommend. I do recommend going in here. And, for instance, if you notice, I have a, if you go to Apollo Server, if you go to mutations, you notice I have a deleteIssue mutation here.

It works. It's ready to go. Make a UI where you can delete an issue. Add a button on the issue, click it, have it delete, update the cache so it removes it from the page if it doesn't do it automatically, and start that. That is, you don't have to do anything on a server side to make that work.

The query's already done, the mutation's already done, database query's already done. You just gotta write the UI for it in interaction. So hook that up, try that. And then if you do the server-side stuff, there's gonna [LAUGH] be a lot of stuff you could do, so much stuff.

But yeah, I highly recommend doing that, if you wanna go a little further and try that out. So other than that, most of the other resources are usually, there are a lot of more frontend resources, but they're mostly just alternatives to what Oracle is. I talked about code gen, if you wanna check that out, if you wanna generate TypeScript types for your queries, you could do that.

There is a lot more about querying that I did not talk about because I myself almost never use them in production. So I just don't teach things that I don't use. But I heard they're pretty useful, so I highly recommend going to the GraphQL documentation website, and they have a best practice thing in here, that's pretty good.

I highly recommend checking that out. But they have different things in here where they talk about something called fragments. That's quite useful. I don't actually use fragments. Here they are, fragments are like, they're like little pieces of a query that you can share with other queries, so you don't have to rewrite them every time.

So if you have multiple queries that always get this piece of a user and you don't have to rewrite that every single time, you can make that a fragment. And then you can share those fragments everywhere. But, I don't know, you can also just share a string around, too, I don't know.

[LAUGH] There's a lot of stuff. There's also unions and things like that, but that actually requires a lot of server-side stuff. So I didn't get to it. I couldn't find a good use case to introduce that to you guys. But on the back end, we could probably do it.

Directives are really cool, also pretty advanced. You can add directives, which are custom functions that run on the AST of the schema. It's all GraphQL back end stuff, you have to actually write the logic for this directive on the back end, even though you're querying it on your client, but that's the syntax for it.

And there are tons of libraries, people make lodash directives, so you can do all different types of mapping and, just all types of crazy stuff in a GraphQL schema, so it gets pretty cool. And then, yeah, this is unions and things like that. So we don't have to talk about that.

But, yeah, I highly recommend just looking at this stuff. It's just a little more than we talked about, but again, I almost never use any of those things in production, so I didn't feel the need of talking about it. But like I said, a lot of people swear by these things.

Other than that, I would say just build something in it. There are tons of open APIs, like the Star Wars API that I showed you, if you just Google Open GraphQL APIs, there's tons of them. Go find one, connect to it, go build a frontend with it, or honestly, just pull it open in here.

Add the URL into Apollo Client or Apollo Studio and explore that API, try the queries, if they have mutations, try the mutations, and just get familiar with that syntax. You don't even need to make an app just to get more practice with it because I think when you use GraphQL on the client side, it clearly feels better.

Making it is where the pain is. So you can skip all the pain and just play with something that's public. So that's what I recommend. But other than that, definitely recommend taking the server-side course that we're gonna be teaching. It covers the server-side version of this. It's gonna go way more in depth to the real value of GraphQL.

It's gonna be backend heavy database stuff. Basically, how do you resolve a graph query? How do you enable this experience that we use today? It's quite different than anything you've ever done. So I do recommend taking that course to really bring your knowledge full circle. And, yeah, that's it.

Thanks for coming to the course, folks.
>> Speaker 2: [APPLAUSE]

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now