1 00:00:02,000 --> 00:00:06,000 Now that's it for the very basics of NextJS, 2 00:00:06,000 --> 00:00:09,000 and especially the file-based routing system. 3 00:00:09,000 --> 00:00:13,000 How you can create multiple pages, including dynamic pages, 4 00:00:13,000 --> 00:00:14,000 and navigate around. 5 00:00:14,000 --> 00:00:17,000 Now, NextJS also has a lot to offer 6 00:00:17,000 --> 00:00:20,000 when it comes to pre-rendering these pages 7 00:00:20,000 --> 00:00:23,000 and when it comes to fetching data for pages. 8 00:00:23,000 --> 00:00:26,000 And that's therefore, the next content block 9 00:00:26,000 --> 00:00:29,000 we're going to dive in, in this course section. 10 00:00:29,000 --> 00:00:33,000 But for that, we're going to leave this dummy news project 11 00:00:33,000 --> 00:00:36,000 which was only there for learning the core basics 12 00:00:36,000 --> 00:00:38,000 about file-based routing, 13 00:00:38,000 --> 00:00:42,000 and we're going to switch to a different project instead. 14 00:00:42,000 --> 00:00:44,000 And for this, I've got a brand new project, 15 00:00:44,000 --> 00:00:47,000 and this project is about the same idea. 16 00:00:47,000 --> 00:00:50,000 It's the same kind of project as we had 17 00:00:50,000 --> 00:00:53,000 in our React crash course tutorial, 18 00:00:53,000 --> 00:00:56,000 but you don't need to go through that module first. 19 00:00:56,000 --> 00:00:59,000 Instead attach to find a starting project, 20 00:00:59,000 --> 00:01:02,000 which I did create with that 21 00:01:02,000 --> 00:01:05,000 NPX create next app command again, 22 00:01:05,000 --> 00:01:07,000 just a bit cleaned up, 23 00:01:07,000 --> 00:01:11,000 and with some components which are pre-built for you 24 00:01:11,000 --> 00:01:15,000 simply because these are standard React components, 25 00:01:15,000 --> 00:01:18,000 nothing NextJS-specific in there yet. 26 00:01:18,000 --> 00:01:21,000 We're going to work on them a bit throughout this course 27 00:01:21,000 --> 00:01:24,000 but at the moment they're just basic React components, 28 00:01:24,000 --> 00:01:26,000 and since you already know React, 29 00:01:26,000 --> 00:01:28,000 I don't want to bore you by again, 30 00:01:28,000 --> 00:01:32,000 writing such basic react components. 31 00:01:32,000 --> 00:01:35,000 Instead here, we want to focus on the Next features 32 00:01:35,000 --> 00:01:38,000 and the many cool features NextJS adds, 33 00:01:38,000 --> 00:01:41,000 and hence, this starting project already 34 00:01:41,000 --> 00:01:44,000 has a couple of components which we will use. 35 00:01:44,000 --> 00:01:47,000 On the other hand, the pages folder is empty 36 00:01:47,000 --> 00:01:51,000 so that we can again, practice this file-based routing 37 00:01:51,000 --> 00:01:54,000 and add some pages for this project, 38 00:01:54,000 --> 00:01:59,000 and the styles folder also just has some basic styles here. 39 00:01:59,000 --> 00:02:02,000 And therefore we're basically starting from scratch here 40 00:02:02,000 --> 00:02:05,000 with a brand new NextJS project, 41 00:02:05,000 --> 00:02:09,000 and we're going to build this meetup application here, 42 00:02:09,000 --> 00:02:12,000 which again, is kind of similar to what we built 43 00:02:12,000 --> 00:02:15,000 in this React tutorial already. 44 00:02:15,000 --> 00:02:18,000 But there also are some differences. 45 00:02:18,000 --> 00:02:20,000 The application we're going to build 46 00:02:20,000 --> 00:02:23,000 is all about having some meetups. 47 00:02:23,000 --> 00:02:27,000 And we got a page that allows us to create new meetups, 48 00:02:27,000 --> 00:02:30,000 and that those meetups will then be sent to some backend 49 00:02:30,000 --> 00:02:33,000 and will be stored in some database. 50 00:02:33,000 --> 00:02:36,000 That is logic we're going to add throughout this course. 51 00:02:36,000 --> 00:02:39,000 And we then have a page where we fetch 52 00:02:39,000 --> 00:02:41,000 and display a list of meetups. 53 00:02:41,000 --> 00:02:43,000 And that's of course also something 54 00:02:43,000 --> 00:02:45,000 we're going to build together. 55 00:02:45,000 --> 00:02:49,000 And we then can also visit the detail page of a given meetup 56 00:02:49,000 --> 00:02:52,000 to fetch and to display the details 57 00:02:52,000 --> 00:02:54,000 for that specific meetup. 58 00:02:54,000 --> 00:02:56,000 And that will be a dynamic page 59 00:02:56,000 --> 00:03:00,000 where different meetup identifiers are encoded into URL. 60 00:03:01,000 --> 00:03:03,000 And therefore, we're going to practice 61 00:03:03,000 --> 00:03:08,000 what we briefly touched on already, file-based routing, 62 00:03:08,000 --> 00:03:10,000 and we're going to add a bunch of new features 63 00:03:10,000 --> 00:03:14,000 where NextJS helps us relate it to data fetching 64 00:03:14,000 --> 00:03:19,000 but also related to blending back-end and front-end code 65 00:03:19,000 --> 00:03:22,000 and sending requests to an API 66 00:03:22,000 --> 00:03:26,000 which we will build together in this next project. 67 00:03:26,000 --> 00:03:29,000 And therefore, we've got plenty of exciting topics to cover. 68 00:03:29,000 --> 00:03:30,000 Let's dive in.