Check out a free preview of the full Complete Intro to React, v8 course

The "Wrapping Up" Lesson is part of the full, Complete Intro to React, v8 course featured in this preview video. Here's what you'd learn in this lesson:

Brian wraps up the course by providing some suggestions on where to go for continued learning, improvements that could be added to the application for additional practice, and a real pet adoption API to implement.

Preview
Close

Transcript from the "Wrapping Up" Lesson

[00:00:00]
>> This concludes our complete intro to React. You now know probably 85% of everything that React can do. And I'm gonna say you know 99.99% of what is useful about React. Everything that I didn't talk about in React so far is really very edge case. And frequently they are very much for Facebook's use case and not your use case.

[00:00:25]
I guess it's something to keep in mind with React just in general, React is made by Facebook, it's made by Facebook for facebook.com. Most of us don't have Facebook problems, right? Even when I worked at Netflix, Giant Application, lots of App State, we still didn't have Facebook's problems.

[00:00:43]
Facebook has very peculiar and interesting problems and React solve some of these very elegantly. So for some of us, some of these transitions and stuff that I didn't talk about, it's gonna be very useful for them. But for stuff like transitions I've never personally had to put them in an application, right?

[00:01:01]
So, we do talk about that stuff in the intermediate React v5. So if you've finished watching this course and you're here, I invite you to watch intermediate v5. There's lots of goodness and interesting things in there, so that when you do need to use those kinds of tools.

[00:01:17]
We talked about it and you'll know exactly what you need. I'm just gonna give you some suggestions of where to go now with your learning. The first one is obviously take the intermediate course, I wrote that as a companion to this one. We actually take this application and we further build on top of it.

[00:01:33]
We put things like TypeScript in there, we put Redux. I talked about transitions, I talked about some of the hooks that we didn't use, lots of goodness things. Talked about testing, tailwind, other things like that. One of the things that we didn't do here is there's more results, right?

[00:01:51]
So if you look at the results here in your network tab, you can see that this is actually giving a response. It gives you zero through nine, but you can see that there's 63 results here. So one of the things you could do here is go through and paginate results.

[00:02:06]
So another thing you could do is you could use a real API, previous versions of course actually used to teach with the actual real Petfinder API. There's actually people that adopted Pets because of this course, which I'm pretty happy about. But they kind of asked me to stop [LAUGH] because there was a lot of people generating keys for this and it's heavy on their API.

[00:02:26]
But you can go in here and you can hook up our application to the real Petfinder API, and you can see real Pets which I think is pretty rewarding. Totally free, they're very happy about it. They even have a JavaScript STK here that shouldn't go in use. So go ahead and give that a shot, I think that's really cool.

[00:02:49]
This is more like an example, responses they have a lot of stuff in here. They have names, they have lots of images. They have like links to actually go and really adopt the Pet. Something you can do now as you can deploy your code, I left some places where you can deploy that Netlify oversell as your static web apps Firebase or Amplify.

[00:03:11]
All very [INAUDIBLE] places fly, render just a bunch of them. We didn't do themes, so maybe go make a dark mode, right? And you could use context to make a dark mode, that'd be another good reason. Add a nav bar, I mean this is pretty bare bones navigation.

[00:03:29]
That'd be another good way to kinda just flex your React skills. We used Vite, but you might try something like parcel, or snow pack, or maybe use ES build directly, as opposed to V is using ES build for you. Or something else If you do, let me know.

[00:03:46]
Share me either a link to a code Pen or a GitHub report, I would love to see what you're doing. Feel free to tweet at me. Thanks everyone, thanks for sticking with me. And hopefully, you enjoyed the course.
>> [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