Introduction to Next.js Introduction

Transcript from the "Introduction" Lesson

[00:00:00]
>> Hey everybody, thanks for tuning in, and welcome to introduction to Next.js with me, your instructor, Scott Moss in Frontend Masters. So, this course has been highly requested in Frontend Masters, and I feel really honored to be the one to teach it. And it means a lot to me, because I have so much love for this framework, and I have so much love for this company, Frontend Masters.

[00:00:21] But as far as when it comes the Next.js, I mean, I use it in a lot of ways, whether it's for building out blogs and static websites, or even full blown full stack applications, even API's. I also do tons of integration with it at the company that I'm at, and we work closely with the team at Vercel, who are the creators of Next.js.

[00:00:42] So I really love this framework from all angles, and I know there are so many people that are qualified to teach. So, I feel really honored to be the one to deliver this framework to you, and just express my love for this framework as you'll see and hear a lot from me.

[00:00:58] So, let's just get started. Let me bring my mouse back over here. So, this course is gonna be a little different, compared to how I would normally do my courses. Whereas before I might have a repo with some text and some branches, and you go through the text and you get them to pass and you move on, this one is gonna be more of a follow along type format.

[00:01:18] But don't worry, no pressure, you're not forced to fall on, you're encouraged, but there are a ton of resources are gonna keep you. So the first thing is this website here. So if you navigate to hendrix.github.io, which is my GitHub Pages URL, my username is Hendrix Sir after my son Hendrix, and the URL is Next.js course.

[00:01:42] Fun fact, if you just go to the route, you'll actually see this website, which is the first open source library that I ever made six years ago when I was learning to code. It was an animation library for Angular, and it ended up getting 10,000 stars or something like that.

[00:01:57] And this is actually the open source library that introduced me into the Angular team, into the open source world, and allowed me to speak at conferences and stuff like that. Literally, this is the first thing that I ever made. And I was taken back when I went to this website, because I haven't seen it in so long.

[00:02:12] And the fact that it still runs on Angular version, I don't know, like one dot two or something like that, I don't know, it's still pretty impressive. So, I was kinda taken back by that. But here we go to the actual course. So, yeah, if we go to here, I'll be using this as a reference to everything that we do.

[00:02:31] So, I'll try to stay on topic of what's actually here. And you'll see there's gonna be a lot of things in here to help you stay up to speed as well, you can just, there's gonna be tons of things for you to copy and paste, and stuff like that.

[00:02:43] So, what we'll do is, we'll just jump right in and go into these table of contents, and we'll see all the other resources we need to get started. So I'm just gonna start with this introduction here. Basically, so, this course is gonna be an introduction in Next.js, and we're gonna talk about all the things we're gonna cover, but we won't be going into really advanced things.

[00:03:03] At least not consistently, I will be talking about advanced things because I just can't help it, but the curriculum isn't designed to go that deep. So this is gonna be a really nice introduction from my perspective, on how I think someone would benefit from learning Next.js. And of course, there's other guides and tutorials, and even their documentation.

[00:03:23] And Next.js website is actually really good, they have this follow along thing, where you get points and scores for going through the documentation, and you get a quiz and stuff like that. It's actually really good. So there are tons of really good resources out there, this is just my twist on it, my flavor.

[00:03:39] So, who are you? Basically, you know some react, if you know some react then this course is perfect for you. But it's also perfect for anyone who maybe doesn't really know React, but they do know web development, maybe they've come from another framework. I think you're gonna be fine here.

[00:03:56] I'm doing my best to stay on topic with Next.js specifics, and not so much of the things that are required by Next.js, which is React. So I won't be talking too much about React in general, I'll just be focusing on the Next.js stuff. If you wanna learn React, Frontend Masters has tons of courses on React.

[00:04:15] I think Brian Hold actually just taught one recently, so you can check out his, I wanna say it's V5 intro, V5 if am correct Mark, is it V5?
>> Yeah.
>> So check that one out, it's really good. There's tons of others on there as well. But if you are a React pro and you're just like, yeah, I've been doing React forever, I'm on the React core team.

[00:04:34] Okay, this course is still for you as well, because again, this is just my spin, my perspective on what Next.js is, and I have no doubt that you can read documentation and go from there. This is just how I feel would, this is how I would have liked to learn Next.js.

[00:04:48] And I just wanted to share my path towards that. And this course is also gonna cover a decent amount of JAMstack practices, and the reason I put this series is, a lot of people ask me, JAMstack, JAMstack, what about JAMstack? And I think I just wanna talk a little bit about that, because as you'll see the company that I'm at actually just, is JAMstack, that's all we do.

[00:05:10] So I feel like I know a lot about that, and that's pretty much all I do every day. And how to use JAMstack with Next.js might not be obvious, although new things are coming out that make it obvious. So, I'll talk a little bit about that too, but that stuff is also kinda advanced right now, but we'll get into it.

[00:05:27] And a lot of the learnings that you'll see, like said are specific to Next.js, but they're also very generic things that you can carry along to other frameworks as well. So, what can you expect? The class's goal is basically to walk away with the ability to create an app using Next.js, and have a great foundation to learn more advanced topics.

[00:05:47] That's basically it. So I feel like after you take this course, you should be able to make the Next.js app from start to finish, production ready, because it's actually free with Next.js. And not have to worry about what's going on, and you'll see how in a minute. And a lot of that isn't going to do with the fact that I think my curriculum is good, is actually because the framework is just that good, that it kinda gives you that for free.

[00:06:10] This is an open source website. So, if you see some typos, which I'm famous for typos, but I did use Grammarly this time, so maybe there aren't that many typos. But if you do, you can make a pull request and help me fix them. So, thank you. A little bit about myself.

[00:06:28] This is me trying to get super sane, because I just love dragon, it's one of my favorite enemies, I watch it all the time. Yeah my name is Scott Moss, I'm the CEO and co-founder of a company called Tipe. We are a headless CMS, if you don't know what that is, you can just think of word press without a page builder.

[00:06:48] So we just, we let you design a schema, any shape, any form, any way that you want. And we allow you and your team to create content based off that schema, and then we just delivered to you over an API to any app, any platform, anywhere you want.

[00:07:02] Anything that has internet connection, we can send content to it. And at the end of the day, that's basically what we are, and we've been doing this for a little over two years now, so it's been a blast. Outside of the code, I'm in so a lot of things, specifically fitness, especially basketball.

[00:07:21] Recently I picked up hot yoga because I'm not flexible, and I'm trying to get flexible, and hot yoga is actually the hardest thing I've ever done in my life, but I love it. So I'm doing a lot of that. I do like calisthenics, I don't really lift weights anymore, something like a lot of body weight stuff.

[00:07:34] I'm also into building gaming computers, it's kind of my thing now. Lately, I've been into building the most powerful computer I can in the smallest form factor, without sacrificing things like thermal quality and stuff like that. But I also play games. So if you play first person shooters like Overwatch, Call of Duty, I always play with people, I even just tweet out sometimes, like yo who wants to play and I literally just play with anyone.

[00:07:59] So, if you wanna go a couple rounds, let me know down to play. And then if you also know me, you know that I'm really into fashion, specifically collecting sneakers. Haven't got any lately with the pandemic and stuff, because I mean, I don't even go anywhere. I haven't actually put on real shoes in quite some time.

[00:08:16] So I still collect sneakers, I'm still watching, I'm still looking. So, we'll see how that goes. Currently I'm living in Sacramento, California with my family. And before that, I was living in San Francisco, Oakland, LA, and San Diego, but I'm not from California. I'm originally from Atlanta, but joining the military, the Navy brought me out to California a little over ten years ago, and I've been here ever since.

[00:08:43] So, I don't think I'll leave this place, I kinda love it. And yeah, that's basically a lot about me. [LAUGH] And special thanks to Frontend Masters. Like I said, this wouldn't be possible without them. If you've never met the team or interact with the team of Frontend Masters, I'll just tell you this.

[00:08:59] They're the best team out there. Just, I mean, it's more than a partnership, they really are family to me. I hang out with these folks all the time, we play games together, they help me with all different types of things. It's just really a great environment with them and it's always fun.

[00:09:16] So, I just feel honored to be part of the team, and to be able to offer any type of value like teaching this course. So I'm super thankful and big thanks for them for getting all this set up. Look at this studio here in my house. So yeah, it's really awesome.

[00:09:32] Thanks Frontend Masters, you guys are awesome. And let's head over to the course overview. Also I realized I forgot to mention, if you prefer a lighting, if you haven't clicked this yet, you can click that. You can get a nice lightning if you prefer that way. I like to keep things dark, so I'm gonna go back to my dark theme here.