1 00:00:00,330 --> 00:00:11,040 Amazing work so far, and I think we have acquired enough knowledge to create a simple Amazon best selling 2 00:00:11,040 --> 00:00:11,730 book list. 3 00:00:12,060 --> 00:00:13,150 Now, what am I talking about? 4 00:00:13,680 --> 00:00:20,790 If we navigate to search engine mistype Amazon best selling books now, don't worry, Mom, I'm going 5 00:00:20,790 --> 00:00:29,190 to ask you to buy anything, but we will try to recreate at least some parts of it using Riak. 6 00:00:29,460 --> 00:00:36,990 Now, you can pick any book you would like, but I'm going to go with this one because this one is by 7 00:00:36,990 --> 00:00:40,560 far the most favorite book of my daughter. 8 00:00:40,560 --> 00:00:48,060 And I have probably read this and I want to say a thousand times, but I don't think that's even close 9 00:00:48,060 --> 00:00:50,220 to a real number. 10 00:00:50,610 --> 00:00:52,030 So here what I was looking for. 11 00:00:52,410 --> 00:00:57,780 We're going to go back to our application and we'll just give it a more meaningful name. 12 00:00:58,140 --> 00:01:05,340 Keep in mind, you can call this greeting, but I'm going to go with a booklist, let's say, book lists, 13 00:01:05,340 --> 00:01:08,210 and eventually there will be a list of books. 14 00:01:08,670 --> 00:01:14,670 Then we're going to go with book list as well, and then I'll do a little bit of spring cleaning where 15 00:01:14,670 --> 00:01:19,140 for the time being, I'll say that it is going to be our section. 16 00:01:19,590 --> 00:01:24,440 And here, let's write this is a book list. 17 00:01:24,460 --> 00:01:26,220 Now, of course, there's nothing there right now. 18 00:01:26,610 --> 00:01:32,130 And where we have the person and message, well, eventually it's going to be two different components. 19 00:01:32,130 --> 00:01:33,840 So I'll just remove them. 20 00:01:34,230 --> 00:01:36,150 And once we separate, of course, we have this. 21 00:01:36,210 --> 00:01:38,450 This is a book list. 22 00:01:38,820 --> 00:01:42,790 So now, of course, I would want to create four components. 23 00:01:43,200 --> 00:01:50,580 Now, please keep in mind, technically, I could just set up one where I have the book and in the book 24 00:01:50,580 --> 00:01:55,430 I could have the image, I could have the title as well as the author. 25 00:01:55,740 --> 00:02:02,040 Now, I'll purposefully put this up into three components, meaning there's going to be a book component 26 00:02:02,040 --> 00:02:07,620 and then in there there's going to be three separate components, one for him and one for title and 27 00:02:07,620 --> 00:02:14,420 one for author, just to showcase how we would narced those components even more. 28 00:02:14,700 --> 00:02:17,910 And then later we will refactor it back to one book. 29 00:02:18,060 --> 00:02:22,800 And this is just to showcase that it is up to you how you want to structure your application. 30 00:02:23,160 --> 00:02:28,530 If you want to create everything has a component, you can definitely do it, or you can just place 31 00:02:28,530 --> 00:02:30,970 everything in one book component. 32 00:02:31,380 --> 00:02:37,820 So where we have the book list right after that, I'm going to create another component. 33 00:02:38,070 --> 00:02:42,000 Now, in this case, though, I'm going to use our function again. 34 00:02:42,270 --> 00:02:46,320 You can use regular function if you want, but I'm going to go with a function. 35 00:02:46,620 --> 00:02:47,880 We have our parameters. 36 00:02:47,910 --> 00:02:49,320 We have implicit return. 37 00:02:49,560 --> 00:02:54,060 And then as far as return, I would want to return the article. 38 00:02:54,430 --> 00:03:02,280 So another moment and in there are going to be three separate components for time being. 39 00:03:02,530 --> 00:03:07,620 I'll just say this is a book, OK, we save that. 40 00:03:07,890 --> 00:03:15,480 And then where we have the book list now or we could do is just get rid of this generic text and say 41 00:03:15,480 --> 00:03:17,360 that I'm looking for the book. 42 00:03:17,730 --> 00:03:20,750 So once I save it, I have this book. 43 00:03:21,120 --> 00:03:24,210 Now it's really, really, really, really cool. 44 00:03:24,400 --> 00:03:31,100 Poldrack is that I can add multiple instances of that book. 45 00:03:31,410 --> 00:03:38,040 So if I start just copying and pasting the same instance of the book, notice how here I'm getting these 46 00:03:38,040 --> 00:03:38,750 values as well. 47 00:03:39,120 --> 00:03:46,290 So what that means is that the moment I'll change something in my book, that of course it will affect 48 00:03:46,530 --> 00:03:48,380 all the instances that I have. 49 00:03:48,690 --> 00:03:53,940 So here I'll say this is a book and outrageous around you. 50 00:03:54,160 --> 00:03:55,500 This is a car. 51 00:03:55,710 --> 00:03:57,120 And of course, it's not going to make sense. 52 00:03:57,390 --> 00:04:04,890 But you'll see right away that all my instances in here are, which is really, really, really cool. 53 00:04:05,130 --> 00:04:07,530 And of course, I'm going to have five thousand of them. 54 00:04:07,710 --> 00:04:11,190 I can one of them can have three of them or whatever. 55 00:04:11,190 --> 00:04:17,010 And then later we'll take a look at how we can render with a different name for it, because we need 56 00:04:17,010 --> 00:04:20,910 to understand that, of course, at the moment it will just hard code this one value. 57 00:04:21,210 --> 00:04:28,980 But it's already really cool that we could multiply it on a fly and then change it in one place, because 58 00:04:29,010 --> 00:04:33,390 notice, it's not like I had to hop from one place to another one to change this text. 59 00:04:33,660 --> 00:04:37,470 I just set up the component I copied how many times I wanted. 60 00:04:37,560 --> 00:04:40,890 And then once I change something in here, that's it. 61 00:04:41,160 --> 00:04:43,620 All the instances will be affected. 62 00:04:43,980 --> 00:04:47,340 Now I will go back to my one single book. 63 00:04:47,610 --> 00:04:53,970 And like I said, it's going to be a little bit of overkill right now, but I'll set up three separate 64 00:04:53,970 --> 00:04:54,570 components. 65 00:04:54,780 --> 00:04:59,910 So in here I'll call this image and I'll just try an implicit return because one. 66 00:05:00,480 --> 00:05:04,180 So we'll return image and in order to get that image. 67 00:05:04,380 --> 00:05:09,310 Just click on it and you're looking for the copy image address. 68 00:05:09,540 --> 00:05:13,560 That's the one you need and then place it here in stores. 69 00:05:13,560 --> 00:05:14,680 Now, as far as the alternative. 70 00:05:14,700 --> 00:05:15,920 I'm not going to worry about it. 71 00:05:16,200 --> 00:05:21,650 And that where we have the book instead of this is a car, which totally doesn't make sense. 72 00:05:21,930 --> 00:05:24,020 Now, I'm just looking for this image. 73 00:05:24,360 --> 00:05:30,000 So like I said, even though this is a component, I can invest even more components. 74 00:05:30,360 --> 00:05:33,450 So I have a book that is rendered in a book. 75 00:05:33,750 --> 00:05:40,410 However, in the book, there's going to be three separate components that's separate and there is not. 76 00:05:40,410 --> 00:05:42,870 Of course, I have my image now. 77 00:05:42,870 --> 00:05:43,470 What's next? 78 00:05:43,890 --> 00:05:49,030 Well, now what I would want is to grab a title as well as the author. 79 00:05:49,170 --> 00:05:54,340 And again, it's going to be a little bit of overkill, but will create two more components. 80 00:05:54,780 --> 00:05:56,400 So let's call this author. 81 00:05:57,350 --> 00:06:04,220 And of course, we would need to set up our turn again, you want implicit, you can set up implicit. 82 00:06:04,220 --> 00:06:06,910 If you want explicit, you can set up explicit. 83 00:06:06,920 --> 00:06:10,470 I think I'm going to go with implicit where I'm going to go with having one. 84 00:06:10,490 --> 00:06:12,650 And by the way, I have this federal function. 85 00:06:12,980 --> 00:06:17,390 And as far as the value, let's just or not didn't copy. 86 00:06:17,690 --> 00:06:20,620 So let me grab this one, by the way. 87 00:06:20,630 --> 00:06:22,300 I think I was going for the author. 88 00:06:22,970 --> 00:06:23,740 My apologies. 89 00:06:23,750 --> 00:06:30,900 I think I'm going to have to remind us it's not going to be author is going to be a title, My Bad. 90 00:06:31,850 --> 00:06:33,080 So that's my title. 91 00:06:33,290 --> 00:06:41,720 And then right after this image, I would want to add my title so that, of course, my title Kampot 92 00:06:42,110 --> 00:06:43,900 it is now I have my caporn. 93 00:06:44,150 --> 00:06:47,180 And lastly, of course, let's also the author. 94 00:06:47,720 --> 00:06:54,170 So we're going to go consed and then author again, implicit, explicit, whatever. 95 00:06:54,200 --> 00:06:59,980 You can set up a traditional function if you want, and then we're looking for this value. 96 00:07:00,260 --> 00:07:06,290 So let me figure out how I can copy that Mark show and I don't know how I'm going to play this in having 97 00:07:06,290 --> 00:07:08,420 four copy and paste. 98 00:07:08,960 --> 00:07:14,730 And then of course I'll do the same thing over here where we are going to go with an author. 99 00:07:15,510 --> 00:07:23,900 So now once we set this up, now I have my book component in that book component, I have three separate 100 00:07:23,900 --> 00:07:28,340 components, one for the image, one for the title and one for the author. 101 00:07:28,670 --> 00:07:34,380 And then where I render my book, if I increase it notes. 102 00:07:34,790 --> 00:07:41,090 So now, of course, we'll have these multiple instances and we already saw the moment I'll change something 103 00:07:41,090 --> 00:07:41,780 around here. 104 00:07:42,200 --> 00:07:49,430 It will affect all the instances where I render my book and my opinion. 105 00:07:49,430 --> 00:07:56,060 It's a really, really awesome because as you can see, we can nicely utilize our component structure 106 00:07:56,360 --> 00:08:04,250 where we can have as many instances as we would want, but we control them in only one place. 107 00:08:04,400 --> 00:08:09,100 And the moment we add those changes, all the instances will be affected.