1 00:00:00,960 --> 00:00:01,980 Instructor: So, we're all done with 2 00:00:01,980 --> 00:00:03,840 our specs for our reducer 3 00:00:03,840 --> 00:00:05,160 and we're also all done 4 00:00:05,160 --> 00:00:07,320 with the implementation side as well. 5 00:00:07,320 --> 00:00:10,170 All we need to do now is wire up the reducer 6 00:00:10,170 --> 00:00:11,910 to our combineReducers call 7 00:00:11,910 --> 00:00:14,823 inside of reducers, index.js. 8 00:00:16,440 --> 00:00:21,100 Let's import our commentsReducer 9 00:00:22,770 --> 00:00:26,760 from, excuse me, from comments. 10 00:00:26,760 --> 00:00:28,860 And then we'll take out this kind of dummy reducer 11 00:00:28,860 --> 00:00:30,750 that's sitting in here by default. 12 00:00:30,750 --> 00:00:34,638 And replace it with just comments is coming from 13 00:00:34,638 --> 00:00:36,660 commentsReducer. 14 00:00:36,660 --> 00:00:39,480 We'll save, check our specs. 15 00:00:39,480 --> 00:00:42,390 Everything is still green, very good. 16 00:00:42,390 --> 00:00:43,890 I think that we're at a pretty good state 17 00:00:43,890 --> 00:00:46,680 where we could go and test our code out in the browser. 18 00:00:46,680 --> 00:00:48,243 Let's flip open the browser. 19 00:00:52,440 --> 00:00:53,980 I'm gonna refresh the page 20 00:00:58,230 --> 00:01:00,300 and we'll enter some text. 21 00:01:00,300 --> 00:01:03,720 We'll say "New Comment" and we'll submit the comment 22 00:01:03,720 --> 00:01:07,020 and sure enough, it gets added as a new ally. 23 00:01:07,020 --> 00:01:08,250 So this is really fantastic. 24 00:01:08,250 --> 00:01:10,410 It means that we built our entire feature 25 00:01:10,410 --> 00:01:12,630 with maybe what, only one time 26 00:01:12,630 --> 00:01:16,680 did we ever refresh this thing in the browser? 27 00:01:16,680 --> 00:01:17,940 That would've been really hard to do 28 00:01:17,940 --> 00:01:20,490 without having some tests to go along with this. 29 00:01:20,490 --> 00:01:22,560 So it was solely by writing tests ahead of time 30 00:01:22,560 --> 00:01:25,290 that we got to develop almost our entire feature 31 00:01:25,290 --> 00:01:28,260 without ever really touching it inside the browser. 32 00:01:28,260 --> 00:01:30,150 Now there's just one problem here. 33 00:01:30,150 --> 00:01:33,360 The button right here is popping up next to the text area 34 00:01:33,360 --> 00:01:34,890 which is really unsightly 35 00:01:34,890 --> 00:01:36,750 and it would be really nice to have a title 36 00:01:36,750 --> 00:01:38,460 at the top of this as well. 37 00:01:38,460 --> 00:01:41,970 So let's go ahead and make that late game change. 38 00:01:41,970 --> 00:01:45,000 We're gonna do this inside of our comment_box, 39 00:01:45,000 --> 00:01:46,533 inside of the comments folder. 40 00:01:47,850 --> 00:01:50,160 Inside the form, I'm gonna add on a, 41 00:01:50,160 --> 00:01:55,160 how about just a h4 that says "Add a comment." 42 00:01:56,310 --> 00:01:59,100 And I'm also gonna wrap my button with a div 43 00:01:59,100 --> 00:02:01,173 just to force it onto a new line. 44 00:02:03,600 --> 00:02:06,570 Okay, let's go and refresh. 45 00:02:06,570 --> 00:02:08,340 Okay, so this looks a lot better. 46 00:02:08,340 --> 00:02:13,110 Now we can say "That was a great article." 47 00:02:13,110 --> 00:02:15,750 You know, let's assume this is an actual comment. 48 00:02:15,750 --> 00:02:19,077 Or "That was a horrible article." 49 00:02:20,820 --> 00:02:23,940 So also note that the text area is properly clearing out 50 00:02:23,940 --> 00:02:25,590 when we submit the comment as well, 51 00:02:25,590 --> 00:02:27,930 which is the behavior that we really wanted. 52 00:02:27,930 --> 00:02:30,757 We can add more comments on here. 53 00:02:30,757 --> 00:02:35,277 "Localhost is where we find this app." 54 00:02:36,480 --> 00:02:38,730 Or any other comment you could possibly think of. 55 00:02:38,730 --> 00:02:41,283 I'm a little bit tapped on comments at this point. 56 00:02:42,600 --> 00:02:45,060 So this is pretty much the app in summary. 57 00:02:45,060 --> 00:02:47,010 What I'd like to do at this point 58 00:02:47,010 --> 00:02:49,650 is I would like to continue in the next section 59 00:02:49,650 --> 00:02:51,840 where we're going to take a very deep look 60 00:02:51,840 --> 00:02:53,190 at this test helper. 61 00:02:53,190 --> 00:02:55,320 We're gonna rip out the entire test helper 62 00:02:55,320 --> 00:02:56,880 and rewrite it from scratch. 63 00:02:56,880 --> 00:02:58,320 And we're also gonna talk a lot more 64 00:02:58,320 --> 00:03:01,800 about the theory behind mocha and chai 65 00:03:01,800 --> 00:03:02,700 and look a little bit 66 00:03:02,700 --> 00:03:04,950 at how they're working internally as well. 67 00:03:04,950 --> 00:03:06,850 So I'll catch you in the next section.