[00:00:00] Welcome back. In the last few guides we kept seeing an era when we will reload the page with a with an existing ID in our you're up. So all season of Thanksgiving in the hall below the page and we get the sign there. So basically it's saying Can every property find undefined in our newsletter reduce or affect click on that. It will show us code that looks like what we have. Sometimes it's different in here but basically it's breaking there because in our newsletter here in our newsletter reduce or not as we have this fine function here and it's trying to go through our archive here but it's kind of a problem when we reload the page because our data is 9 in our local store. It's not saved. So basically what's happening is it's going it's trying to go through an archive a component called archive or a property call archive. But that doesn't even exist because we haven't finished yet we reloaded the page. So keep in mind that we haven't visited or other components which means that hasn't fetched it. The archive has nothing in it. She's just trying to go through an object that doesn't even exist. So you can find on a property that isn't of time collection or array. So the simple fixes by declaring an initial stay. So up here newsletter Release or we can say constant initial stage and then we can declare a few properties and here we can say ARCHIVE We want this to be a collection so simple like that. [00:01:40][99.3]
[00:01:41] Then we have our latest item that's going to be an item so an object and then we had our first item which is also miaow. And then we have to set a state here and function to initial stage. And I want to point out quickly that in notice that has the underscore looks a lot like our actions here. So this kind of look it's not anything special to actions. It's just that the real reason we happened to be doing the same thing here is because in our type stuff. Yes there are also constants. So it's a convention in programming not just javascript programming general to make Constans capital letters and Constans are just variables that you can mutate can't change. And the reason you sneak a case under here with these underscores is because if you were to do this initial state like that it's really hard to see when that word is because the lettering is different and the normal variable you can just say and it's clear because this is the only capital but when they're all capitals it creates some confusion. So typing it out in snake case allows us to be better. So that's something special that actions something special to a convention and programming of naming your Constans. So that's what that is. Now back to what we're actually doing went off track a little bit if we want up now it's going to go through fine. It's going to find an archive and it's going to say OK this is a collection which means this collection object indeed does have defined the method. It's literally a part of that time. So because our hyper collection is inheriting all of this all this junk will all of us. [00:03:37][116.7]
[00:03:38] It's not that we don't understand it directly. Well I not going explain but basically it's a tight collection or array. Yes the type array which means it has to find method on it which means something will be defined. Is there something we can call the object. So if you remove the page you'll notice that works but we don't have our content. But that's just because we haven't fetched our ideas. So okay thanks. This is by actually instead of fetching our items in the newsletter it's by fetching our items in the app startup. We're trying to do this guy and we might not do it for a while or at all but basically that's why we're not getting our data because it's not never hitting us which is why it's a good idea to declare these things like the root component because the room is always going to run depending on how you set it up and it might introduce some other areas in this case by fed by trying to affection for we get data back from the promise and stuff like that. So we won't go into too much detail on that. Let's focus on the react that you need to focus on. So we ever Atom's out again and we get this and we learned in this guy setting initial state introduce introducer so we can kind of define what we want to get out of this for sure there. Therefore we don't have to run into stupid errors like that and we don't have any confusion because we know what's in this file. [00:05:15][96.9]
[00:05:16] We can't now say not when we go to our index such as Ridleys and we know those are types that reduce her. OK. So that's all we're going to do is get committer code from let's say Set up initial state and newsletter producer. OK. In the next guy we'll see what we want to do. It's good for out to see what we need to do. So we are displaying this and we can't edit anything. What we should do if we look at our design we have an added functionality here. We can either add it or we could learn how to how to write. Let's go ahead and learn how to add a new item and the reason I want to do that first is because we don't want to we don't want to learn how to edit an item. First we need to know how the router works how we can first create an item instead of editing it and then we'll learn how to edit it after so the next guy we will put a button on the screen somewhere and we will create our component for new news. So we look at the same map here we have our we have a new route we're going to implement which is good news. So it will actually do is just what we'll do as well in the next guy and we'll set up the route we'll put the new newsletter button and then we will go from there. So I'll catch you the next hour now. We have committed Arko. [00:05:16][0.0]
[312.9]