1
00:00:01,290 --> 00:00:05,360
We've now got Next j ust running inside of our communities cluster which is fantastic.

2
00:00:05,370 --> 00:00:11,160
However I want you to be aware right away that sometimes Next j s can be a little bit finicky.

3
00:00:11,970 --> 00:00:14,000
Let's go back over to our Ed really quickly.

4
00:00:14,060 --> 00:00:17,690
I'm gonna find a banana dart J S file inside of our pages folder.

5
00:00:17,850 --> 00:00:23,100
I'm going to change the string inside of here to have a banana to whatever just a very small change.

6
00:00:23,700 --> 00:00:26,430
I'm then going to save this and put back over my browser.

7
00:00:26,430 --> 00:00:32,070
You'll notice as soon as I save the file I see that change reflected inside the browser right away.

8
00:00:32,160 --> 00:00:35,330
Now you're going to see I can just about guarantee it either.

9
00:00:35,430 --> 00:00:40,560
You might not have seen that update right away or alternatively at some point time in the future you

10
00:00:40,560 --> 00:00:45,190
might make a change to some code and not see it reflected in the browser as well.

11
00:00:45,300 --> 00:00:51,030
So next to us unfortunately is a little bit finicky with file change detection when it is running inside

12
00:00:51,030 --> 00:00:52,890
of a docker container.

13
00:00:52,890 --> 00:00:56,700
So we're going to put in a little fix right now just proactively.

14
00:00:56,700 --> 00:01:01,470
Even if you saw this thing change automatically when you save the file I still recommend you do this

15
00:01:01,710 --> 00:01:07,590
because I personally have seen next year not always reflect file updates even if it sometimes appears

16
00:01:07,590 --> 00:01:09,130
to work.

17
00:01:09,140 --> 00:01:10,450
So here's what we're gonna do.

18
00:01:10,490 --> 00:01:11,890
Back inside my client directory.

19
00:01:11,950 --> 00:01:15,880
I'm gonna make a new file called next dot config Dot.

20
00:01:15,940 --> 00:01:23,320
J.S. and then inside of here we're going to write out modules that exports we're gonna set that equal

21
00:01:23,320 --> 00:01:30,610
to an object inside of here we're going to put in web pack Dev middleware and please double check your

22
00:01:30,610 --> 00:01:37,130
spelling and capitalization on this we're then going to assign this an arrow function that's going to

23
00:01:37,130 --> 00:01:46,020
take in some config variable that inside will do config that watch options dot Paul equals three hundred

24
00:01:46,660 --> 00:01:50,800
and then we will return config.

25
00:01:50,900 --> 00:01:53,310
There we go.

26
00:01:53,320 --> 00:01:57,010
So what this file does this file is loaded up automatically.

27
00:01:57,010 --> 00:01:58,720
Where is it.

28
00:01:58,720 --> 00:01:59,440
There it is right there.

29
00:01:59,440 --> 00:02:04,980
This file is load of automatically by next J us whenever our project starts up next is then going to

30
00:02:04,980 --> 00:02:10,140
attempt to read this thing in it's going to take a look at this Web hack Dev middleware function and

31
00:02:10,140 --> 00:02:15,320
it's going to call it with some middle path configuration that it has created by default.

32
00:02:15,330 --> 00:02:20,130
We are changing a single option on there to tell Westpac that rather than trying to watch for a file

33
00:02:20,130 --> 00:02:25,500
changes in some automated fashion instead pull all the different files inside of a project directory

34
00:02:25,710 --> 00:02:28,180
automatically at once every 300 milliseconds.

35
00:02:28,230 --> 00:02:33,060
Traditionally this change right here will fix this issue with file change detection when running inside

36
00:02:33,060 --> 00:02:34,290
of a docker container.

37
00:02:34,350 --> 00:02:41,010
But as I mentioned I have still notice that it is not 100 percent foolproof so if you ever start to

38
00:02:41,010 --> 00:02:45,980
change any code and you feel as though that change is not being reflected on the screen inside the browser

39
00:02:46,400 --> 00:02:49,360
we're going to want to try to somehow restart scaffold.

40
00:02:49,370 --> 00:02:51,510
We'll take a look at how that's going to work eventually.

41
00:02:51,520 --> 00:02:56,190
Right now let's just make sure that this change gets reflected inside of our running pod.

42
00:02:56,190 --> 00:03:01,640
Now remember because this file is ending with a dot J.S. scaffold should sync this file into our running

43
00:03:01,640 --> 00:03:02,730
pod automatically.

44
00:03:02,780 --> 00:03:08,900
However next does not automatically restart itself whenever we add this file in or make changes to it.

45
00:03:08,900 --> 00:03:11,540
Unlike changes that are made to react files.

46
00:03:11,680 --> 00:03:16,930
So we need to somehow it just get our plot to restart itself to do so.

47
00:03:17,030 --> 00:03:19,110
We're gonna go back over to our terminal.

48
00:03:19,240 --> 00:03:24,520
We're going to list out all of our running pods with QCT I'll get pods and then we're going to manually

49
00:03:24,520 --> 00:03:27,930
kill the client one right here by killing this pod.

50
00:03:27,970 --> 00:03:32,860
Our deployment will automatically create a new pod and that new pod will have this updated config file

51
00:03:32,890 --> 00:03:33,730
inside of it.

52
00:03:33,730 --> 00:03:39,140
And next J.S. should read this config file it when it first starts up so I'm gonna go back over and

53
00:03:39,140 --> 00:03:47,780
do a cube Seitel delete pod and then paste in the name of our client pod so I'll see that is deleted

54
00:03:48,830 --> 00:03:54,180
I could do another get pods and I'll see that the pod has already been recreated.

55
00:03:54,290 --> 00:04:00,640
Just five seconds ago so now this new pod should be running the updated config inside of it.

56
00:04:00,640 --> 00:04:04,900
Now again if at any point in time you feel as though you have made a change that is not being reflected

57
00:04:04,900 --> 00:04:08,060
inside the browser go through the same steps you see right here.

58
00:04:08,410 --> 00:04:09,790
List out all your pods.

59
00:04:09,790 --> 00:04:16,240
Delete the current client pod that pod will be recreated and the changes a 100 percent should be reflected

60
00:04:16,240 --> 00:04:17,470
inside there.

61
00:04:17,500 --> 00:04:17,920
OK.

62
00:04:17,950 --> 00:04:22,810
So again just a quick little tip something that you're probably going to run into at some point time.

63
00:04:22,840 --> 00:04:25,960
Let's take a pause right here and continue with our client in just a moment.