1 00:00:02,000 --> 00:00:04,000 The problem here is that, 2 00:00:04,000 --> 00:00:06,000 on the single meetup page, 3 00:00:06,000 --> 00:00:11,000 we do specify which meetup pages should be pre-generated, 4 00:00:11,000 --> 00:00:16,000 and we only set this at build time and never thereafter. 5 00:00:16,000 --> 00:00:19,000 And since we set fallback to false, 6 00:00:19,000 --> 00:00:23,000 we also ensure that any requests to meetups, 7 00:00:23,000 --> 00:00:26,000 for which no page was pre-generated before, 8 00:00:26,000 --> 00:00:28,000 will fail. 9 00:00:28,000 --> 00:00:31,000 Now that worked as long as we didn't add a new meetup, 10 00:00:31,000 --> 00:00:33,000 and it worked during development, 11 00:00:33,000 --> 00:00:36,000 because there the getStaticPaths function ran 12 00:00:36,000 --> 00:00:38,000 for every incoming request, 13 00:00:38,000 --> 00:00:40,000 but it now fails after deployment. 14 00:00:41,000 --> 00:00:45,000 Now fixing it is quite simple though, thankfully. 15 00:00:45,000 --> 00:00:50,000 We can set fallback to true, or even better, to 'blocking'. 16 00:00:51,000 --> 00:00:54,000 When you set fallback to true or to blocking, 17 00:00:54,000 --> 00:00:58,000 you're telling NextJS that the list of paths 18 00:00:58,000 --> 00:01:02,000 which you're specifying here, might not be exhaustive, 19 00:01:02,000 --> 00:01:05,000 there might be more valid pages. 20 00:01:05,000 --> 00:01:10,000 And, therefore, when fallback is set to true or to blocking, 21 00:01:10,000 --> 00:01:15,000 NextJS will not respond with a 404 page 22 00:01:15,000 --> 00:01:18,000 if it can't find the page immediately. 23 00:01:18,000 --> 00:01:22,000 Instead with fallback set to true or blocking, 24 00:01:22,000 --> 00:01:25,000 it will then generate that page on demand, 25 00:01:25,000 --> 00:01:26,000 and thereafter cache it, 26 00:01:26,000 --> 00:01:30,000 so it will pre-generate it when needed. 27 00:01:30,000 --> 00:01:33,000 Now the difference between true and blocking then is that, 28 00:01:33,000 --> 00:01:38,000 with true, it would immediately return an empty page, 29 00:01:38,000 --> 00:01:42,000 and then pull down the dynamically generated content 30 00:01:42,000 --> 00:01:43,000 once that's done. 31 00:01:43,000 --> 00:01:46,000 So you need to handle that case 32 00:01:46,000 --> 00:01:49,000 that the page does not have the data yet. 33 00:01:49,000 --> 00:01:52,000 With blocking, the user will not see anything until 34 00:01:52,000 --> 00:01:54,000 the page was pre-generated, 35 00:01:54,000 --> 00:01:57,000 and the finished page will be served. 36 00:01:57,000 --> 00:01:59,000 And that's the approach I will use here, 37 00:01:59,000 --> 00:02:04,000 since it doesn't require any other extra work from our side. 38 00:02:04,000 --> 00:02:06,000 So if we change fallback to blocking, 39 00:02:06,000 --> 00:02:09,000 we'll not face this problem anymore. 40 00:02:09,000 --> 00:02:11,000 Now we just need to redeploy this. 41 00:02:11,000 --> 00:02:14,000 And for this, all we have to do is create 42 00:02:14,000 --> 00:02:18,000 a new code snapshot with git add, 43 00:02:18,000 --> 00:02:19,000 and then with git commit, 44 00:02:19,000 --> 00:02:24,000 where we say, "fixed fallback", or something like this, 45 00:02:25,000 --> 00:02:28,000 and then simply push our branch again, 46 00:02:28,000 --> 00:02:32,000 push our repository back onto GitHub. 47 00:02:32,000 --> 00:02:37,000 And the great thing is that NextJS will actually watch 48 00:02:37,000 --> 00:02:40,000 this main branch to which we pushed, 49 00:02:40,000 --> 00:02:42,000 and whenever it detects a change there, 50 00:02:42,000 --> 00:02:45,000 it will automatically start building and redeploying. 51 00:02:45,000 --> 00:02:48,000 As you can see here, it's building already again. 52 00:02:48,000 --> 00:02:50,000 So that's very convenient. 53 00:02:50,000 --> 00:02:53,000 If you want to update your page and redeploy, 54 00:02:53,000 --> 00:02:56,000 all you have to do is create a new commit and push it 55 00:02:56,000 --> 00:02:59,000 to your connected GitHub repository, 56 00:03:00,000 --> 00:03:04,000 and that will then automatically trigger a redeployment. 57 00:03:04,000 --> 00:03:05,000 And whilst it's redeploying, 58 00:03:05,000 --> 00:03:08,000 your old page will stay up and running. 59 00:03:08,000 --> 00:03:11,000 But once it's done, the new page will take over, 60 00:03:11,000 --> 00:03:14,000 and hence, now this meetup exists here. 61 00:03:14,000 --> 00:03:18,000 And if we add another meetup here 62 00:03:18,000 --> 00:03:23,000 with this image, and our test address, and some test text. 63 00:03:24,000 --> 00:03:29,000 If we do this, now our change should also be in effect. 64 00:03:29,000 --> 00:03:32,000 And if we now reload the starting page 65 00:03:32,000 --> 00:03:34,000 a couple of times to revalidate it, 66 00:03:34,000 --> 00:03:36,000 if we now visit this meetup, 67 00:03:36,000 --> 00:03:40,000 it's created on the fly and does all the works. 68 00:03:40,000 --> 00:03:43,000 And that is also something, which I wanted to show you, 69 00:03:43,000 --> 00:03:46,000 especially combined with that redeployment feature, 70 00:03:46,000 --> 00:03:49,000 which is also something you should know. 71 00:03:49,000 --> 00:03:51,000 Now, there is, of course, more you can do. 72 00:03:51,000 --> 00:03:53,000 You can connect a custom domain here, 73 00:03:53,000 --> 00:03:56,000 and you can also configure more in your project. 74 00:03:56,000 --> 00:03:59,000 There are more features, which you can add as well, 75 00:03:59,000 --> 00:04:01,000 but I mentioned this before already. 76 00:04:01,000 --> 00:04:03,000 There are simply more things, which you could add. 77 00:04:03,000 --> 00:04:06,000 This tutorial, however, had the goal of giving you 78 00:04:06,000 --> 00:04:09,000 an overview of the most important features and, 79 00:04:09,000 --> 00:04:11,000 therefore, we're now finished with that.