1
00:00:00,720 --> 00:00:04,770
All right, my friends, as I mentioned, all this redux stuff is going to be just about identical to

2
00:00:04,770 --> 00:00:06,660
what we went through earlier on inside the course.

3
00:00:07,050 --> 00:00:11,550
So on this video, in the next couple, as we do some initial setup, we're going to pretty much speed

4
00:00:11,550 --> 00:00:12,450
through all this stuff.

5
00:00:12,480 --> 00:00:14,880
We're going to write out a lot of code, create a lot of different files.

6
00:00:15,150 --> 00:00:19,710
And if you get confused at any point, you can always go back to those earlier videos on Redox and just

7
00:00:19,710 --> 00:00:22,800
do a quick review on why we are taking the approach that we are taking.

8
00:00:23,430 --> 00:00:25,200
So let's get to it to get started.

9
00:00:25,230 --> 00:00:30,210
I'm going to first begin by creating inside my Sarsae folder a new directory called State.

10
00:00:30,810 --> 00:00:34,350
Just as I said previously, if you don't like the name of state, you're totally fine.

11
00:00:34,350 --> 00:00:36,030
You could rename this to whatever you want it to be.

12
00:00:36,720 --> 00:00:40,530
Then inside of here, we will immediately create a couple of different files and folders.

13
00:00:40,890 --> 00:00:43,710
I will immediately create a new file called Index Dots.

14
00:00:44,430 --> 00:00:47,100
I will create a new file called Staats.

15
00:00:47,790 --> 00:00:51,240
I will create a new folder called Action Creators.

16
00:00:52,720 --> 00:01:00,970
A new folder called Action Types, another folder called Actions, and one more folder called Reducers.

17
00:01:03,230 --> 00:01:09,940
OK, good place to get started inside of reducers will then create a new file called Index Dots.

18
00:01:11,450 --> 00:01:16,790
I'll create another file of cells, reducer dots.

19
00:01:18,730 --> 00:01:23,380
Another file of bundles, reducers, it's.

20
00:01:26,940 --> 00:01:32,370
Then inside of our three different action folders, we'll make an index dots file as well, so inside

21
00:01:32,370 --> 00:01:39,240
of action crater's index dots, inside of action types, index dots and guess what's going inside of

22
00:01:39,240 --> 00:01:39,780
actions?

23
00:01:39,810 --> 00:01:40,710
Yes, that's right.

24
00:01:40,710 --> 00:01:41,850
Index dots.

25
00:01:43,240 --> 00:01:48,640
OK, a lot of different files have now been created, if you get an error at any point inside of your

26
00:01:48,640 --> 00:01:54,910
browser that says something about some kind of isolated module or a flag or an isolated modules, you

27
00:01:54,910 --> 00:01:58,060
cannot just keep refreshing your server or anything like that to get it to go away.

28
00:01:58,220 --> 00:02:02,380
If you see any air starting to appear in the next couple of videos, it is because we have a couple

29
00:02:02,380 --> 00:02:07,060
of different types of files that are completely empty and create react up really wants to see content

30
00:02:07,060 --> 00:02:08,710
inside of all these different files.

31
00:02:09,039 --> 00:02:13,360
If you ever see an error message around that, you have to restart your server.

32
00:02:13,510 --> 00:02:16,990
You can't just keep trying to add stuff into files and then try refreshing.

33
00:02:17,140 --> 00:02:19,000
You have to restart the server entirely.

34
00:02:19,180 --> 00:02:23,890
And again, you only have to do this if you start seeing some error messages around something like isolated

35
00:02:23,890 --> 00:02:28,690
modules or something like that or something around expected something to export a value or something

36
00:02:28,690 --> 00:02:29,110
like that.

37
00:02:29,350 --> 00:02:33,170
So just a quick heads up that if you see that er you got to restart your development server.

38
00:02:33,940 --> 00:02:34,300
All right.

39
00:02:34,300 --> 00:02:35,760
So now we've got a lot of different files.

40
00:02:36,040 --> 00:02:37,830
Let's first begin right away.

41
00:02:38,060 --> 00:02:39,100
I think that will begin.

42
00:02:39,100 --> 00:02:41,730
How about inside of our action types file.

43
00:02:41,950 --> 00:02:46,540
Let's create a new enum inside there and then define some of the different action types that we will

44
00:02:46,540 --> 00:02:50,770
probably need to build out some of our different actions and our different reducers.

45
00:02:51,370 --> 00:02:54,550
Some inside of my action types index dots file.

46
00:02:56,040 --> 00:03:00,180
Inside of here, I will exports an enum of action type.

47
00:03:01,790 --> 00:03:06,470
And then right now, I really don't have any great idea about the different action types will need,

48
00:03:06,710 --> 00:03:11,360
so I'm just going to reflect back on the diagram we were looking at just a moment ago and think what

49
00:03:11,360 --> 00:03:12,860
different action types do.

50
00:03:12,860 --> 00:03:15,680
We probably need to handle these different reducers.

51
00:03:16,250 --> 00:03:20,650
Well, I see one about, say, update, cell delete, cell insert and move.

52
00:03:20,990 --> 00:03:25,580
I think that we probably need one action type for each of these different action creators because each

53
00:03:25,580 --> 00:03:29,780
of these action creators are probably going to eventually, you guessed it, create an action that's

54
00:03:29,780 --> 00:03:34,380
going to look very similar or have a name or a type that is very similar to the name of the action itself.

55
00:03:35,000 --> 00:03:41,630
So in other words, we probably want to have an action type of maybe move cell.

56
00:03:45,510 --> 00:03:48,960
We probably want to have one of these elite cell.

57
00:03:52,040 --> 00:03:57,890
Probably one of insert cell before and the reason on this diagram really quick, I put on here, insert

58
00:03:57,890 --> 00:04:02,840
cell before or insert cell after is because we need to eventually decide if we want to have an action

59
00:04:02,960 --> 00:04:06,110
here called insert cell before or insert cell after.

60
00:04:06,120 --> 00:04:11,330
Essentially, do we want to have the ability to insert one cell after others or have the ability to

61
00:04:11,330 --> 00:04:14,360
insert cell after others or both?

62
00:04:14,870 --> 00:04:16,579
That's a discussion we're going to eventually have.

63
00:04:16,579 --> 00:04:20,870
But right now we're just going to assume that we're only going to have the ability to insert one cell

64
00:04:20,870 --> 00:04:24,800
before another cell will get into more detail on that in a little bit.

65
00:04:25,800 --> 00:04:26,960
I'll do insert cell before.

66
00:04:31,030 --> 00:04:36,640
And then finally was the last one, I think update cell is the last one, so update cell.

67
00:04:40,350 --> 00:04:45,570
OK, so reasonable place to get started once again, we do, of course, need to have some kind of safe

68
00:04:45,570 --> 00:04:49,950
cells, fat cells or something like that, but let's just worry about these very basic actions to get

69
00:04:49,950 --> 00:04:50,350
started.

70
00:04:51,000 --> 00:04:51,300
All right.

71
00:04:51,300 --> 00:04:51,960
So this looks good.

72
00:04:52,320 --> 00:04:54,680
Let's take a pause right here and come back in just a moment.