| Topic | Presenter | Summary | Duration |
| ------------------- | --------- | -------------------------------------------------------------------------- | -------- |
| Front End Debugging | David F. | This video is from a Friday Training that covers some front end debugging. | 1:13:07 |WEBVTT00:00:07.070 --> 00:00:08.270 I think a lot of people,00:00:08.270 --> 00:00:09.065 particularly people that00:00:09.065 --> 00:00:10.390 are newer to the field,00:00:10.390 --> 00:00:13.030 just have a hard time debugging,00:00:13.030 --> 00:00:16.918 and so I kind of want to go over.00:00:16.918 --> 00:00:19.326 Uhm, I'm giving this training as someone00:00:19.326 --> 00:00:21.747 who is relatively new to the field.00:00:21.750 --> 00:00:24.330 So Jesse NKB in particular.00:00:24.330 --> 00:00:26.420 I know you're not dumb.00:00:26.420 --> 00:00:28.220 And yeah, just in your job,00:00:28.220 --> 00:00:29.572 Alex, you so everybody,00:00:29.572 --> 00:00:31.262 please feel free to contribute,00:00:31.270 --> 00:00:32.878 but I'm hoping we can just00:00:32.878 --> 00:00:34.617 kind of create like a.00:00:34.617 --> 00:00:36.612 OK, here's the general approaches00:00:36.612 --> 00:00:39.167 you can take debugging and then here00:00:39.167 --> 00:00:40.541 are the tools that are available00:00:40.541 --> 00:00:41.940 to you and how to use them,00:00:41.940 --> 00:00:43.176 because for instance,00:00:43.176 --> 00:00:46.060 like I didn't even know about breakpoints00:00:46.060 --> 00:00:51.968 until like 2 1/2 months ago what?00:00:51.970 --> 00:00:54.544 So I really want to just be like OK,00:00:54.550 --> 00:00:55.294 you have the console.00:00:55.294 --> 00:00:56.224 You have to break point.00:00:56.230 --> 00:00:58.126 You have the sources you have,00:00:58.130 --> 00:00:58.938 you know,00:00:58.938 --> 00:01:01.766 like a lot of stuff available to00:01:01.766 --> 00:01:03.988 you and and while I'm on that,00:01:03.990 --> 00:01:05.100 by the way,00:01:05.100 --> 00:01:06.950 I will say that breakpoints00:01:06.950 --> 00:01:09.200 are going to be a lot cooler,00:01:09.200 --> 00:01:11.564 because in react you can actually00:01:11.564 --> 00:01:13.568 download this extension to Visual00:01:13.568 --> 00:01:15.698 Studio code and then you can00:01:15.698 --> 00:01:17.554 set breakpoints in Visual Studio00:01:17.554 --> 00:01:19.720 code and it will translate them00:01:19.720 --> 00:01:21.814 to Google Chrome and put it.00:01:21.814 --> 00:01:24.689 Or you put it in Visual Studio code00:01:24.689 --> 00:01:27.673 so I'm gonna I'm gonna bring up a.00:01:27.680 --> 00:01:29.200 Jesse and Oats are offspring,00:01:29.200 --> 00:01:30.400 'cause they're kind of there.00:01:30.400 --> 00:01:32.530 We didn't quite finish organizing them,00:01:32.530 --> 00:01:35.638 but there's plenty of good stuff there.00:01:35.640 --> 00:01:36.960 And so I think the first thing I00:01:36.960 --> 00:01:38.641 want to go over is kind of the tools00:01:38.641 --> 00:01:40.279 available to you as a front end developer.00:01:40.280 --> 00:01:44.366 What do you have to help you debug UM?00:01:44.370 --> 00:01:45.970 And then I'm probably going to go find00:01:45.970 --> 00:01:47.614 a couple bugs on some like QA site00:01:47.614 --> 00:01:49.139 or somewhere and will just be like OK.00:01:49.140 --> 00:01:51.816 Here's how you can approach this.00:01:51.820 --> 00:01:55.292 So I think the most obvious one00:01:55.292 --> 00:01:57.440 that everybody learns right?00:01:57.440 --> 00:01:59.123 Like day one,00:01:59.123 --> 00:02:02.489 all everybody learns console dot log.00:02:02.490 --> 00:02:05.146 Hello world yeah right.00:02:05.146 --> 00:02:08.197 So obviously the console is available to you.00:02:08.200 --> 00:02:10.270 That is one that people really like to use.00:02:10.270 --> 00:02:11.998 They're like throw console logs everywhere.00:02:14.170 --> 00:02:17.306 You should know that the console has more00:02:17.306 --> 00:02:20.400 than just evil ability to print things.00:02:20.400 --> 00:02:21.674 I think a lot of people limit00:02:21.674 --> 00:02:22.879 their use to just printing,00:02:22.880 --> 00:02:25.424 but you can actually interact with00:02:25.424 --> 00:02:28.476 the page if you want to, for instance.00:02:28.476 --> 00:02:30.527 So you can say like fonts element00:02:30.527 --> 00:02:32.370 'cause I think you could do a00:02:32.370 --> 00:02:34.108 JavaScript you can type here, right?00:02:34.108 --> 00:02:40.020 So you can say constant equals document dot.00:02:40.020 --> 00:02:46.780 Here selector. Then just say yes, right?00:02:46.780 --> 00:02:50.628 And then if we look what element is.00:02:50.630 --> 00:02:52.324 Well, maybe that was a bad example.00:02:52.330 --> 00:02:56.320 Maybe I'm typing work, bad JavaScript, uhm?00:02:59.390 --> 00:03:00.602 Let's just say, well,00:03:00.602 --> 00:03:02.420 we'll grab this one ID content.00:03:02.420 --> 00:03:06.275 So cons element. Two equals00:03:06.275 --> 00:03:09.143 document dot my vanilla JavaScript.00:03:09.143 --> 00:03:14.578 A little bit rusty. Get element by IP.00:03:14.580 --> 00:03:18.610 And then it was content.00:03:18.610 --> 00:03:21.270 And then you should.00:03:21.270 --> 00:03:24.206 Be able to just type in element too,00:03:24.210 --> 00:03:27.668 and normally it works. Why is it?00:03:27.670 --> 00:03:30.280 I now if you're ever using00:03:30.280 --> 00:03:33.249 brave it will never console log.00:03:33.250 --> 00:03:36.906 I just want to point that out so.00:03:36.910 --> 00:03:38.930 Uh, the other thing is,00:03:38.930 --> 00:03:41.086 the first error might be you, uh,00:03:41.086 --> 00:03:43.266 the query selector did wouldn't00:03:43.266 --> 00:03:45.600 have anything in it, right?00:03:45.600 --> 00:03:47.960 'cause that's an element.00:03:47.960 --> 00:03:50.214 Shouldn't it just get the first one?00:03:50.220 --> 00:03:52.230 Yeah, I don't. I don't know, I don't.00:03:52.230 --> 00:03:55.250 'cause it's not. A curious Laker is it?00:03:55.250 --> 00:03:56.330 Get element like ideas.00:03:56.330 --> 00:03:58.595 A query selector? Yeah, that's cool.00:03:58.595 --> 00:04:01.020 Try document dot design mode.00:04:01.020 --> 00:04:03.260 That's a fun one.00:04:03.260 --> 00:04:05.652 Payment Dot design mode.00:04:05.652 --> 00:04:08.185 Oh well, it's not like a variable00:04:08.185 --> 00:04:09.594 you assign you, would it?00:04:09.594 --> 00:04:11.104 You know you'd let it,00:04:11.110 --> 00:04:12.400 and it's not a function either.00:04:12.400 --> 00:04:14.120 You you wouldn't assign it to a variable.00:04:14.120 --> 00:04:16.328 You do document design mode equals00:04:16.328 --> 00:04:19.538 on and we as a string like on it.00:04:19.538 --> 00:04:23.120 And you can do some cool stuff with it.00:04:23.120 --> 00:04:24.470 You ever you ever try this?00:04:24.470 --> 00:04:24.960 Anybody?00:04:24.960 --> 00:04:26.920 I never tried this.00:04:29.220 --> 00:04:32.029 Do it. Did you yeah?00:04:32.029 --> 00:04:33.547 Yeah, click around on your page,00:04:33.550 --> 00:04:36.770 try and you know Google to type up in there.00:04:36.770 --> 00:04:39.578 You can pretty sure.00:04:39.580 --> 00:04:43.130 I only works on brave alright, sorry.00:04:43.130 --> 00:04:44.930 Well, all of our examples00:04:44.930 --> 00:04:46.370 are failing right now.00:04:46.370 --> 00:04:48.090 This is this is funded.00:04:48.090 --> 00:04:50.827 Uhm, I swear I have done this.00:04:50.830 --> 00:04:52.638 Let me just go to like I don't00:04:52.638 --> 00:04:53.974 know really well people working00:04:53.974 --> 00:04:55.899 under me let me leave me alone.00:04:58.290 --> 00:05:01.812 Go to SSP. I said speed is00:05:01.812 --> 00:05:02.624 important shape I think.00:05:04.800 --> 00:05:06.678 Normally. Also, another thing you can00:05:06.678 --> 00:05:09.517 do that I know you can do how all this00:05:09.517 --> 00:05:11.498 stuff works is you can use jQuery.00:05:11.500 --> 00:05:15.940 So you can just say better.00:05:15.940 --> 00:05:17.512 And then you can do anything00:05:17.512 --> 00:05:18.920 you do in jQuery here.00:05:18.920 --> 00:05:24.289 So you could do like a dot focus.00:05:24.290 --> 00:05:25.510 And that would focus to00:05:25.510 --> 00:05:26.486 the headers and focus.00:05:26.490 --> 00:05:27.600 Right now you can't tell,00:05:27.600 --> 00:05:29.749 but the header isn't focused right now.00:05:29.750 --> 00:05:31.946 Uhm, what I've done before that00:05:31.946 --> 00:05:34.226 I showed you previously is you00:05:34.226 --> 00:05:36.091 could say sponsor element equals00:05:36.091 --> 00:05:38.210 document dot get element by ID.00:05:38.210 --> 00:05:41.160 Normally this works. Other.00:05:41.160 --> 00:05:44.842 And then you can actually say element dot.00:05:44.842 --> 00:05:46.900 There it is why I wasn't working00:05:46.960 --> 00:05:48.362 on Google Doodles. Weird.00:05:48.362 --> 00:05:50.938 So there you see I grabbed the header.00:05:50.940 --> 00:05:52.740 OK that's what I expected to work last time.00:05:52.740 --> 00:05:55.360 Not sure why it didn't and here you can00:05:55.360 --> 00:05:57.768 just grab the element and then if you00:05:57.768 --> 00:06:00.374 want to do something dynamic you can00:06:00.374 --> 00:06:02.888 actually do like element dot append.00:06:02.890 --> 00:06:06.746 Uhm? I don't know if it's child,00:06:06.750 --> 00:06:08.628 but you can actually just create00:06:08.628 --> 00:06:11.325 a new element right like document00:06:11.325 --> 00:06:13.080 dot create element.00:06:13.080 --> 00:06:15.720 And I wanted to do this to test00:06:15.720 --> 00:06:18.130 if a font with working.00:06:18.130 --> 00:06:23.570 And so I created like a new, UM.00:06:23.570 --> 00:06:25.450 What hold the font?00:06:25.450 --> 00:06:27.330 Is it a link?00:06:27.330 --> 00:06:29.379 What holds up?00:06:29.380 --> 00:06:29.676 Yeah,00:06:29.676 --> 00:06:33.098 when you put a font at the top of a a file.00:06:33.100 --> 00:06:33.862 In the header,00:06:33.862 --> 00:06:35.640 like if you're loading it from Google,00:06:35.640 --> 00:06:36.805 I think it's a link, right?00:06:36.805 --> 00:06:39.775 Yeah, yeah, it's like A tag.00:06:39.780 --> 00:06:46.210 You can do like constant UM font link.00:06:46.210 --> 00:06:48.450 Equals.00:06:48.450 --> 00:06:52.212 A document or I think it's00:06:52.212 --> 00:06:54.720 document dot create element.00:06:54.720 --> 00:06:57.436 And to say this is a link right00:06:57.436 --> 00:07:00.838 then you could say fault link dot.00:07:00.840 --> 00:07:04.440 A atra equals and you can actually put it.00:07:04.440 --> 00:07:05.175 I'm not gonna do the whole thing,00:07:05.180 --> 00:07:07.556 but you can actually put a Google font00:07:07.556 --> 00:07:09.820 link right here and append it to the00:07:09.820 --> 00:07:12.410 header and it will immediately take effect.00:07:12.410 --> 00:07:13.370 Which is pretty cool.00:07:13.370 --> 00:07:15.735 So just to kind of open up your mind00:07:15.735 --> 00:07:17.475 to the possibilities of the console.00:07:17.480 --> 00:07:19.620 I think a lot of people just use it to read,00:07:19.620 --> 00:07:20.784 but you can actually use it00:07:20.784 --> 00:07:22.398 like for a lot of dynamic stuff.00:07:22.400 --> 00:07:22.592 Sometimes.00:07:22.592 --> 00:07:24.320 I also come in here and I'm just like,00:07:24.320 --> 00:07:26.352 ah crap, I can't remember how to how00:07:26.352 --> 00:07:28.235 to format a date in the right way.00:07:28.240 --> 00:07:31.124 I'll just do like new date dot and then,00:07:31.124 --> 00:07:33.760 you know, get a I'm like is that right?00:07:33.760 --> 00:07:34.462 I'm like, no,00:07:34.462 --> 00:07:36.849 that's not right so I do it again right?00:07:36.850 --> 00:07:38.175 And I just tried different00:07:38.175 --> 00:07:39.780 methods and this is a lot.00:07:39.780 --> 00:07:40.460 I know it feels slow,00:07:40.460 --> 00:07:42.476 but it's a lot faster now of course.00:07:42.480 --> 00:07:43.970 Reading documentation is probably better,00:07:43.970 --> 00:07:44.349 right?00:07:44.349 --> 00:07:46.244 But it's a lot faster00:07:46.244 --> 00:07:48.240 than going into the code.00:07:48.240 --> 00:07:52.624 Typing in date dot and then trying again.00:07:52.630 --> 00:07:55.857 Gulp watch, do the whole rebuild right?00:07:55.860 --> 00:07:57.480 You gotta wait 30 seconds,00:07:57.480 --> 00:07:58.620 then you gotta refresh your page.00:07:58.620 --> 00:08:00.305 Wait till it loads and00:08:00.305 --> 00:08:01.990 then see your date worked.00:08:01.990 --> 00:08:02.291 Right,00:08:02.291 --> 00:08:04.097 that's that takes a lot longer,00:08:04.100 --> 00:08:06.809 so use this like kind of quick00:08:06.809 --> 00:08:08.900 testing to your advantage.00:08:08.900 --> 00:08:10.590 Use the console for more00:08:10.590 --> 00:08:11.942 than just reading stuff.00:08:14.140 --> 00:08:16.765 I think everybody pretty much front end00:08:16.765 --> 00:08:19.060 developers know about the elements here.00:08:19.060 --> 00:08:21.956 Uhm, you know you obviously can read stuff.00:08:21.960 --> 00:08:22.852 You can open stuff.00:08:22.852 --> 00:08:25.430 You can collapse it, whatever you want to do.00:08:25.430 --> 00:08:28.125 One cool thing I will tell you.00:08:28.130 --> 00:08:29.943 Is that if you don't know about00:08:29.943 --> 00:08:31.510 all this stuff on the right,00:08:31.510 --> 00:08:32.364 I think a lot of people know00:08:32.364 --> 00:08:33.492 about this stuff to you, like hey,00:08:33.492 --> 00:08:35.660 you can check it or uncheck it right?00:08:35.660 --> 00:08:37.718 But a couple cool ones that00:08:37.718 --> 00:08:39.702 were not intuitive to me is.00:08:39.702 --> 00:08:41.310 You can do hovering.00:08:41.310 --> 00:08:44.226 So if you want to see like what this00:08:44.226 --> 00:08:46.930 link looks like when it's focused.00:08:46.930 --> 00:08:47.860 Now you can see hey,00:08:47.860 --> 00:08:49.750 it's got an outline right?00:08:49.750 --> 00:08:50.560 If you want to see what00:08:50.560 --> 00:08:51.360 it's like when it's active,00:08:51.360 --> 00:08:52.494 you can do that and it will.00:08:52.500 --> 00:08:54.240 This will just apply it00:08:54.240 --> 00:08:55.632 automatically thanks to hover.00:08:55.640 --> 00:08:59.870 Does this pool underlying effect?00:08:59.870 --> 00:09:01.670 Cents available to you can00:09:01.670 --> 00:09:03.110 also see classes here.00:09:03.110 --> 00:09:04.694 I see a lot of people and they go00:09:04.694 --> 00:09:06.440 in and they like double click here00:09:06.440 --> 00:09:08.615 and type type out a class, right?00:09:08.615 --> 00:09:11.720 And I'm like you don't have to do that,00:09:11.720 --> 00:09:13.280 you can just go up here,00:09:13.280 --> 00:09:15.760 yeah, typing betna and enter.00:09:15.760 --> 00:09:18.656 It's a little bit faster than having to00:09:18.656 --> 00:09:21.575 go actually edit a string in the elements.00:09:21.580 --> 00:09:23.560 So use that to your advantage, right?00:09:23.560 --> 00:09:26.680 UM, that's fun times right there,00:09:26.680 --> 00:09:30.600 yeah, and then you can also add,00:09:30.600 --> 00:09:32.301 you can basically say hey I want00:09:32.301 --> 00:09:33.776 to apply something to all of00:09:33.776 --> 00:09:34.936 these things with this class.00:09:34.940 --> 00:09:35.976 This little plus button.00:09:35.976 --> 00:09:37.907 Or I guess it's not these things00:09:37.907 --> 00:09:39.492 with classes whatever is actually00:09:39.492 --> 00:09:41.116 on the real element, right?00:09:41.116 --> 00:09:42.184 So it's got,00:09:42.184 --> 00:09:44.320 so its just targeting Ivy and00:09:44.320 --> 00:09:46.348 it'll it'll get the ID because00:09:46.348 --> 00:09:48.760 ID is a unique in its first.00:09:48.760 --> 00:09:50.056 Otherwise would like classes.00:09:50.056 --> 00:09:52.405 So if I were to click like00:09:52.405 --> 00:09:54.100 up here and click applause,00:09:54.100 --> 00:09:57.540 it would hurt your classes.00:09:57.540 --> 00:09:58.905 So if you ever need to test00:09:58.905 --> 00:09:59.790 out like you know,00:09:59.790 --> 00:10:02.106 an animation or any CSS property,00:10:02.110 --> 00:10:03.587 but you want to target more than00:10:03.587 --> 00:10:04.790 just one element on the page,00:10:04.790 --> 00:10:06.854 you can use that little plus00:10:06.854 --> 00:10:09.231 there and it'll create kind of an00:10:09.231 --> 00:10:11.079 on the fly stylesheet for you.00:10:11.080 --> 00:10:12.540 Double click that bad boy,00:10:12.540 --> 00:10:15.660 that's my favorite space right there.00:10:15.660 --> 00:10:17.500 This yeah, don't click that.00:10:19.610 --> 00:10:22.704 Yeah, I loved like just open this00:10:22.704 --> 00:10:25.410 up and just write a whole bunch of00:10:25.410 --> 00:10:27.690 styling and watch it go and design it.00:10:27.690 --> 00:10:29.629 Make pretty stuff is my favorite place.00:10:32.380 --> 00:10:35.632 Background color red and there you00:10:35.632 --> 00:10:38.838 go that is that is I piercing.00:10:38.840 --> 00:10:40.570 Wow, that is horrible lavender.00:10:40.570 --> 00:10:42.780 That's a little soccer cheeks00:10:42.780 --> 00:10:44.830 just like I'm going blind.00:10:44.830 --> 00:10:46.094 My eyes are bleeding.00:10:46.094 --> 00:10:48.065 OK, so that's really cool so00:10:48.065 --> 00:10:49.720 use those to your vantage.00:10:49.720 --> 00:10:52.380 You also have up here computed styles,00:10:52.380 --> 00:10:53.700 so this will tell you what00:10:53.700 --> 00:10:55.179 actually comes out in the browser.00:10:55.180 --> 00:10:58.785 So it example of a computed style.00:10:58.790 --> 00:10:59.970 I believe would be like,00:10:59.970 --> 00:11:02.099 for instance it's a lion height, right?00:11:02.099 --> 00:11:04.244 Pretty unlikely that someone went00:11:04.244 --> 00:11:06.872 in and typed in at 22.4 pixels.00:11:06.872 --> 00:11:08.236 Click click that arrow.00:11:08.240 --> 00:11:09.023 It'll tell you.00:11:09.023 --> 00:11:10.850 It'll tell you exactly where someone did.00:11:10.850 --> 00:11:12.186 That's right.00:11:12.186 --> 00:11:14.408 Oh well, OK. Yeah,00:11:14.408 --> 00:11:16.152 the little arrow at any of those points,00:11:16.160 --> 00:11:17.720 and when you when you hover over it,00:11:17.720 --> 00:11:21.024 it's got that little forward facing arrow.00:11:21.030 --> 00:11:23.704 Oh click that takes you right there.00:11:23.710 --> 00:11:24.670 Yeah, pretty cool, right?00:11:24.670 --> 00:11:25.870 I didn't even know that.00:11:25.870 --> 00:11:29.027 That's the yeah yeah, it's pretty sweet.00:11:29.030 --> 00:11:30.367 It happens more often than you think.00:11:30.370 --> 00:11:33.947 That somebody totally did do some weirdness.00:11:33.950 --> 00:11:35.004 Well, yeah.00:11:35.004 --> 00:11:38.166 I actually know what light is.00:11:38.170 --> 00:11:39.373 What's that, Katie?00:11:39.373 --> 00:11:42.612 I was gonna say I love clicking on00:11:42.612 --> 00:11:45.083 the actual dot CSS file and then.00:11:45.090 --> 00:11:48.016 A single line and that little button00:11:48.016 --> 00:11:51.458 down at the bottom left hand corner.00:11:51.460 --> 00:11:53.836 Yeah, that may be right there.00:11:53.840 --> 00:11:57.960 Oh yeah, that's pretty OK, that's great.00:11:57.960 --> 00:11:59.500 I've never needed this,00:11:59.500 --> 00:12:01.089 but that's cool to know it exists.00:12:01.090 --> 00:12:03.376 So this is the compiled CSS00:12:03.376 --> 00:12:05.400 after you run your sass.00:12:05.400 --> 00:12:07.752 This is what you get after Casassa00:12:07.752 --> 00:12:10.174 compiler or anyone who didn't know it's,00:12:10.180 --> 00:12:11.800 you know, it's the browser doesn't00:12:11.800 --> 00:12:13.623 know how to read sauce, right?00:12:13.623 --> 00:12:15.438 It's just compiled down into00:12:15.438 --> 00:12:17.290 CSS and it's really cool.00:12:17.290 --> 00:12:19.180 How does it,00:12:19.180 --> 00:12:19.810 actually?00:12:19.810 --> 00:12:20.013 See,00:12:20.013 --> 00:12:22.349 I go here and edit this and just be like hey,00:12:22.350 --> 00:12:24.520 what if that was for?00:12:24.520 --> 00:12:26.193 And the whole idea here that I00:12:26.193 --> 00:12:27.928 think the big point that KB and00:12:27.928 --> 00:12:29.787 Jesse and I are all trying to make00:12:29.787 --> 00:12:31.426 is you don't have to do a gulp00:12:31.426 --> 00:12:32.888 watch in gold build for every00:12:32.888 --> 00:12:34.448 single thing you want to test.00:12:34.450 --> 00:12:36.076 Right, that's a waste of time.00:12:36.080 --> 00:12:38.618 You're gonna waste a lot of time doing that.00:12:38.620 --> 00:12:40.702 Just go in the browser, run your little test.00:12:40.702 --> 00:12:42.310 Once it's in here and it works,00:12:42.310 --> 00:12:43.957 you know it's going to work in the code.00:12:43.960 --> 00:12:44.920 Go changing the code.00:12:47.060 --> 00:12:49.337 So the other stuff you have here I don't00:12:49.337 --> 00:12:51.096 normally use any of these other ones.00:12:51.100 --> 00:12:54.148 I'm sure they could be useful to me.00:12:54.150 --> 00:12:56.310 You have like what active event00:12:56.310 --> 00:12:58.800 listeners are on the page you have.00:12:58.800 --> 00:13:01.750 Some sort of? Oil type stuff.00:13:01.750 --> 00:13:03.670 So everything that's a flex box00:13:03.670 --> 00:13:05.946 I guess will show up under here00:13:05.950 --> 00:13:08.164 and flexbox does have some kind00:13:08.164 --> 00:13:10.550 of cool like grid type stuff.00:13:10.550 --> 00:13:12.863 They'll tell you what is the flex box right?00:13:12.870 --> 00:13:14.610 What does this container wrapping?00:13:14.610 --> 00:13:16.164 That's a pretty new feature from Chrome00:13:16.164 --> 00:13:17.708 came out like a couple months ago.00:13:20.540 --> 00:13:22.538 I normally don't use a lot of these others.00:13:22.540 --> 00:13:24.616 You can certainly look into them,00:13:24.620 --> 00:13:27.038 but the point is, you know.00:13:27.040 --> 00:13:28.610 Use all this trigger finished.00:13:28.610 --> 00:13:31.874 Go over this and see what they're up.00:13:31.880 --> 00:13:34.409 So you might want to point out in the00:13:34.409 --> 00:13:36.913 network tab you can disable your cash00:13:36.913 --> 00:13:39.750 because you're caching going to be an issue.00:13:39.750 --> 00:13:41.829 I'm gonna go, I'm gonna go tab by tab.00:13:41.830 --> 00:13:42.650 Actually the most popular00:13:42.650 --> 00:13:43.880 ones and once we get there.00:13:43.880 --> 00:13:46.142 Yeah please please please speak up00:13:46.142 --> 00:13:48.958 and tell me if I miss anything.00:13:48.960 --> 00:13:51.030 So the next thing is breakpoints.00:13:51.030 --> 00:13:53.074 Breakpoints are your friend.00:13:53.074 --> 00:13:56.859 OK breakpoints save you from having to type,00:13:56.860 --> 00:13:59.080 you know. Uhm?00:14:01.720 --> 00:14:03.776 Having type console dot log all the time?00:14:03.780 --> 00:14:06.700 Uh, so a break point.00:14:06.700 --> 00:14:08.780 So for instance, if we wanna find I'm,00:14:08.780 --> 00:14:10.092 I'm having trouble remembering00:14:10.092 --> 00:14:12.337 exactly where Seth main is so I00:14:12.337 --> 00:14:13.863 can tell you how to get there.00:14:13.870 --> 00:14:16.390 Oh wait, so you see how it says control00:14:16.390 --> 00:14:18.595 shift P run command just to do that.00:14:18.600 --> 00:14:20.560 Do that and delete that.00:14:20.560 --> 00:14:21.631 Delete the command,00:14:21.631 --> 00:14:23.773 the forward carrot and just type00:14:23.773 --> 00:14:25.947 in name always comes right up.00:14:25.950 --> 00:14:28.338 Yeah, that's exactly right.00:14:28.338 --> 00:14:30.601 There you go. Control.00:14:30.601 --> 00:14:33.427 It's almost like control P individuals,00:14:33.430 --> 00:14:34.114 period code.00:14:34.114 --> 00:14:35.482 It's exactly like control00:14:35.482 --> 00:14:37.210 P in Visual Studio code,00:14:37.210 --> 00:14:38.614 but control P opens up the00:14:38.614 --> 00:14:40.010 print dialog in the browser.00:14:40.010 --> 00:14:41.099 It's all busy.00:14:43.310 --> 00:14:45.670 So I also wanted to show you some.00:14:45.670 --> 00:14:47.470 I bet you know already David,00:14:47.470 --> 00:14:49.744 but some pretty slick stuff in00:14:49.744 --> 00:14:51.260 the console with breakpoints00:14:51.329 --> 00:14:53.129 set to set one up somewhere,00:14:53.130 --> 00:14:57.036 maybe on like maybe I'm like.00:14:57.040 --> 00:14:59.236 Actionable try like the login modal.00:14:59.240 --> 00:15:01.400 Try that. Find login modal and00:15:01.400 --> 00:15:03.620 let's break in there somewhere.00:15:03.620 --> 00:15:06.756 So I search driving insert login modal,00:15:06.760 --> 00:15:07.770 will that bring it up?00:15:07.770 --> 00:15:09.578 Yeah, pretty sure, right?00:15:09.578 --> 00:15:10.934 There's the factory,00:15:10.940 --> 00:15:12.851 but then you want something like calls00:15:12.851 --> 00:15:14.882 it right like yeah yeah maybe go to00:15:14.882 --> 00:15:16.620 the mini how about the mini menu?00:15:16.620 --> 00:15:19.788 Then go go there but but I'm00:15:19.788 --> 00:15:21.258 pretty sure it's login modal00:15:21.258 --> 00:15:22.779 that you're looking for anyway.00:15:22.780 --> 00:15:24.652 There's like the inside00:15:24.652 --> 00:15:26.524 the login modal controller.00:15:26.530 --> 00:15:27.400 When calling,00:15:27.400 --> 00:15:30.445 doesn't the factory yet call or yeah,00:15:30.450 --> 00:15:34.110 yeah, try that right go there.00:15:34.110 --> 00:15:36.030 Require login for static carptenter.00:15:36.030 --> 00:15:40.000 No, I don't want that one up.00:15:40.000 --> 00:15:43.960 Or it's around here somewhere.00:15:43.960 --> 00:15:45.868 You only got 70 more instances00:15:45.868 --> 00:15:46.822 to search through.00:15:46.830 --> 00:15:50.068 That is not a small amount, uh,00:15:50.068 --> 00:15:52.084 do you know what file it's in?00:15:52.090 --> 00:15:53.970 I can just go find it that way.00:15:53.970 --> 00:15:55.138 Oh, uh, it's time.00:15:55.138 --> 00:15:56.890 I think it's login modal dot00:15:56.954 --> 00:15:58.569 TS or something like that.00:15:58.570 --> 00:16:00.610 And then let's just go.00:16:00.610 --> 00:16:01.890 This is another good thing to show up.00:16:01.890 --> 00:16:04.123 So if you don't know how to00:16:04.123 --> 00:16:05.580 find something in there.00:16:05.580 --> 00:16:06.336 This is how to do it.00:16:06.340 --> 00:16:07.128 This is another way.00:16:07.128 --> 00:16:08.113 This is how you would.00:16:08.120 --> 00:16:10.157 This is what you normally do before00:16:10.157 --> 00:16:12.150 you set the breakpoint right?00:16:12.150 --> 00:16:14.736 So you're you're in a file.00:16:14.740 --> 00:16:15.780 I mean, Oh yeah,00:16:15.780 --> 00:16:19.700 maybe that was a mistake, sorry why?00:16:19.700 --> 00:16:20.366 Because Ubi,00:16:20.366 --> 00:16:22.364 I haven't done a poll yet,00:16:22.370 --> 00:16:24.050 and I'm not going to stop to do it right now.00:16:24.050 --> 00:16:26.306 Oh yeah, we just deleted all your files,00:16:26.310 --> 00:16:29.110 so there's nothing in there.00:16:29.110 --> 00:16:33.030 So walking little how you say that?00:16:33.030 --> 00:16:36.390 OK yeah, so here what dummy00:16:36.390 --> 00:16:40.900 deleted all your files that guy?00:16:40.900 --> 00:16:42.376 Here we go.00:16:42.376 --> 00:16:45.181 So uib modal open and then this00:16:45.181 --> 00:16:46.289 will show the modal.00:16:46.290 --> 00:16:49.097 Yeah, so if I look for maybe00:16:49.097 --> 00:16:51.188 this string right here, yeah,00:16:51.188 --> 00:16:52.978 that makes sense to me.00:16:52.980 --> 00:16:53.257 Really.00:16:53.257 --> 00:16:55.196 All all you gotta do is find00:16:55.196 --> 00:16:56.010 something unique, right?00:16:56.010 --> 00:16:57.310 That's that's that's what you're00:16:57.310 --> 00:16:59.258 looking for when you want to set a break.00:16:59.260 --> 00:17:02.998 Point is what am I doing?00:17:03.000 --> 00:17:06.168 You hear a bunch of escapes and stuff.00:17:06.170 --> 00:17:07.630 Break up there somewhere.00:17:07.630 --> 00:17:09.455 How about down into the?00:17:09.460 --> 00:17:11.497 Anyway, it won't let me do it.00:17:11.500 --> 00:17:12.766 Why can't I click on anything?00:17:15.170 --> 00:17:16.906 I can't set a breakpoint right now.00:17:16.910 --> 00:17:18.430 Are you ended this file?00:17:18.430 --> 00:17:19.490 He must have clicked around,00:17:19.490 --> 00:17:21.400 hit control Z or something.00:17:21.400 --> 00:17:23.766 Yes he did. You edited this file.00:17:23.770 --> 00:17:26.056 Oh whoops, OK, well let's let's00:17:26.056 --> 00:17:27.580 let's abandon that partly.00:17:29.610 --> 00:17:32.266 It's still doesn't wanna let me do it.00:17:32.270 --> 00:17:36.260 OK refresh your page you edited something,00:17:36.260 --> 00:17:38.508 refresh your page and give her another shot.00:17:38.510 --> 00:17:40.706 Oh there it is yeah cool.00:17:40.710 --> 00:17:42.796 So now if we click the modal.00:17:42.800 --> 00:17:45.218 Full stop before you do this.00:17:45.220 --> 00:17:46.616 This is the coolest,00:17:46.616 --> 00:17:48.361 coolest thing hit escape and00:17:48.361 --> 00:17:50.208 open up your console there.00:17:50.210 --> 00:17:52.150 Type in anything you see.00:17:52.150 --> 00:17:53.626 Anything that you or your like.00:17:53.630 --> 00:17:55.910 The actual scope of the line that you're00:17:55.910 --> 00:18:00.056 on would have access to, like type size.00:18:00.056 --> 00:18:03.584 Yeah, come right up.00:18:03.590 --> 00:18:05.570 Or and you can change it from there to.00:18:05.570 --> 00:18:08.873 You could do uib modal equals no and then00:18:08.873 --> 00:18:11.880 just wreck the whole darn thing what?00:18:11.880 --> 00:18:14.232 Yeah, now this is real handy for00:18:14.232 --> 00:18:17.003 if you know you know what the darn00:18:17.003 --> 00:18:19.627 fixes and you want to try something00:18:19.627 --> 00:18:22.207 and you don't want to continue,00:18:22.210 --> 00:18:24.570 it'll just crash, right?00:18:24.570 --> 00:18:27.086 Yeah, probably or just not do anything,00:18:27.090 --> 00:18:28.498 just didn't do anything.00:18:28.498 --> 00:18:30.130 Yeah, it's pretty.00:18:30.130 --> 00:18:32.050 It's pretty cool.00:18:32.050 --> 00:18:35.290 Pretty cool, that is super cool.00:18:35.290 --> 00:18:37.154 OK, I didn't know that so so I00:18:37.154 --> 00:18:39.218 could look for like uib modal open00:18:39.218 --> 00:18:40.753 or any basically any variable.00:18:40.760 --> 00:18:42.430 This within scope here, right?00:18:42.430 --> 00:18:44.649 Yeah I'd probably like size would work.00:18:44.650 --> 00:18:47.105 Anything that basically like this00:18:47.105 --> 00:18:49.560 function would have access to.00:18:49.560 --> 00:18:52.543 Right, pretty cool and you can, uh,00:18:52.543 --> 00:18:54.944 you could change size to LG and00:18:54.944 --> 00:18:57.668 it would probably open pretty big.00:18:57.670 --> 00:18:58.495 Is equals LG?00:18:58.495 --> 00:19:00.145 It would probably open up larger00:19:00.145 --> 00:19:02.105 if you continue that. Be kind of.00:19:02.105 --> 00:19:03.491 That's a great example actually, right?00:19:03.491 --> 00:19:05.296 Unless there is no LG,00:19:05.300 --> 00:19:08.150 so I I didn't change it back from being null,00:19:08.150 --> 00:19:10.005 so I'm going to have to reload.00:19:10.010 --> 00:19:11.305 That's weird, I wouldn't have said it.00:19:11.310 --> 00:19:12.270 I wouldn't have said it.00:19:12.270 --> 00:19:13.506 It would have stayed.00:19:13.506 --> 00:19:15.830 I would have been wrong I guess.00:19:15.830 --> 00:19:18.008 Yeah, I guess if you don't refresh the page.00:19:18.010 --> 00:19:21.388 OK, so for suicides equals LG.00:19:21.390 --> 00:19:24.414 And if you type it wrong then.00:19:24.420 --> 00:19:30.510 That's really great. OK. So yeah.00:19:30.510 --> 00:19:33.760 That works, so like that.00:19:33.760 --> 00:19:36.886 Flight changes along with your breakpoints.00:19:36.890 --> 00:19:38.738 That's very cool and you can.00:19:38.740 --> 00:19:40.582 You can do conditional breakpoints to00:19:40.582 --> 00:19:42.857 you probably know how to do those though.00:19:42.860 --> 00:19:46.040 Uhm, I have seen it before,00:19:46.040 --> 00:19:47.960 but I don't remember how to do it.00:19:47.960 --> 00:19:50.088 It's like what if if something is00:19:50.088 --> 00:19:52.236 true then apply a breakpoint, right?00:19:52.236 --> 00:19:52.592 Yeah,00:19:52.592 --> 00:19:54.728 edit that breakpoint and now everything00:19:54.728 --> 00:19:57.397 in this like same deal with the console.00:19:57.400 --> 00:19:59.225 This has access to anything00:19:59.225 --> 00:20:00.685 in the scope right?00:20:00.690 --> 00:20:03.378 And so yeah, essentially it's it'll.00:20:03.380 --> 00:20:05.220 It'll break it, break there.00:20:05.220 --> 00:20:08.070 But do that now, it won't.00:20:08.070 --> 00:20:09.570 Oh, because I left it LG?00:20:09.570 --> 00:20:11.259 OK, so yeah,00:20:11.259 --> 00:20:14.245 change it now to equals MD or will00:20:14.245 --> 00:20:16.839 do as I'm just so it's not complete.00:20:16.840 --> 00:20:18.359 Well I I'm pretty sure you would00:20:18.359 --> 00:20:19.988 need it's it's the same JavaScript.00:20:19.990 --> 00:20:22.230 It's like Boolean stuff, right?00:20:22.230 --> 00:20:26.050 I mean you know one equal sign is in a sign?00:20:26.050 --> 00:20:27.844 Yeah of course.00:20:27.844 --> 00:20:28.442 I,00:20:28.442 --> 00:20:29.638 I'm actually,00:20:29.640 --> 00:20:31.488 I don't know if that actually would00:20:31.488 --> 00:20:32.016 do assignments.00:20:32.020 --> 00:20:33.560 I think it might just00:20:33.560 --> 00:20:35.100 not do anything 'cause I00:20:35.173 --> 00:20:37.880 don't know though. Oh, you did it look.00:20:37.880 --> 00:20:40.487 You made it small that's funny. OK,00:20:40.487 --> 00:20:44.223 so that's an interesting tidbit to the UM,00:20:44.230 --> 00:20:45.910 when you assign a variable,00:20:45.910 --> 00:20:48.997 it returns the variable, so you can use an00:20:48.997 --> 00:20:51.439 assigner as like a condition check you.00:20:51.440 --> 00:20:53.976 You could do like if X = y00:20:53.976 --> 00:20:56.440 and it would return what?00:20:56.440 --> 00:20:58.080 Why is basically right?00:20:58.080 --> 00:21:00.987 So if if you wanted extra equal00:21:00.987 --> 00:21:03.819 Y and check it at the same time.00:21:03.820 --> 00:21:06.664 Yeah, So what you saying is if at the00:21:06.664 --> 00:21:09.760 end of a function you say return X = y,00:21:09.760 --> 00:21:13.390 the return will apply and the00:21:13.390 --> 00:21:16.060 X BY now will apply.00:21:16.060 --> 00:21:17.775 I don't really like to do that,00:21:17.780 --> 00:21:19.700 but you can't do it, it's it's valid.00:21:19.700 --> 00:21:23.269 I like to do X = y and then return.00:21:23.270 --> 00:21:24.565 Just to be, I think it's a00:21:24.565 --> 00:21:25.510 little clearer what's going on,00:21:25.510 --> 00:21:27.015 but I mean it's not wrong code.00:21:27.020 --> 00:21:28.032 It's not bad code,00:21:28.032 --> 00:21:29.044 it's just personal preference.00:21:29.050 --> 00:21:32.074 So now this isn't this isn't this is00:21:32.074 --> 00:21:36.550 stopping even though I have size equals MDO.00:21:36.550 --> 00:21:40.700 What? Why is it OK?00:21:40.700 --> 00:21:42.332 I wanna I wanna I wanna show it00:21:42.332 --> 00:21:43.838 work that's what I'm trying to do.00:21:43.840 --> 00:21:45.910 OK so what's your breakpoint00:21:45.910 --> 00:21:47.566 say still hear you?00:21:47.570 --> 00:21:49.992 Did you ever save it so it00:21:49.992 --> 00:21:51.490 wasn't the Assignor deal.00:21:51.490 --> 00:21:53.688 Yeah look so I just changed size,00:21:53.690 --> 00:22:00.090 right sizes, MD and the condition I thought.00:22:00.090 --> 00:22:04.050 Was uh oh OK, that's right.00:22:04.050 --> 00:22:05.770 OK here we go so I'm changing it.00:22:05.770 --> 00:22:07.780 We're playing right?00:22:07.780 --> 00:22:09.790 So triggered again.00:22:09.790 --> 00:22:10.675 Pretty sweet, OK,00:22:10.675 --> 00:22:13.160 alright I was confused for a bit there.00:22:13.160 --> 00:22:15.764 So yeah you can on the00:22:15.764 --> 00:22:17.500 flight change things up.00:22:17.500 --> 00:22:20.300 You can also and the most common00:22:20.300 --> 00:22:22.352 use scenario right would be a.00:22:22.352 --> 00:22:23.772 You're going to step over00:22:23.772 --> 00:22:25.359 or step in or step out.00:22:25.360 --> 00:22:27.698 So let's go over that real fast00:22:27.700 --> 00:22:28.911 because I think a lot of people00:22:28.911 --> 00:22:30.257 don't know how that works very well.00:22:30.260 --> 00:22:33.319 I don't know how it works absolutely,00:22:33.320 --> 00:22:34.660 but I I have a.00:22:34.660 --> 00:22:38.050 I have a concept of homes so if we do00:22:38.145 --> 00:22:40.870 this we go here and we actually log in.00:22:43.780 --> 00:22:47.166 Then we're going to get a result here, right?00:22:47.166 --> 00:22:48.696 We're going to hit this.00:22:48.700 --> 00:22:51.360 And now, let's say that I want00:22:51.360 --> 00:22:53.739 to know what happens next.00:22:53.740 --> 00:22:55.870 Right, so if anger dot is00:22:55.870 --> 00:22:57.780 function callback what is doing?00:22:57.780 --> 00:22:59.436 I can step into the function,00:22:59.440 --> 00:23:01.660 which I think would step into00:23:01.660 --> 00:23:03.188 angular like this function.00:23:03.188 --> 00:23:04.334 Is that correct?00:23:04.340 --> 00:23:07.499 It probably would 11 would and that would be.00:23:07.500 --> 00:23:09.488 That would be a tough one to00:23:09.488 --> 00:23:11.394 come to step into 'cause you'd00:23:11.394 --> 00:23:13.676 go all up into angular it be.00:23:13.680 --> 00:23:15.336 Yeah, I'm not recommending that you do it,00:23:15.340 --> 00:23:16.558 I'm just trying to say this00:23:16.558 --> 00:23:17.560 is what it would do.00:23:17.560 --> 00:23:19.982 Yeah right is it would it would00:23:19.982 --> 00:23:21.841 step into the current function00:23:21.841 --> 00:23:24.793 that the the the code is on OK?00:23:24.800 --> 00:23:26.910 Opt in way more often.00:23:26.910 --> 00:23:28.920 You just want to step over, UM.00:23:28.920 --> 00:23:31.980 So here we're here and we're just like OK,00:23:31.980 --> 00:23:34.330 if not logins, that's well,00:23:34.330 --> 00:23:35.778 opposite of that would be false so we're00:23:35.778 --> 00:23:37.036 just going to go in the next thing,00:23:37.040 --> 00:23:38.700 OK, what's the next thing?00:23:38.700 --> 00:23:40.956 So we step over and now00:23:40.956 --> 00:23:42.460 we resolve login success.00:23:42.460 --> 00:23:44.180 Right?00:23:44.180 --> 00:23:45.825 And then we can just keep stepping00:23:45.825 --> 00:23:47.542 over to be like hey where is00:23:47.542 --> 00:23:49.056 the code going right here?00:23:49.056 --> 00:23:51.494 We see it's null so now it's just00:23:51.494 --> 00:23:53.086 kind of go over here it's analyzing00:23:53.086 --> 00:23:55.018 the end of the function right now.00:23:55.020 --> 00:23:57.126 It's not in the catch block00:23:57.126 --> 00:23:58.179 'cause we succeeded,00:23:58.180 --> 00:24:00.320 and now here it's going to go into some like,00:24:00.320 --> 00:24:03.608 you know, deep angular resolving stuff.00:24:03.610 --> 00:24:06.408 OK, so use breakpoints now.00:24:06.408 --> 00:24:08.740 I will say I personally don't use00:24:08.740 --> 00:24:10.847 them like I just showed very often.00:24:10.850 --> 00:24:13.098 What I like to do and I learned00:24:13.098 --> 00:24:14.280 this from Michael.00:24:14.280 --> 00:24:15.394 Not here,00:24:15.394 --> 00:24:19.866 but what I like to do is just00:24:19.866 --> 00:24:23.015 set multiple bird points. Uhm?00:24:23.015 --> 00:24:27.088 You log in. It deleted my breakpoint.00:24:27.088 --> 00:24:29.170 What in the world what happened?00:24:29.170 --> 00:24:31.000 Oh, it was conditional, that's right.00:24:31.000 --> 00:24:34.229 OK, so go back here. Go back here.00:24:34.229 --> 00:24:35.790 And we are going to actually like00:24:35.844 --> 00:24:37.508 solve the bug here in a little bit.00:24:37.510 --> 00:24:39.886 So if you feel like this isn't applicable00:24:39.886 --> 00:24:41.790 enough yet, we're going to actually like.00:24:41.790 --> 00:24:45.520 Go find one and try to you know.00:24:45.520 --> 00:24:47.440 Focus more on walking through00:24:47.440 --> 00:24:50.339 it than we are in solving it.00:24:50.340 --> 00:24:52.040 Uhm?00:24:52.040 --> 00:24:52.508 Here we go.00:24:52.508 --> 00:24:53.600 So now we're here and I'm like,00:24:53.600 --> 00:24:53.807 oh,00:24:53.807 --> 00:24:55.049 I don't care about this phone00:24:55.049 --> 00:24:56.398 I don't care about that one.00:24:56.400 --> 00:24:58.866 I just I think it's going to hit this00:24:58.866 --> 00:25:01.698 point so you can just put a breakpoint there.00:25:01.700 --> 00:25:02.304 Hit continue,00:25:02.304 --> 00:25:04.418 it'll just do all that other stuff00:25:04.418 --> 00:25:06.584 and let you know when it gets here.00:25:06.590 --> 00:25:08.382 And so a lot of people I even00:25:08.382 --> 00:25:09.958 sell James doing this the other00:25:09.958 --> 00:25:11.910 day when I was working with them.00:25:11.910 --> 00:25:13.231 They'll just set, you know, breakpoints.00:25:13.231 --> 00:25:15.408 Basically, like every if check right there.00:25:15.410 --> 00:25:16.712 Just like tell me you're telling00:25:16.712 --> 00:25:18.287 his here 'cause I don't know what's00:25:18.287 --> 00:25:19.613 going to happen in the code.00:25:19.620 --> 00:25:21.258 I just know where the checks are00:25:21.258 --> 00:25:22.926 and I'm like what if it hits00:25:22.926 --> 00:25:24.294 here and then it returns and00:25:24.355 --> 00:25:25.760 it never hits either leads.00:25:25.760 --> 00:25:27.425 Well I want to know that so I put00:25:27.425 --> 00:25:29.195 a break point on that in check.00:25:29.200 --> 00:25:31.012 So breakpoints like you stopping the00:25:31.012 --> 00:25:33.351 code they like it altered the code and00:25:33.351 --> 00:25:35.503 let you see what's going on and you00:25:35.503 --> 00:25:37.423 can hover all this stuff so I don't00:25:37.430 --> 00:25:40.517 have to go in and say console log along00:25:40.517 --> 00:25:43.576 and success to figure out what it is.00:25:43.580 --> 00:25:46.296 Right, I can just put a breakpoint.00:25:46.300 --> 00:25:48.280 Try to log in hover.00:25:48.280 --> 00:25:50.860 I don't know. And that's way,00:25:50.860 --> 00:25:54.290 way, way, way faster than.00:25:54.290 --> 00:25:55.795 Going to find this line of code,00:25:55.800 --> 00:26:00.320 putting console dot log in there and then00:26:00.320 --> 00:26:03.224 having to do a whole rebuild right now.00:26:03.230 --> 00:26:03.556 Admittedly,00:26:03.556 --> 00:26:06.164 it'll be about the same speed with react00:26:06.164 --> 00:26:08.775 when you're developing the front end server,00:26:08.780 --> 00:26:12.370 'cause webpack is really fast.00:26:12.370 --> 00:26:14.320 But I would still recommend00:26:14.320 --> 00:26:15.619 probably favoring breakpoints up,00:26:15.619 --> 00:26:17.740 just like you know for sure that00:26:17.796 --> 00:26:19.580 your your code is going to get hit00:26:19.580 --> 00:26:21.518 and you could set em all like this,00:26:21.520 --> 00:26:24.020 but it was tracked maybe.00:26:24.020 --> 00:26:25.780 Anything is little different,00:26:25.780 --> 00:26:28.085 so is there anything else anyone00:26:28.085 --> 00:26:30.606 wants to add to this sources tab?00:26:30.606 --> 00:26:32.658 There's a bunch of other stuff00:26:32.658 --> 00:26:33.839 here I don't use.00:26:33.840 --> 00:26:35.988 I pretty much only use this.00:26:35.990 --> 00:26:39.950 Uh, I'd like to add A at network if you00:26:40.058 --> 00:26:43.714 forget how to hit the control P and.00:26:43.720 --> 00:26:46.212 A functional lab and all that great00:26:46.212 --> 00:26:48.960 stuff you can always watch the network00:26:48.960 --> 00:26:52.084 fall and grab the clarity mean dot JS00:26:52.084 --> 00:26:54.684 and double click on that bad boy. OK.00:26:54.684 --> 00:26:58.020 So if you go here and type store main JS,00:26:58.020 --> 00:27:00.096 you can like double click it.00:27:00.100 --> 00:27:03.300 Well that was bad.00:27:03.300 --> 00:27:05.328 Right click on it.00:27:05.330 --> 00:27:05.663 Uh,00:27:05.663 --> 00:27:06.329 let's see.00:27:08.830 --> 00:27:12.420 How do I go there orz? See.00:27:14.690 --> 00:27:16.818 Zach, thank you so00:27:16.818 --> 00:27:18.946 breakpoint right here here.00:27:18.950 --> 00:27:20.875 Yeah, put a breakpoint on it.00:27:20.875 --> 00:27:22.650 Will not let me go.00:27:22.650 --> 00:27:24.024 I can't click or anything but00:27:24.024 --> 00:27:25.405 it sure seems like it would00:27:25.405 --> 00:27:26.890 take you to the file. I mean.00:27:30.610 --> 00:27:34.450 You can see the path there, yeah?00:27:34.450 --> 00:27:36.755 Yes, where there was an00:27:36.755 --> 00:27:38.599 open reclick open source.00:27:38.600 --> 00:27:40.679 Open a new tab, but that's a.00:27:40.680 --> 00:27:42.390 That's what actually opens it,00:27:42.390 --> 00:27:43.870 and they won't do that.00:27:46.120 --> 00:27:48.646 Uhm, there's you're pretty pretty again.00:27:51.180 --> 00:27:52.840 Yeah baby, I'm a Ding,00:27:52.840 --> 00:27:55.066 Ding Ding Dong, liar. I don't know.00:27:55.070 --> 00:27:58.052 OK, well hidden sources control shift P00:27:58.052 --> 00:28:01.458 just like Visual Studio code except without.00:28:01.460 --> 00:28:02.704 This adds a shift.00:28:02.704 --> 00:28:05.459 You can delete this and you can get any.00:28:05.460 --> 00:28:07.980 You know any policy one like that.00:28:07.980 --> 00:28:09.588 So that's a really great tip.00:28:09.590 --> 00:28:12.075 OK, so moving on application this isn't00:28:12.075 --> 00:28:14.689 one that for purposes of debugging I'm00:28:14.689 --> 00:28:17.929 really going over one or two things really.00:28:17.930 --> 00:28:19.646 One thing which is that you00:28:19.646 --> 00:28:20.790 can clear cache storage.00:28:20.790 --> 00:28:23.526 Here all these caches and you00:28:23.526 --> 00:28:25.570 can clear cookies here now.00:28:25.570 --> 00:28:27.330 Be aware that if you do clear cookies,00:28:27.330 --> 00:28:29.234 you're going to be logged out OK,00:28:29.240 --> 00:28:30.590 sometimes that's what you want.00:28:30.590 --> 00:28:32.590 Sometimes I go here to log out because00:28:32.590 --> 00:28:34.427 the logout disappointment the log out00:28:34.427 --> 00:28:36.880 button has disappeared from the site it is.00:28:36.880 --> 00:28:38.700 So if that happens this is cool.00:28:38.700 --> 00:28:40.956 Come for the purpose of debugging.00:28:40.960 --> 00:28:43.510 I don't really go to this tab all that often,00:28:43.510 --> 00:28:44.578 except I'm like,00:28:44.578 --> 00:28:46.714 oh maybe I should clear cache.00:28:46.720 --> 00:28:48.700 You can clear localstorage sessionstorage,00:28:48.700 --> 00:28:50.368 all this stuff if any site00:28:50.368 --> 00:28:51.810 wants to source something here,00:28:51.810 --> 00:28:54.912 it'll do it again so you don't00:28:54.912 --> 00:28:56.448 have to worry about.00:28:56.450 --> 00:28:58.949 What worry about deleting anything in here,00:28:58.950 --> 00:29:02.004 uhm? Now the network tab.00:29:02.004 --> 00:29:03.784 This is obviously another one00:29:03.784 --> 00:29:05.500 somewhere we go, you know,00:29:05.500 --> 00:29:06.440 as developers,00:29:06.440 --> 00:29:07.729 every day, UM,00:29:07.729 --> 00:29:09.823 and when it comes to debugging00:29:09.823 --> 00:29:12.379 I I think it's kind of like,00:29:12.380 --> 00:29:14.516 especially for newer people when they00:29:14.516 --> 00:29:16.420 start attack approaching their tickets,00:29:16.420 --> 00:29:18.982 they don't take enough time to really00:29:18.982 --> 00:29:21.253 understand what the ticket says and00:29:21.253 --> 00:29:24.004 they don't take enough time to really00:29:24.004 --> 00:29:25.899 understand what the error says.00:29:25.900 --> 00:29:29.460 So you know.00:29:29.460 --> 00:29:32.928 Before you call anyone.00:29:32.930 --> 00:29:33.677 Always, always, always.00:29:33.677 --> 00:29:35.420 If you're getting some error and you're00:29:35.466 --> 00:29:37.090 like I don't know why this isn't working,00:29:37.090 --> 00:29:38.590 check your console to make sure00:29:38.590 --> 00:29:39.990 you don't have any errors.00:29:39.990 --> 00:29:41.838 People your red ones,00:29:41.838 --> 00:29:42.300 right?00:29:42.300 --> 00:29:43.570 And then if you do,00:29:43.570 --> 00:29:45.478 probably there's an associated00:29:45.478 --> 00:29:47.386 network call with that.00:29:47.390 --> 00:29:49.340 Go over here and find network00:29:49.340 --> 00:29:51.130 call if you click on it,00:29:51.130 --> 00:29:52.738 it'll show you this preview and00:29:52.738 --> 00:29:54.150 normally you'll have the error.00:29:54.150 --> 00:29:56.346 Now I don't have an error here right now,00:29:56.350 --> 00:29:58.527 but if I go I'm pretty confident00:29:58.527 --> 00:30:00.478 if I go to arts one.00:30:02.910 --> 00:30:04.630 Or almost any site.00:30:04.630 --> 00:30:08.119 We'll find some sort of error on the00:30:08.119 --> 00:30:10.188 front end that's red, maybe not.00:30:10.188 --> 00:30:11.686 I would be overjoyed if there wasn't.00:30:11.690 --> 00:30:15.140 Well, there's nothing. Well, it's.00:30:15.140 --> 00:30:16.605 Jesse, you've been doing such00:30:16.605 --> 00:30:19.590 a good job this man what?00:30:19.590 --> 00:30:21.317 OK, there we go. Alright, we got one.00:30:21.317 --> 00:30:22.990 You've been doing such a good job.00:30:22.990 --> 00:30:25.310 The homepage for Arx one has no errors.00:30:25.310 --> 00:30:26.678 I'm blown away.00:30:26.678 --> 00:30:29.090 Not even one, not even like a small,00:30:29.090 --> 00:30:30.890 not even images. It's all there.00:30:30.890 --> 00:30:32.730 Oh yeah, it's important to.00:30:32.730 --> 00:30:34.122 It's important to.00:30:34.122 --> 00:30:37.630 Yeah, yeah I would reckon I've it's I.00:30:37.630 --> 00:30:40.406 I have certainly been told that I'm wrong,00:30:40.410 --> 00:30:44.930 but you have a you have a 15 minute task.00:30:44.930 --> 00:30:46.478 Yeah, it's it's the most ridiculous00:30:46.478 --> 00:30:47.745 thing in the world, right?00:30:47.745 --> 00:30:49.390 Takes maybe an email can be done00:30:49.390 --> 00:30:51.228 in 15 minutes but nothing else.00:30:51.230 --> 00:30:53.598 But yeah, it's to do one thing but.00:30:53.600 --> 00:30:54.404 You you I?00:30:54.404 --> 00:30:56.012 I just don't believe you should00:30:56.012 --> 00:30:58.422 just do the one thing you should do00:30:58.422 --> 00:31:00.157 everything that looks until you get00:31:00.157 --> 00:31:01.991 to that point and then the thing00:31:02.000 --> 00:31:04.192 so it all looks good all the way00:31:04.192 --> 00:31:06.480 up until that feature or whatever.00:31:06.480 --> 00:31:10.800 But you know I am very wrong about that.00:31:10.800 --> 00:31:14.140 So anyway, I don't know.00:31:14.140 --> 00:31:16.198 Here is an example of an error.00:31:16.200 --> 00:31:17.598 You get an error you're like.00:31:17.600 --> 00:31:19.385 I don't know why it's not working00:31:19.390 --> 00:31:22.549 right and then and as in you know in00:31:22.549 --> 00:31:25.149 newbie mode and rightfully so, right?00:31:25.149 --> 00:31:26.544 Because like I in particular00:31:26.544 --> 00:31:27.980 I'm very guilty of this.00:31:27.980 --> 00:31:30.604 I'm like guys please call me message me,00:31:30.610 --> 00:31:32.395 I'm glad to help. I love responding.00:31:32.400 --> 00:31:35.106 I love like helping people be00:31:35.106 --> 00:31:37.280 successful and that's generally like00:31:37.280 --> 00:31:39.320 like where I come from as a person.00:31:39.320 --> 00:31:44.280 I love being helpful. But that said.00:31:44.280 --> 00:31:45.780 You should do your due diligence00:31:45.780 --> 00:31:47.165 before you call someone right?00:31:47.165 --> 00:31:50.245 It's like OK. What is the error say?00:31:50.250 --> 00:31:51.700 Well, there's nothing here right?00:31:51.700 --> 00:31:52.792 You drop this down.00:31:52.792 --> 00:31:54.430 It's just a bunch of garbage.00:31:54.430 --> 00:31:55.520 It's the whole stack trace.00:31:55.520 --> 00:31:56.619 No one's going to go read it.00:31:56.620 --> 00:31:58.804 No one's expecting you to read it right,00:31:58.810 --> 00:32:00.399 but you can at least say OK.00:32:00.400 --> 00:32:03.433 What's 400 mean? So.00:32:03.433 --> 00:32:05.248 That that's just the console.00:32:05.250 --> 00:32:07.464 There's a lot more info in the network tab,00:32:07.470 --> 00:32:07.692 right?00:32:07.692 --> 00:32:09.024 And I'm about to go there.00:32:09.030 --> 00:32:10.698 Yeah, OK, alright, I don't think00:32:10.698 --> 00:32:12.569 the first thing you do is say OK,00:32:12.570 --> 00:32:15.468 do I have an error code right?00:32:15.470 --> 00:32:17.635 404 oh 1404503.00:32:17.635 --> 00:32:19.760 You'll learn and answer here00:32:19.760 --> 00:32:22.110 longer come and what is that code?00:32:22.110 --> 00:32:24.469 Being so 400 is a bad request,00:32:24.470 --> 00:32:24.790 right?00:32:24.790 --> 00:32:26.710 Meaning that you sent code over00:32:26.710 --> 00:32:28.460 the wire that backing doesn't00:32:28.460 --> 00:32:29.900 know how to handle.00:32:32.340 --> 00:32:34.444 So it cannot overlap process due to something00:32:34.444 --> 00:32:35.910 that's perceived to be applying error,00:32:35.910 --> 00:32:37.760 right client referring to the00:32:37.760 --> 00:32:39.610 thing making the network home.00:32:39.610 --> 00:32:42.081 So go understanding error and on this00:32:42.081 --> 00:32:45.014 level you don't have to like click on the00:32:45.014 --> 00:32:47.620 link just like read this sentence right.00:32:47.620 --> 00:32:50.188 And then, as Jesse was saying.00:32:50.190 --> 00:32:53.136 If it's any of those codes,00:32:53.140 --> 00:32:54.340 and sometimes it's not right,00:32:54.340 --> 00:32:56.296 like there's a common like failed00:32:56.296 --> 00:32:57.600 to instantiate Seth module00:32:57.657 --> 00:32:59.177 error which everybody hates,00:32:59.180 --> 00:33:02.780 it sucks up that doesn't have a code right?00:33:02.780 --> 00:33:05.685 It's just all here on the console.00:33:05.690 --> 00:33:06.982 But if it does,00:33:06.982 --> 00:33:10.057 you can go down here and you can look00:33:10.057 --> 00:33:13.770 for the error in the network tab.00:33:13.770 --> 00:33:15.246 So if we go down here,00:33:15.250 --> 00:33:17.110 you can sort by status.00:33:17.110 --> 00:33:18.930 I like to do that pretty often,00:33:18.930 --> 00:33:20.750 so all your successful ones00:33:20.750 --> 00:33:22.206 are all grouped together,00:33:22.210 --> 00:33:24.190 ending fund error and click down.00:33:24.190 --> 00:33:27.350 Here you'll see in the headers you can00:33:27.350 --> 00:33:29.526 see OK, it since I had a bad request.00:33:29.530 --> 00:33:32.226 Did I send any data in this00:33:32.226 --> 00:33:35.090 particular case I didn't OK.00:33:35.090 --> 00:33:37.834 But then get a preview or response00:33:37.834 --> 00:33:40.648 response is a lot harder to read.00:33:40.650 --> 00:33:43.128 Get a preview your response status,00:33:43.130 --> 00:33:45.164 like sequence contains no elements and00:33:45.164 --> 00:33:47.967 then a lot of people get stuck here00:33:47.967 --> 00:33:51.020 and they're like what does this mean right?00:33:51.020 --> 00:33:52.320 It's like.00:33:52.320 --> 00:33:54.920 I don't know right?00:33:54.920 --> 00:33:56.350 And this is the point.00:33:56.350 --> 00:33:59.150 I would say OK, I'm on RX1,00:33:59.150 --> 00:34:01.300 I loaded the appointments tab.00:34:01.300 --> 00:34:03.590 I got a 400 error.00:34:03.590 --> 00:34:06.628 This is a screenshot of the message00:34:06.630 --> 00:34:09.168 and this is the related call.00:34:09.170 --> 00:34:11.306 Now it's the time I would00:34:11.306 --> 00:34:13.430 ping someone or call someone.00:34:13.430 --> 00:34:14.056 Generally speaking,00:34:14.056 --> 00:34:16.560 now you could go a little farther than00:34:16.615 --> 00:34:18.449 this and I would encourage you to.00:34:18.450 --> 00:34:20.228 The next thing you could do is00:34:20.228 --> 00:34:21.999 you could attach to the back end00:34:21.999 --> 00:34:23.768 and you could see where does this00:34:23.768 --> 00:34:25.198 network call actually going and00:34:25.198 --> 00:34:28.339 what is it doing in the code.00:34:28.340 --> 00:34:29.817 I don't want to focus too much.00:34:29.820 --> 00:34:31.535 I don't want to get into too00:34:31.535 --> 00:34:33.379 much back end stuff 'cause it's00:34:33.379 --> 00:34:35.129 a front end debugging session.00:34:35.130 --> 00:34:37.756 But at this point you you know that it00:34:37.756 --> 00:34:42.618 is at this point kind of obscure and.00:34:42.620 --> 00:34:43.936 Obviously you could also do some testing00:34:43.936 --> 00:34:45.069 and will talk about the different00:34:45.069 --> 00:34:46.490 methods if you plug in a little bit,00:34:46.490 --> 00:34:48.626 but at this point I'm like00:34:48.626 --> 00:34:50.580 OK this person tried right?00:34:50.580 --> 00:34:52.110 At least they understood the error.00:34:52.110 --> 00:34:52.806 They read it,00:34:52.806 --> 00:34:54.430 they they did their best to see,00:34:54.430 --> 00:34:55.380 kind of what's going on.00:34:57.850 --> 00:34:59.470 Would you, Jesse and Katie?00:34:59.470 --> 00:35:00.250 Would you agree with that?00:35:00.250 --> 00:35:01.594 Like, would this be a reasonable00:35:01.594 --> 00:35:02.910 point to come to someone?00:35:02.910 --> 00:35:04.420 And obviously this is provided.00:35:04.420 --> 00:35:06.318 You did write the code yourself, right?00:35:06.318 --> 00:35:08.462 If you run yourself and probably kind of00:35:08.462 --> 00:35:10.826 do it like more than I actually wouldn't.00:35:10.830 --> 00:35:13.080 I'm really sorry to say I,00:35:13.080 --> 00:35:16.840 it's super sucks everybody here,00:35:16.840 --> 00:35:17.864 and because you'll never00:35:17.864 --> 00:35:19.144 get anyone to believe you.00:35:19.150 --> 00:35:20.146 You never will.00:35:20.146 --> 00:35:23.257 But things are not as simple as they want00:35:23.257 --> 00:35:26.089 as anyone wants to believe it should be.00:35:26.090 --> 00:35:28.138 And it's sad that it's not for us.00:35:28.140 --> 00:35:29.960 But to actually successfully do00:35:29.960 --> 00:35:31.780 any front end work here,00:35:31.780 --> 00:35:32.684 you're you're,00:35:32.684 --> 00:35:35.396 you're joking to yourself if you00:35:35.396 --> 00:35:38.594 don't think you have to be looking at00:35:38.594 --> 00:35:41.182 or even modifying back end files all00:35:41.182 --> 00:35:43.715 the time that like this is probably I00:35:43.715 --> 00:35:46.089 don't know what the deal with this is,00:35:46.090 --> 00:35:48.246 but I would definitely look at like00:35:48.246 --> 00:35:50.205 that stack trace and then I would00:35:50.205 --> 00:35:52.020 look at the file and try that.00:35:52.020 --> 00:35:53.790 Well, not that stack trace.00:35:53.790 --> 00:35:56.219 I'm sorry that that little self log00:35:56.219 --> 00:35:58.487 ID thing that corresponds to the00:35:58.487 --> 00:36:01.168 real back end set back stack trace.00:36:01.170 --> 00:36:03.856 Did you did? You don't know how to use that.00:36:03.856 --> 00:36:05.022 OK, well, hang on now.00:36:05.022 --> 00:36:06.162 This is actually really important,00:36:06.170 --> 00:36:07.586 so actually it's not that one,00:36:07.590 --> 00:36:08.670 but that's the error code,00:36:08.670 --> 00:36:09.662 which is slightly useful,00:36:09.662 --> 00:36:11.420 but the message where it says Seth,00:36:11.420 --> 00:36:14.766 Kohler and and then that big gooed.00:36:14.770 --> 00:36:16.610 So it's actually Seth Colon.00:36:16.610 --> 00:36:18.090 The full thing is Seth,00:36:18.090 --> 00:36:19.506 and then that big gooey that00:36:19.506 --> 00:36:21.240 corresponds to a table in the database,00:36:21.240 --> 00:36:23.045 which actually now like definitely00:36:23.045 --> 00:36:25.706 want to show you. Can you open up?00:36:25.706 --> 00:36:29.060 Are you on the VPN and you can go to00:36:29.060 --> 00:36:32.226 that database? I am. I am mother BB gun.00:36:32.230 --> 00:36:33.434 Yes I can go to do this.00:36:33.440 --> 00:36:35.358 Uhm yeah I don't know which one00:36:35.358 --> 00:36:37.490 it is so I'm gonna have to.00:36:37.490 --> 00:36:40.480 It's on SQL 2019 2019.00:36:40.480 --> 00:36:43.190 OK cool.00:36:43.190 --> 00:36:45.070 You can tell that Jesse's worked on arts00:36:45.070 --> 00:36:47.186 want a lot lately because he knew that,00:36:47.190 --> 00:36:47.860 yeah.00:36:50.680 --> 00:36:53.158 No, it's yeah it. It's super sucks.00:36:53.160 --> 00:36:56.160 I live it and people don't want to.00:36:56.160 --> 00:36:59.200 Don't want to believe it but but you'll,00:36:59.200 --> 00:37:02.310 you'll end up blocking a lot of tasks if you00:37:02.387 --> 00:37:05.285 don't want to do this and it'll teach it,00:37:05.290 --> 00:37:07.850 you should totally do it.00:37:07.850 --> 00:37:12.322 So what is the sequel 2019? Uh.00:37:12.322 --> 00:37:16.210 Oh Gee Gees yeah that's what I was saying.00:37:16.210 --> 00:37:17.734 Like what hang on?00:37:17.734 --> 00:37:21.062 Hang on let let me let me see00:37:21.062 --> 00:37:24.728 if I can find it two seconds.00:37:24.730 --> 00:37:27.460 Uh. I guess I got it.00:37:27.460 --> 00:37:30.886 I gotta sign into Teamviewer again.00:37:30.890 --> 00:37:32.684 You could remote in and check00:37:32.684 --> 00:37:34.101 on the you know, right?00:37:34.101 --> 00:37:35.206 Yeah, that's what I was00:37:35.206 --> 00:37:36.479 going to do and then I,00:37:36.480 --> 00:37:37.866 but I figured I'd ask you first00:37:37.866 --> 00:37:39.290 in case you had it memorized.00:37:41.850 --> 00:37:45.916 But it's finding out it's 2019 SQL.00:37:45.916 --> 00:37:49.556 You gotta put a hyphen.00:37:49.560 --> 00:37:51.636 Thank you baby. I don't it00:37:51.636 --> 00:37:53.759 tell me exactly what the type.00:37:53.760 --> 00:37:56.272 What is it alright?00:37:56.272 --> 00:37:59.630 Type in SQL 2019 hyphen 1?00:38:03.700 --> 00:38:05.608 A scale 2019 hyphen.00:38:07.630 --> 00:38:09.075 Because I'm I'm looking at00:38:09.075 --> 00:38:10.520 like a large screen here,00:38:10.520 --> 00:38:12.242 we move this up and I'll look00:38:12.242 --> 00:38:14.069 at both the screens together.00:38:16.730 --> 00:38:17.913 Hold on I'm I'm just there now00:38:17.913 --> 00:38:19.177 I'll just go ahead and copy it.00:38:19.180 --> 00:38:23.036 OK, OK OK perfect. It's, uh,00:38:23.036 --> 00:38:24.944 I'll I'll pop it in chat.00:38:27.300 --> 00:38:28.805 And I did say, by the way,00:38:28.810 --> 00:38:30.385 just explicitly that that that00:38:30.385 --> 00:38:32.490 at that point the error message,00:38:32.490 --> 00:38:34.590 knowing what it says and what the00:38:34.590 --> 00:38:36.689 idea is for newer developers,00:38:36.690 --> 00:38:37.866 if you've been here a while,00:38:37.870 --> 00:38:38.945 you should probably have an00:38:38.945 --> 00:38:40.020 idea of what's causing it.00:38:42.080 --> 00:38:45.640 And in particular, you should.00:38:45.640 --> 00:38:46.978 You know you should especially know00:38:46.978 --> 00:38:48.359 have an idea what's causing it.00:38:48.360 --> 00:38:51.310 If you wrote the code.00:38:51.310 --> 00:38:53.320 So just kind of throw that out there, but.00:38:55.730 --> 00:39:00.020 Yeah, OK so. Yes.00:39:05.830 --> 00:39:09.485 Call do that, but there, oh,00:39:09.485 --> 00:39:11.590 I can't do Windows can I? I gotta do.00:39:15.150 --> 00:39:17.040 Oh yeah, oh man, it's that long.00:39:17.040 --> 00:39:18.708 Password two, you're gonna00:39:18.708 --> 00:39:21.210 have to yeah I got it.00:39:21.210 --> 00:39:25.318 Fool me honey buddy.00:39:25.320 --> 00:39:26.688 It's the loan password,00:39:26.688 --> 00:39:27.714 a real password.00:39:27.720 --> 00:39:29.785 OK, so if we go to databases,00:39:29.790 --> 00:39:33.636 go to RX17QA and then tables,00:39:33.636 --> 00:39:35.610 I'm sure it's somewhere in here.00:39:41.470 --> 00:39:45.982 Right, Jesse? I am very sorry,00:39:45.982 --> 00:39:48.014 yeah, it's it's the RX,00:39:48.014 --> 00:39:50.480 it's likes FRX one QA see00:39:50.583 --> 00:39:52.688 where that bad boy is.00:39:52.690 --> 00:39:54.620 I'm already there, you are.00:39:54.620 --> 00:39:56.420 Oh that's wrong.00:39:59.610 --> 00:40:02.354 Open yeah, open up a RX1 Seth yeah00:40:02.354 --> 00:40:05.080 yeah OK that guy and I would just open00:40:05.080 --> 00:40:06.693 a query window because you're gonna00:40:06.693 --> 00:40:08.478 need to select from a table where00:40:08.478 --> 00:40:10.169 the custom key equals your thing.00:40:10.170 --> 00:40:12.669 The thing you just copy so that00:40:12.669 --> 00:40:14.570 one's system system log select00:40:14.570 --> 00:40:16.470 from system dot system log.00:40:16.470 --> 00:40:18.780 Select star from system dot system00:40:18.780 --> 00:40:20.890 log where custom key equals.00:40:23.600 --> 00:40:25.976 The thing that you just copied.00:40:25.980 --> 00:40:27.816 Yeah, I don't think I have it in my00:40:27.816 --> 00:40:31.320 clipboard and well, I do have the.00:40:31.320 --> 00:40:35.650 Windows. Where? Custom key.00:40:41.020 --> 00:40:42.298 And it's a string. It's a.00:40:42.300 --> 00:40:44.000 It's a big old string.00:40:44.000 --> 00:40:46.340 Single quotes I think yeah,00:40:46.340 --> 00:40:49.028 Yep yeah, single quotes and so in00:40:49.028 --> 00:40:51.058 that description that's going to be.00:40:51.060 --> 00:40:52.632 That's actually a chunk of Jason00:40:52.632 --> 00:40:53.870 don't even bother reading it.00:40:53.870 --> 00:40:55.855 Yeah, just copy that and00:40:55.855 --> 00:40:58.659 throw it in in like a Jason.00:40:58.660 --> 00:41:02.038 I think I've still got a.00:41:02.040 --> 00:41:03.606 I have a really fast way of doing like00:41:03.606 --> 00:41:05.397 a temporary Jason file if you want to.00:41:05.400 --> 00:41:07.230 If you want to hear it.00:41:07.230 --> 00:41:09.498 Uhm, pretty cool.00:41:12.070 --> 00:41:14.815 It that you do but show me this first,00:41:14.820 --> 00:41:21.940 let's finish this first. OK. Cool.00:41:21.940 --> 00:41:24.212 Yeah, so basically that stack trace string is00:41:24.212 --> 00:41:26.718 kind of where we're going to start looking.00:41:26.720 --> 00:41:28.718 Look at the bottom so it's in the arts,00:41:28.720 --> 00:41:32.544 one services and it's a well I would check00:41:32.544 --> 00:41:36.224 their line 168 on RX1 services dot CS OK and00:41:36.224 --> 00:41:41.160 then then line 419 on the same file, yeah?00:41:41.160 --> 00:41:42.497 I already know what this error is,00:41:42.500 --> 00:41:44.300 but we're just going through it just to,00:41:44.300 --> 00:41:47.436 you know, I don't know what is it.00:41:47.440 --> 00:41:50.779 There's no doctor associated with the user.00:41:50.780 --> 00:41:53.798 Here you go but but we're00:41:53.798 --> 00:41:56.520 trying to show it like.00:41:56.520 --> 00:41:58.914 Arts one services dot CS and00:41:58.914 --> 00:42:01.839 yeah I'm using I I will I will.00:42:01.840 --> 00:42:02.791 Yeah yeah temporarily.00:42:02.791 --> 00:42:05.010 I'm never gonna switch out for mapping00:42:05.069 --> 00:42:06.840 my own workspace 'cause I love it,00:42:06.840 --> 00:42:10.676 but I will temporarily defer to your00:42:10.676 --> 00:42:13.708 desires and openness in code like this.00:42:13.710 --> 00:42:15.342 Yeah, it's a you'll.00:42:15.342 --> 00:42:21.170 You'll get a lot out of it, I promise.00:42:21.170 --> 00:42:23.770 There we go, so we go to that.00:42:23.770 --> 00:42:26.100 And then.00:42:26.100 --> 00:42:26.780 Flying 168,00:42:26.780 --> 00:42:28.820 which if anyone didn't know you00:42:28.820 --> 00:42:31.167 can do call in line number and00:42:31.167 --> 00:42:33.519 it'll take you right to that line.00:42:33.520 --> 00:42:36.304 OK, so that goes into a function that00:42:36.304 --> 00:42:39.082 I'll bet you is defined on line 419A.00:42:39.082 --> 00:42:41.476 Or you could just control F for00:42:41.476 --> 00:42:45.098 that guy is defined online 4190.00:42:45.098 --> 00:42:47.482 That's I saw that in the stack trace00:42:47.482 --> 00:42:49.620 that you had in the other window.00:42:49.620 --> 00:42:51.720 OK, uh, yeah hell yeah.00:42:51.720 --> 00:42:53.478 Well 419 is doctor account ID00:42:53.478 --> 00:42:55.200 so that's where it crashed.00:42:55.200 --> 00:42:56.292 It's true right there.00:42:56.292 --> 00:42:58.281 So now you know it's a data00:42:58.281 --> 00:42:59.997 issue or that it's bad code.00:43:00.000 --> 00:43:01.148 I don't know you.00:43:01.148 --> 00:43:02.870 You could totally attach to the00:43:02.938 --> 00:43:05.050 back end and then like watch what it00:43:05.050 --> 00:43:07.109 does and where it's grabbing from.00:43:07.110 --> 00:43:08.860 But context that account associations00:43:08.860 --> 00:43:10.950 is exactly what it sounds like.00:43:10.950 --> 00:43:12.474 It's like A and its association00:43:12.474 --> 00:43:14.219 to the account or something RX.00:43:14.220 --> 00:43:18.738 Once data is insanely complicated so.00:43:18.740 --> 00:43:20.798 Let's do it because attaching is,00:43:20.800 --> 00:43:21.252 you know,00:43:21.252 --> 00:43:23.060 it's something that now I will say I00:43:23.110 --> 00:43:24.880 probably would defend at this point.00:43:24.880 --> 00:43:27.265 If at this point you don't know what's wrong,00:43:27.270 --> 00:43:29.726 you can get it back under 'cause actually00:43:29.726 --> 00:43:32.415 fixing the back end code is the back end job,00:43:32.420 --> 00:43:32.822 right?00:43:32.822 --> 00:43:35.234 So now obviously clarity will love00:43:35.234 --> 00:43:38.122 you and other people love you if you00:43:38.122 --> 00:43:40.759 try to figure it this out yourself,00:43:40.760 --> 00:43:42.360 like attached and you know,00:43:42.360 --> 00:43:44.508 figure out specifically where the errors,00:43:44.510 --> 00:43:46.630 but you're not paid to be a full00:43:46.630 --> 00:43:48.404 stack developer, so. Centralizer.00:43:48.404 --> 00:43:51.945 Maybe just disagree with me, but.00:43:51.945 --> 00:43:54.070 It it will make it,00:43:54.070 --> 00:43:55.780 it's the only it's the only way I was00:43:55.780 --> 00:43:57.468 able to be able to get anything done.00:43:57.470 --> 00:43:59.710 You have to you have to understand the00:43:59.710 --> 00:44:01.614 whole it's it's it kind of goes back00:44:01.614 --> 00:44:04.938 to that first thing I said when it it sucks,00:44:04.938 --> 00:44:07.650 but like even just going on00:44:07.650 --> 00:44:09.650 to do something super simple,00:44:09.650 --> 00:44:10.938 they'll tell you to go in and00:44:10.938 --> 00:44:11.490 change some text.00:44:11.490 --> 00:44:13.452 There's some styles you it felt00:44:13.452 --> 00:44:14.760 to me at least00:44:14.839 --> 00:44:16.880 early on. Yeah, you're probably not even00:44:16.880 --> 00:44:19.420 going to make it to that step without 20
00:44:19.420 --> 00:44:22.037 bugs that you gotta fix and figure out why00:44:22.037 --> 00:44:24.235 not working and nobody planned for those.00:44:24.240 --> 00:44:27.536 Yeah, I guess so for like a general00:44:27.536 --> 00:44:29.516 question like that, that message we got00:44:29.516 --> 00:44:31.735 in the console at the beginning where00:44:31.735 --> 00:44:34.159 it said Seth and then that long string?00:44:34.160 --> 00:44:37.450 Is it safe to assume that if you see Seth00:44:37.531 --> 00:44:40.417 that that's somewhere in a database?00:44:40.420 --> 00:44:42.320 Uhm, yeah, that's specific.00:44:42.320 --> 00:44:45.020 Like that good. And that's a thing is,00:44:45.020 --> 00:44:46.450 that's pretty just pretty much00:44:46.450 --> 00:44:48.230 just that system system log table.00:44:48.230 --> 00:44:50.148 But yeah, it would be in like00:44:50.148 --> 00:44:51.710 this F database I guess or.00:44:51.710 --> 00:44:54.250 Maybe someone console logged in.00:44:54.250 --> 00:44:55.338 Yeah, I. I mean,00:44:55.338 --> 00:44:57.480 that's not intuitive as to where that is.00:44:57.480 --> 00:45:00.744 Someone would have certainly had to tell you.00:45:00.750 --> 00:45:02.316 Yes, unfortunately OK.00:45:02.316 --> 00:45:05.448 Boys, I guess just to know00:45:05.448 --> 00:45:08.199 that it's in some database.00:45:08.200 --> 00:45:12.619 Yeah, searchable yeah and to throw it up on00:45:12.619 --> 00:45:17.397 the screen again it's system dot system log.00:45:17.400 --> 00:45:19.587 So I'd probably I'm going to do that myself.00:45:19.590 --> 00:45:20.680 I'd probably throw that in00:45:20.680 --> 00:45:21.552 a sticky 00:45:21.560 --> 00:45:25.820 And yeah, I screenshot that yeah.00:45:25.820 --> 00:45:26.300 Errors.00:45:26.300 --> 00:45:29.180 I can see that being useful.00:45:31.460 --> 00:45:32.798 That would be nice for me.00:45:32.800 --> 00:45:34.190 I can't believe I've been00:45:34.190 --> 00:45:35.752 here seven months and probably00:45:35.752 --> 00:45:38.404 copy paste that bad boy Chad.00:45:38.410 --> 00:45:40.294 Oh yeah, here we go, I'll just.00:45:40.294 --> 00:45:44.680 I'll just. I will delete that part.00:45:44.680 --> 00:45:45.428 I'll just, you know.00:45:54.920 --> 00:45:57.710 Thanks Jesse, that's gonna help me00:45:57.710 --> 00:45:59.980 literally immediately starting to that.00:45:59.980 --> 00:46:02.044 Yeah, it's it's crucial.00:46:02.044 --> 00:46:05.140 I would say even it's it's.00:46:05.140 --> 00:46:06.955 It's absolutely crucial.00:46:06.955 --> 00:46:11.190 So now we're going to attach to,00:46:11.190 --> 00:46:13.742 you know again, we're going through.00:46:13.742 --> 00:46:15.202 This is a real bug, right?00:46:15.202 --> 00:46:16.774 That I know the answer too,00:46:16.780 --> 00:46:18.000 because I've already gone through.00:46:18.000 --> 00:46:20.052 In this process, but this is a real book00:46:20.052 --> 00:46:22.304 and we've shown you the whole thing right.00:46:22.310 --> 00:46:23.930 We saw something in here.00:46:23.930 --> 00:46:25.538 We looked at the error code.00:46:25.540 --> 00:46:26.800 We went to the network tab.00:46:26.800 --> 00:46:28.550 We saw. What is it showing us?00:46:28.550 --> 00:46:30.126 We found the code.00:46:30.126 --> 00:46:32.490 We went to the database right?00:46:32.490 --> 00:46:34.650 We copied this description.00:46:34.650 --> 00:46:37.714 We read the error and we didn't even00:46:37.714 --> 00:46:39.410 have to read the whole thing right?00:46:39.410 --> 00:46:43.076 Like all it's just like OK.00:46:43.080 --> 00:46:44.676 What what in here looks like a00:46:44.676 --> 00:46:46.348 file at least that I could find.00:46:46.350 --> 00:46:47.109 Oh here, OK,00:46:47.109 --> 00:46:49.970 I see a file and I see a line number.00:46:49.970 --> 00:46:50.789 Let me go.00:46:50.789 --> 00:46:52.513 Let me just start there, right?00:46:52.513 --> 00:46:55.337 'cause that's just a reasonable thing to do.00:46:55.340 --> 00:46:56.038 And obviously,00:46:56.038 --> 00:46:58.830 this would you know this stack trace would00:46:58.894 --> 00:47:01.720 change based on whatever the errors, right?00:47:01.720 --> 00:47:05.158 Here's another one so line 419.00:47:05.158 --> 00:47:07.601 So you might have started there, sure.00:47:07.601 --> 00:47:09.656 But at least you know,00:47:09.660 --> 00:47:11.100 like generally speaking here,00:47:11.100 --> 00:47:13.620 you could probably look dot CS like.00:47:13.620 --> 00:47:14.246 OK, well,00:47:14.246 --> 00:47:16.437 that's probably at least related to where00:47:16.437 --> 00:47:18.744 the error is that that's a good point.00:47:18.750 --> 00:47:19.208 Absolutely.00:47:19.208 --> 00:47:21.956 So you're going to have trouble.00:47:21.960 --> 00:47:22.224 Basically,00:47:22.224 --> 00:47:23.808 you're going to have trouble attaching00:47:23.808 --> 00:47:25.818 to any of the task await are things,00:47:25.820 --> 00:47:29.200 so you want to, you know you want to.00:47:29.200 --> 00:47:31.550 You you wanna find where00:47:31.550 --> 00:47:36.110 those get started from, yeah?00:47:36.110 --> 00:47:36.511 Yeah,00:47:36.511 --> 00:47:38.917 later things you talked about was00:47:38.917 --> 00:47:40.903 'cause you're 'cause you're stack00:47:40.903 --> 00:47:43.381 trace was yelling a ton about task00:47:43.381 --> 00:47:45.504 while later year you're going to have00:47:45.504 --> 00:47:47.333 a tough time you you're not going00:47:47.333 --> 00:47:49.253 to be able to attach into like this00:47:49.253 --> 00:47:51.276 the just like you know system right?00:47:51.276 --> 00:47:53.256 I was just, you know,00:47:53.260 --> 00:47:55.248 I'm a street like this right here.00:47:55.250 --> 00:47:57.202 Yeah, yeah, yeah, no,00:47:57.202 --> 00:47:57.959 no, no.00:47:57.959 --> 00:47:59.842 Definitely look for like a C sharp00:47:59.842 --> 00:48:01.866 file or I don't know what a TS file00:48:01.866 --> 00:48:03.829 or a JS file show up here too.00:48:03.830 --> 00:48:08.974 Never had no never. OK, so.00:48:08.974 --> 00:48:11.403 You probably just get an error in00:48:11.403 --> 00:48:13.811 the console about JS error, right?00:48:13.811 --> 00:48:15.077 And yeah, it would be there,00:48:15.080 --> 00:48:16.298 like right in front of you.00:48:16.300 --> 00:48:16.932 Yeah, so.00:48:16.932 --> 00:48:19.144 Only the back end could be as00:48:19.144 --> 00:48:20.757 easy as the front end.00:48:20.760 --> 00:48:23.160 Yeah, at least in that regard,00:48:23.160 --> 00:48:24.500 like showing us there's OK,00:48:24.500 --> 00:48:26.300 so for anyone who doesn't know that attach,00:48:26.300 --> 00:48:27.304 especially your newer people,00:48:27.304 --> 00:48:29.270 I'm going to show you how to do it.00:48:29.270 --> 00:48:30.920 It's pretty easy.00:48:30.920 --> 00:48:32.570 It's really useful.00:48:32.570 --> 00:48:34.254 You open this solution.00:48:34.254 --> 00:48:37.307 You go to debug and you go00:48:37.307 --> 00:48:39.027 to attach to process.00:48:42.680 --> 00:48:43.980 And then you're gonna.00:48:43.980 --> 00:48:46.357 It's gonna show you all the processes00:48:46.357 --> 00:48:49.773 and you've got to find the one for,00:48:49.780 --> 00:48:51.508 generally speaking, as a front end00:48:51.508 --> 00:48:54.040 are going to be attaching the one for00:48:54.040 --> 00:48:56.014 storefront you could attach to like00:48:56.073 --> 00:48:58.433 admin side or vendor admin or any others.00:48:58.440 --> 00:49:00.215 Well, generally it's wherever it's00:49:00.215 --> 00:49:02.610 wherever the request is being made from.00:49:02.610 --> 00:49:04.234 So in this case you know its storefront.00:49:04.240 --> 00:49:07.354 So to do that it's going to be in00:49:07.354 --> 00:49:09.739 details and you'll look for W3.00:49:09.740 --> 00:49:12.128 Know you're there and you enter00:49:12.128 --> 00:49:13.322 your command line.00:49:13.330 --> 00:49:15.262 Plus the the name will be W00:49:15.262 --> 00:49:16.970 3 for sure W three WP,00:49:16.970 --> 00:49:18.866 but the command line is your,00:49:18.870 --> 00:49:20.352 you know filter.00:49:20.352 --> 00:49:23.316 There you'll find a RX1 somewhere.00:49:23.320 --> 00:49:26.568 You can sort that medically as well too.00:49:26.570 --> 00:49:29.010 Can but alright here RX00:49:29.010 --> 00:49:31.102 one QA API storefront,00:49:31.102 --> 00:49:36.600 there it is and what you need is that PID00:49:38.770 --> 00:49:42.070 67076. Yeah it's the ticket.00:49:42.070 --> 00:49:45.060 So you type it here.00:49:45.060 --> 00:49:50.668 Uh, did I show processes from all users?00:49:50.670 --> 00:49:53.080 My bad. OK, that's it.00:49:53.080 --> 00:49:57.245 We don't see it 67076 there is notice it00:49:57.245 --> 00:49:59.829 doesn't tell you the the command line here.00:49:59.830 --> 00:50:01.216 That's why you have to go look00:50:01.216 --> 00:50:02.729 it up in the task manager.00:50:02.730 --> 00:50:05.826 I think it doesn't like new new new new,00:50:05.830 --> 00:50:09.428 but I've seen it only on JGS00:50:09.428 --> 00:50:11.570 computer never anywhere else.00:50:11.570 --> 00:50:14.602 So you can attach.00:50:14.602 --> 00:50:20.800 And uh, Oh well, I'm I'm not a QA server.00:50:20.800 --> 00:50:22.880 Oh yeah.00:50:22.880 --> 00:50:25.320 You you to to attach it has to00:50:25.320 --> 00:50:27.774 be admin mode has to be elevated00:50:27.774 --> 00:50:30.009 the the the uh Visual Studio00:50:30.009 --> 00:50:32.355 itself has to be admin mode.00:50:36.470 --> 00:50:38.084 Half the time this is gonna00:50:38.084 --> 00:50:39.735 this is gonna help you find00:50:39.735 --> 00:50:41.780 like you know a data problem.00:50:41.780 --> 00:50:45.938 Essentially that that you know this part.00:50:45.940 --> 00:50:47.893 It's just part of it's part of the task.00:50:47.900 --> 00:50:50.660 Based, uh, Justin and Chris.00:50:50.660 --> 00:50:51.860 Remember what I told you?00:50:51.860 --> 00:50:54.740 I set up Visual Studio to always open in00:50:54.740 --> 00:50:57.436 admin mode and I couldn't remember why.00:50:57.440 --> 00:51:00.224 Ah, that is why?00:51:00.224 --> 00:51:02.696 Yep, right there attaching and00:51:02.696 --> 00:51:05.360 having to be in detaching mode.00:51:05.360 --> 00:51:07.118 Sorry, I'm in mode two attached.00:51:07.120 --> 00:51:09.861 That's exactly why I set it up so you don't00:51:09.861 --> 00:51:11.860 have to do it 'cause you want to attach,00:51:11.860 --> 00:51:14.697 like it necessarily every day, but.00:51:14.697 --> 00:51:17.118 You cooked. Uhm?00:51:19.370 --> 00:51:23.924 6707 A click it again. Give me how00:51:23.924 --> 00:51:25.476 much of the heavy lifting I gotta do.00:51:28.050 --> 00:51:29.890 So we can talk here.00:51:29.890 --> 00:51:33.106 And if you're not a minimum.00:51:33.110 --> 00:51:35.228 You can put a breakpoint and00:51:35.228 --> 00:51:37.550 so now we're going to go back.00:51:37.550 --> 00:51:39.258 We're going to go find that file.00:51:41.510 --> 00:51:44.700 Because we found in here 419 I00:51:44.700 --> 00:51:47.811 thought was flying 14 in 168.00:51:47.811 --> 00:51:49.797 I can't remember the name of00:51:49.797 --> 00:51:52.200 the file RX1 services dot CSE.00:51:58.880 --> 00:52:04.502 Uhm, you can do control T to kind of I,00:52:04.502 --> 00:52:06.590 I actually thought you hit control P and I00:52:06.648 --> 00:52:08.864 was laughing because I you know it's funny.00:52:08.870 --> 00:52:10.974 It actually opens up the print dialog as00:52:10.974 --> 00:52:13.108 if you'd ever want to print your code.00:52:13.110 --> 00:52:15.078 But anyway, this is the same00:52:15.078 --> 00:52:16.771 functionality as what you expect00:52:16.771 --> 00:52:20.470 from control P over and code. OK.00:52:20.470 --> 00:52:21.736 I've always thought that was funny.00:52:21.740 --> 00:52:23.956 We just send me a print out of00:52:23.956 --> 00:52:25.380 your problem is that breakdown.00:52:27.710 --> 00:52:29.526 So yeah, now we know we want to00:52:29.526 --> 00:52:31.712 look at the line now, not knowing,00:52:31.712 --> 00:52:33.536 not having dressing here.00:52:33.540 --> 00:52:35.092 What I would do is I would just00:52:35.092 --> 00:52:37.028 put a breakpoint on 4/19 and 168.00:52:37.028 --> 00:52:38.340 Oh yeah yeah, yeah,00:52:38.340 --> 00:52:40.740 so that's what I'm gonna do.00:52:40.740 --> 00:52:43.450 So go down to 168.00:52:43.450 --> 00:52:44.341 Breakpoints in there.00:52:44.341 --> 00:52:46.427 This empty Gray bar, which is super00:52:46.427 --> 00:52:48.221 not intuitive if you don't know00:52:48.221 --> 00:52:50.558 Visual Studio F 9 is the shortcut as well.00:52:50.560 --> 00:52:52.870 If you have your text highlighted over.00:52:52.870 --> 00:52:57.079 Yeah, F9 will do it. F9 for one.00:52:57.079 --> 00:52:59.844 It makes a break point.00:52:59.850 --> 00:53:01.656 Oh, OK, so wherever you are,00:53:01.660 --> 00:53:02.820 wherever your cursor is,00:53:02.820 --> 00:53:03.980 it'll add one there.00:53:03.980 --> 00:53:06.743 OK, I'm going to do that in a second.00:53:06.750 --> 00:53:09.309 It's very handy.00:53:09.310 --> 00:53:12.393 419 click there, F9,00:53:12.393 --> 00:53:15.698 right and now all we have to do00:53:15.698 --> 00:53:18.088 is trigger that request again.00:53:18.090 --> 00:53:20.225 So if we go here and just00:53:20.225 --> 00:53:21.510 refresh in front end.00:53:21.510 --> 00:53:23.770 Now 00:53:23.825 --> 00:53:26.135 would stop at this breakpoint for everybody,00:53:26.140 --> 00:53:28.084 and then this would just like load forever,00:53:28.090 --> 00:53:28.416 right?00:53:28.416 --> 00:53:30.698 So you generally want to just do00:53:30.698 --> 00:53:32.878 this on your own local right?00:53:32.880 --> 00:53:35.190 But here you see it says return00:53:35.190 --> 00:53:36.610 await get store from,00:53:36.610 --> 00:53:38.524 you know.00:53:38.524 --> 00:53:40.438 4 count.00:53:40.440 --> 00:53:42.990 And then turning idea through a00:53:42.990 --> 00:53:45.210 401 so it's you can probably gather00:53:45.210 --> 00:53:46.840 those trying to return a current app,00:53:46.840 --> 00:53:51.406 current account ID or throw unauthorized.00:53:51.410 --> 00:53:53.320 And then here we can, you know,00:53:53.320 --> 00:53:55.455 step over, step in whatever we do.00:53:55.460 --> 00:53:57.944 I think Jesse would want to step in right?00:53:57.950 --> 00:53:59.020 You could, it'll take you.00:53:59.020 --> 00:54:00.612 I think it'll take you right to your00:54:00.612 --> 00:54:02.207 next break point or pretty darn close.00:54:02.210 --> 00:54:03.967 This is current account or throw 401.00:54:03.970 --> 00:54:04.434 That's cool.00:54:04.434 --> 00:54:06.290 You can either step in or step out00:54:06.341 --> 00:54:08.070 of this stepping out to shift F-11.00:54:08.070 --> 00:54:08.745 It's going to.00:54:08.745 --> 00:54:10.320 It's not like it goes backwards it00:54:10.373 --> 00:54:12.029 just it does the thing and it brings00:54:12.029 --> 00:54:13.458 you back to where it would be.00:54:13.460 --> 00:54:17.548 But here's your. There is your problem.00:54:17.550 --> 00:54:18.174 I guess.00:54:18.174 --> 00:54:20.046 We know this throws so somewhere00:54:20.046 --> 00:54:21.040 inside of this.00:54:21.040 --> 00:54:22.750 This is where you'd step in,00:54:22.750 --> 00:54:24.678 but you're going to have a really hard00:54:24.678 --> 00:54:26.506 time stepping into a LINQ query like this.00:54:26.510 --> 00:54:28.456 Yeah, it doesn't, it just doesn't work.00:54:28.460 --> 00:54:31.170 So you know, there's just.00:54:31.170 --> 00:54:35.409 There's probably well.00:54:35.410 --> 00:54:37.384 Yeah, it's failing on Dot first async.00:54:37.390 --> 00:54:39.553 If it was done first or default00:54:39.553 --> 00:54:41.230 async it would not throw,00:54:41.230 --> 00:54:43.006 but I think first async throws00:54:43.006 --> 00:54:44.190 if there's nothing there.00:54:44.190 --> 00:54:46.290 If it's zero length,00:54:46.290 --> 00:54:49.950 so there's I should actually change this.00:54:49.950 --> 00:54:51.560 It's like I wonder who?00:54:51.560 --> 00:54:53.835 Well, I I guess you'd ask like00:54:53.835 --> 00:54:56.770 whoever made this right, yeah?00:54:56.770 --> 00:54:59.178 I think it was a Brendan line.00:54:59.180 --> 00:55:01.252 Don't think I usually knows what he's00:55:01.252 --> 00:55:04.798 talking about. He's pretty good at.00:55:04.800 --> 00:55:06.720 It's not actually like pausing of00:55:06.720 --> 00:55:08.304 running failure right there, like.00:55:08.304 --> 00:55:09.520 I guess it doesn't.00:55:09.520 --> 00:55:11.962 It's just a code.00:55:11.962 --> 00:55:15.399 Well, yeah, you know that very well.00:55:15.400 --> 00:55:18.056 Every single thing is a friend and failure,00:55:18.060 --> 00:55:18.487 OK?00:55:18.487 --> 00:55:20.622 Because that's what people look00:55:20.622 --> 00:55:21.575 at and notice here.00:55:21.575 --> 00:55:22.100 By the way,00:55:22.100 --> 00:55:24.120 guys that this is pending.00:55:24.120 --> 00:55:25.215 That's because we have a00:55:25.215 --> 00:55:26.540 break point on the back end.00:55:26.540 --> 00:55:29.480 It can't resolve. I can't respond.00:55:29.480 --> 00:55:30.644 So it's just reiterating00:55:30.644 --> 00:55:32.099 if you're going to attach.00:55:32.100 --> 00:55:33.092 Generally I'm doing right00:55:33.092 --> 00:55:34.580 now and do the wrong thing.00:55:34.580 --> 00:55:35.560 Generally, you should just00:55:35.560 --> 00:55:37.030 attach on your own local site.00:55:39.620 --> 00:55:42.832 So now I don't know how you00:55:42.832 --> 00:55:43.820 would walk through this.00:55:43.820 --> 00:55:45.150 Jesse just kind of figured out 'cause00:55:45.150 --> 00:55:46.617 he knows some back end code quite a00:55:46.617 --> 00:55:48.479 bit about back end code. Now come more,00:55:48.479 --> 00:55:51.160 I hang out with that Brandon Lyon guy.00:55:51.160 --> 00:55:52.540 He rubs off on me.00:55:52.540 --> 00:55:55.104 He's got a genius brain. He does.00:55:55.104 --> 00:55:57.620 So this is definitely point that I'd be like.00:55:57.620 --> 00:56:00.056 OK, what I would do without knowing00:56:00.056 --> 00:56:02.704 anything is I would set a breakpoint00:56:02.704 --> 00:56:05.377 here and then I would hit continue and00:56:05.377 --> 00:56:07.593 you know it's rose so you're going to.00:56:07.600 --> 00:56:08.848 You're going to see it through.00:56:08.850 --> 00:56:09.942 Unsure of it, right?00:56:09.942 --> 00:56:11.936 And then I would just see that00:56:11.936 --> 00:56:13.670 it never hit this part point.00:56:13.670 --> 00:56:14.516 Yeah, that's what I would say00:56:14.516 --> 00:56:15.554 and then I'll be like, OK,00:56:15.554 --> 00:56:17.826 I know this is failing somewhere in here,00:56:17.830 --> 00:56:18.215 right?00:56:18.215 --> 00:56:20.910 Yeah, somewhere on your screen it must.00:56:20.910 --> 00:56:22.709 Someone must have closed it for you.00:56:22.710 --> 00:56:24.670 It you can open it back up via00:56:24.670 --> 00:56:26.078 settings and view and stuff,00:56:26.080 --> 00:56:28.292 but generally you can see the calls00:56:28.292 --> 00:56:30.528 the not the call stack the UM.00:56:30.530 --> 00:56:33.410 Uh, error log down by where the call00:56:33.410 --> 00:56:36.330 stack is and it would show you that00:56:36.330 --> 00:56:39.666 there was a there was a throw it through.00:56:39.670 --> 00:56:40.272 But, uh,00:56:40.272 --> 00:56:42.379 I don't know how to get there.00:56:42.380 --> 00:56:43.760 How do I pull that up?00:56:43.760 --> 00:56:44.700 I?00:56:48.030 --> 00:56:49.535 It's generally down there in that spot00:56:49.535 --> 00:56:51.254 for me, though probably underview.00:56:51.254 --> 00:56:53.394 That's where I would look.00:56:53.400 --> 00:56:57.126 View and probably a error list00:56:57.126 --> 00:57:00.790 that seems like that's probably.00:57:00.790 --> 00:57:03.208 That's probably it.00:57:03.210 --> 00:57:05.387 No, that's for this for the builder.00:57:05.390 --> 00:57:08.029 The solution itself. OK, try output log.00:57:08.030 --> 00:57:11.194 Maybe that output log.00:57:11.194 --> 00:57:16.669 Output log underview yeah. I put.00:57:16.670 --> 00:57:17.828 And then you can change that,00:57:17.830 --> 00:57:21.904 change that to a. I don't know.00:57:21.910 --> 00:57:25.940 Uhm, anyway you'll, you'll, uh.00:57:25.940 --> 00:57:28.180 Dead, I mean, I highly recommend doing this.00:57:28.180 --> 00:57:29.812 You you would have seen reading00:57:29.812 --> 00:57:31.308 through that code, which is well.00:57:31.308 --> 00:57:33.400 I mean to me that it does exactly.00:57:33.400 --> 00:57:34.620 It's pretty straightforward, right?00:57:34.620 --> 00:57:36.680 Filter by active filter by Type Key,00:57:36.680 --> 00:57:37.880 Dr, patient filter.00:57:37.880 --> 00:57:38.280 Well,00:57:38.280 --> 00:57:41.569 that one seems like a little bit obtuse,00:57:41.570 --> 00:57:43.915 but something about a relationship00:57:43.915 --> 00:57:46.260 by slave ID account association.00:57:46.260 --> 00:57:48.264 But you would know if you00:57:48.264 --> 00:57:49.400 searched first async.00:57:49.400 --> 00:57:52.600 Well, I'm pretty sure throws if it doesn't,00:57:52.600 --> 00:57:55.039 if it needs to be first or default I00:57:55.039 --> 00:57:57.220 I'm pretty sure, so it's I think it's.00:57:57.220 --> 00:58:00.118 On purpose that it throws there.00:58:00.120 --> 00:58:02.950 Wear something.00:58:02.950 --> 00:58:05.750 Well, in the front end is designed to,00:58:05.750 --> 00:58:06.510 well, actually,00:58:06.510 --> 00:58:08.790 you know it's interesting for the00:58:08.790 --> 00:58:10.929 vendor admin in store admin is00:58:10.929 --> 00:58:12.564 actually not supposed to fail.00:58:12.570 --> 00:58:12.752 Well,00:58:12.752 --> 00:58:14.390 I shouldn't say that it is supposed to fail,00:58:14.390 --> 00:58:15.659 but it should.00:58:15.659 --> 00:58:18.197 Basically we just all the on00:58:18.197 --> 00:58:21.037 Skype data would just not show00:58:21.037 --> 00:58:23.367 for the doctor or pharmacist.00:58:23.370 --> 00:58:25.146 UM and hopefully probably should have00:58:25.146 --> 00:58:27.370 an error in there that says, hey,00:58:27.370 --> 00:58:30.450 there's not an account associated with this.00:58:30.450 --> 00:58:32.515 That would be cool if that's how00:58:32.515 --> 00:58:34.330 this failed so we could do that.00:58:34.330 --> 00:58:35.835 We know that we get a 400,00:58:35.840 --> 00:58:37.680 so we can, you know,00:58:37.680 --> 00:58:40.690 on our duck catch we can do00:58:40.690 --> 00:58:41.980 something with that.00:58:41.980 --> 00:58:44.272 Right Yum, yeah.00:58:44.272 --> 00:58:46.772 Well, good, but it's about debugging,00:58:46.772 --> 00:58:48.540 so I want to check on that.00:58:48.540 --> 00:58:49.236 But yes,00:58:49.236 --> 00:58:50.280 I totally agree.00:58:50.280 --> 00:58:52.098 I would fix that problem that00:58:52.098 --> 00:58:53.765 way and I will come.00:58:53.765 --> 00:58:56.040 Does anybody have any questions?00:58:56.040 --> 00:58:58.050 Did this seem like a00:58:58.050 --> 00:58:59.256 realistic enough example?00:58:59.260 --> 00:59:01.708 And does anyone be like how00:59:01.708 --> 00:59:04.060 did you know to look at this?00:59:04.060 --> 00:59:06.060 How did you know you think about this?00:59:06.060 --> 00:59:07.530 I know this was really good man.00:59:07.530 --> 00:59:08.662 I was right on.00:59:08.662 --> 00:59:09.794 I would say yeah,00:59:09.800 --> 00:59:11.165 that was very helpful specially00:59:11.165 --> 00:59:12.802 that whole set thing and then00:59:12.802 --> 00:59:14.134 tracing it to the back end.00:59:14.140 --> 00:59:17.948 That was dope I thought so too.00:59:17.950 --> 00:59:20.286 It's a sad fact of it that you'll00:59:20.286 --> 00:59:22.651 you'll end up with a ton of tasks00:59:22.651 --> 00:59:24.930 blocked if you don't want to do this.00:59:24.930 --> 00:59:25.814 It sucks,00:59:25.814 --> 00:59:28.024 but that's how it is.00:59:28.030 --> 00:59:29.270 I will say just for I want to00:59:29.270 --> 00:59:30.604 talk a few minutes about this00:59:30.604 --> 00:59:31.824 and I want everybody please,00:59:31.830 --> 00:59:34.550 please, please chime in.00:59:34.550 --> 00:59:37.546 But there is another kind of error.00:59:37.550 --> 00:59:38.950 Which is not a.00:59:38.950 --> 00:59:41.050 It's not like a technical error,00:59:41.050 --> 00:59:43.310 it's a logical error, right?00:59:43.310 --> 00:59:48.020 So you go on the page and nothing shows up.00:59:48.020 --> 00:59:48.365 Right,00:59:48.365 --> 00:59:50.780 like like you you created a button00:59:50.780 --> 00:59:52.780 and there's just nothing there,00:59:52.780 --> 00:59:54.020 but there's no red.00:59:54.020 --> 00:59:55.570 There's nothing in the console,00:59:55.570 --> 00:59:57.085 right? Like there's just nothing00:59:57.085 --> 00:59:59.119 the elements and you don't know why.00:59:59.120 --> 01:00:02.696 How would you guys go about debugging that?01:00:02.700 --> 01:00:05.908 Oh yeah. Someone else is a little harder.01:00:07.930 --> 01:00:09.260 Once that Jesse I said01:00:09.260 --> 01:00:10.324 someone else answer first,01:00:10.330 --> 01:00:11.608 I just realized that I was gonna do it,01:00:11.610 --> 01:00:14.424 but I know, yeah, I'd maybe try01:00:14.424 --> 01:00:16.821 placing it somewhere else just to see01:00:16.821 --> 01:00:20.039 if it shows up in a different location.01:00:20.040 --> 01:00:22.624 OK so to see if like something around01:00:22.624 --> 01:00:25.380 where you put it was hiding it right?01:00:29.700 --> 01:00:31.608 I was gonna say sierran, but he01:00:31.608 --> 01:00:33.650 already left. It's all good. Uhm?01:00:35.940 --> 01:00:37.886 Alex, Jesse, what would you guys do?01:00:41.070 --> 01:00:42.372 It was if you had not getting01:00:42.372 --> 01:00:43.365 an error message and you're01:00:43.365 --> 01:00:44.534 trying to figure it out right?01:00:44.534 --> 01:00:46.190 So you like you go in and and a01:00:46.240 --> 01:00:47.787 lot of new people do this right?01:00:47.790 --> 01:00:49.398 Because we have overrides and people01:00:49.398 --> 01:00:51.813 aren't used to, but you go in here, right?01:00:51.813 --> 01:00:53.878 I keep opening Ruby curses.01:00:53.880 --> 01:00:56.211 You be OK if I go into our just01:00:56.211 --> 01:00:58.266 because there's no files in there.01:00:58.270 --> 01:01:01.938 It's not actually cursed. I go in here.01:01:01.938 --> 01:01:03.480 I go into the storefront, right?01:01:03.480 --> 01:01:05.621 I know I know I'm in the right path, right?01:01:05.621 --> 01:01:08.008 I'm like I'm in search catalog and01:01:08.008 --> 01:01:10.148 I'm whatever search analytics email01:01:10.150 --> 01:01:15.238 and I want to add you know another.01:01:15.240 --> 01:01:17.991 That whole 12 dot faulty K10.01:01:17.991 --> 01:01:20.728 I'm not gonna type the whole thing.01:01:20.730 --> 01:01:24.400 Let's make you like uhm and then I have this.01:01:24.400 --> 01:01:26.566 And then I'm I'm watching, right?01:01:26.566 --> 01:01:28.150 I see it rebuild.01:01:28.150 --> 01:01:30.488 I know I'm in the right place, right?01:01:30.488 --> 01:01:33.192 Like like I'm pretty sure how do I?01:01:33.200 --> 01:01:35.020 How do I figure out why this01:01:35.020 --> 01:01:36.530 didn't show up right here?01:01:36.530 --> 01:01:37.820 Like in the front end.01:01:41.540 --> 01:01:42.700 Yeah, what the heck?01:01:45.360 --> 01:01:47.862 Like, uh, I guess my first01:01:47.862 --> 01:01:50.809 thoughts would be a break points.01:01:50.810 --> 01:01:53.276 And if it's if it's regarding like a variable01:01:53.276 --> 01:01:55.264 that's not showing up, then it would.01:01:55.264 --> 01:01:58.048 I would, uh, just follow that,01:01:58.048 --> 01:02:01.360 but it's otherwise I would just01:02:01.464 --> 01:02:04.488 try clearing the cache. OK.01:02:04.488 --> 01:02:10.140 So I guess the question is not so much.01:02:10.140 --> 01:02:10.740 For this figure,01:02:10.740 --> 01:02:12.140 I'm glad you said that you said.01:02:12.140 --> 01:02:15.644 But really, my question is whether01:02:15.644 --> 01:02:18.148 the kinds of things that that01:02:18.148 --> 01:02:20.136 could help you just blink in this01:02:20.136 --> 01:02:21.758 general of a sense as possible.01:02:21.760 --> 01:02:23.376 Of course, specific examples.01:02:23.376 --> 01:02:25.290 But what are the kinds of01:02:25.290 --> 01:02:26.800 things that could help you?01:02:26.800 --> 01:02:30.280 Figure out what's wrong without.01:02:30.280 --> 01:02:32.398 Something actually breaking.01:02:32.400 --> 01:02:34.299 Like why did you think of clearing the cache?01:02:37.400 --> 01:02:41.014 Uhm? Just because when usually01:02:41.014 --> 01:02:42.700 everything is supposed to be working,01:02:42.700 --> 01:02:45.160 but it's not that it's just01:02:45.160 --> 01:02:47.510 this is my first thought, yeah.01:02:50.170 --> 01:02:55.787 Right, yeah, so yeah. So I.01:02:55.787 --> 01:02:58.529 I think The thing is like.01:02:58.530 --> 01:03:00.889 But what I recommend is and Jesse,01:03:00.890 --> 01:03:03.424 I want to hear your answer being.01:03:03.430 --> 01:03:04.810 Being how experienced you are,01:03:04.810 --> 01:03:05.370 I'd love to hear it.01:03:05.370 --> 01:03:07.770 But you know, my thing is,01:03:07.770 --> 01:03:11.094 I would think about double checking01:03:11.094 --> 01:03:14.540 all of the fundamentals that I know.01:03:14.540 --> 01:03:18.617 Right, so I'd be like OK for one thing.01:03:18.620 --> 01:03:21.236 Am I in the right project?01:03:21.240 --> 01:03:22.899 Right, which seems like an obvious thing,01:03:22.900 --> 01:03:25.550 but we we all know that we all work on01:03:25.620 --> 01:03:28.406 multiple projects per day in those days.01:03:28.410 --> 01:03:30.972 I like OK, I think I'm working01:03:30.972 --> 01:03:33.817 on arts one and this is our X1.01:03:33.820 --> 01:03:34.965 OK, 'cause you're not gonna01:03:34.965 --> 01:03:36.420 know if that's the error right?01:03:36.420 --> 01:03:38.208 Like there's nothing to tell you01:03:38.208 --> 01:03:40.229 you're working in the wrong project.01:03:40.230 --> 01:03:41.386 Then I'd say, OK,01:03:41.386 --> 01:03:43.630 do I have the build on right?01:03:43.630 --> 01:03:46.199 Like like are my normal things for01:03:46.199 --> 01:03:48.647 development on do I have a watch on?01:03:48.650 --> 01:03:52.120 Is it succeeding in building?01:03:52.120 --> 01:03:52.490 Right?01:03:54.860 --> 01:03:59.646 OK. Uhm? You know and and and in01:03:59.646 --> 01:04:02.156 the right file can I find the thing01:04:02.156 --> 01:04:04.124 that's right next to this right?01:04:04.130 --> 01:04:06.488 Where specifically in the front end?01:04:06.490 --> 01:04:09.290 And I expecting this change to show up01:04:09.290 --> 01:04:12.608 and then does anything show up there?01:04:12.610 --> 01:04:15.606 Right? Uhm and so kind of I,01:04:15.610 --> 01:04:17.086 I realized this like giving kind01:04:17.086 --> 01:04:18.583 of specific examples, but I guess01:04:18.583 --> 01:04:20.439 my point is like check your basics.01:04:20.439 --> 01:04:22.783 I think that's one of the the best01:04:22.783 --> 01:04:24.897 things you can do in this situation.01:04:24.900 --> 01:04:27.124 When you have some sort of logical error,01:04:27.130 --> 01:04:29.128 especially when it comes to HTML,01:04:29.130 --> 01:04:30.090 is chicken basics.01:04:30.090 --> 01:04:32.524 Like when it comes to JavaScript, absolutely.01:04:32.524 --> 01:04:36.636 Alex, I think breakpoints is a great idea.01:04:36.640 --> 01:04:38.578 Because it's like at the breakpoint,01:04:38.580 --> 01:04:41.050 just never hits your code.01:04:41.050 --> 01:04:44.810 Then it won't necessarily break right,01:04:44.810 --> 01:04:47.700 like you don't know either way, so.01:04:47.700 --> 01:04:49.872 I think that's a good point, Jesse.01:04:49.872 --> 01:04:51.652 What would you say? Yeah, well,01:04:51.652 --> 01:04:54.359 this would be cool if we have time for this.01:04:54.360 --> 01:04:55.230 This is cool.01:04:55.230 --> 01:04:56.680 I think you are right.01:04:56.680 --> 01:04:58.570 Open up your brave right there,01:04:58.570 --> 01:05:01.587 your your hey you use brave homie01:05:01.587 --> 01:05:05.685 that's so cool. Right? Yes I am.01:05:05.685 --> 01:05:06.855 I looking at the wrong icon.01:05:06.860 --> 01:05:07.586 Well, OK, sorry.01:05:07.586 --> 01:05:09.580 I totally am looking at the wrong icon.01:05:09.580 --> 01:05:10.288 I am going nuts.01:05:10.288 --> 01:05:11.680 I'm looking at my own damn screen.01:05:14.700 --> 01:05:16.800 Browser of choice where you think it's01:05:16.800 --> 01:05:19.074 going to be and your console, right?01:05:19.074 --> 01:05:20.544 Well, let's get stop attaching01:05:20.544 --> 01:05:22.030 here in case anyone else.01:05:22.030 --> 01:05:23.976 It's like trying to mess with this.01:05:23.980 --> 01:05:25.780 Yeah, that's a good call.01:05:25.780 --> 01:05:28.420 Yeah, don't attack, yeah.01:05:31.860 --> 01:05:35.580 Alright, so yes I agree, period.01:05:35.580 --> 01:05:37.812 Yeah, why would just go to where you expect,01:05:37.820 --> 01:05:39.416 but it doesn't really matter where you01:05:39.416 --> 01:05:41.295 go and just go to a safe site though.01:05:41.300 --> 01:05:43.106 Oh OK, 'cause we're kind of this.01:05:43.110 --> 01:05:45.096 You didn't really make a change,01:05:45.100 --> 01:05:48.180 you just kind of did this for pretend.01:05:48.180 --> 01:05:49.440 I I didn't even make.01:05:49.440 --> 01:05:50.440 I didn't make any change.01:05:50.440 --> 01:05:51.660 Yeah, I mean I did.01:05:51.660 --> 01:05:53.420 In in in here but I don't even01:05:53.420 --> 01:05:55.263 have a watch on like and I'm01:05:55.263 --> 01:05:56.960 also not in an override file.01:05:56.960 --> 01:06:00.480 I mean the UI file so it's totally not real.01:06:00.480 --> 01:06:03.216 Yeah yeah yeah but but do go to do01:06:03.216 --> 01:06:06.628 go to any of those and open up your01:06:06.628 --> 01:06:09.192 console there and you know I would01:06:09.192 --> 01:06:11.302 have kind of had that open when01:06:11.302 --> 01:06:12.639 you refresh your page so you can01:06:12.639 --> 01:06:14.157 see the JavaScript files coming in.01:06:14.160 --> 01:06:17.016 But do it just a regular refresh right?01:06:17.020 --> 01:06:18.670 So?01:06:18.670 --> 01:06:19.416 Look for,01:06:19.416 --> 01:06:22.027 look for your your your JS files01:06:22.027 --> 01:06:24.308 that you know that are Seth.01:06:24.310 --> 01:06:25.416 I think you can filter by Seth01:06:25.416 --> 01:06:26.259 and it comes right up.01:06:28.850 --> 01:06:30.146 Yeah, yeah, so well,01:06:30.146 --> 01:06:32.590 you know you just got all fresh.01:06:32.590 --> 01:06:34.630 You had nothing but fresh files that time.01:06:34.630 --> 01:06:35.589 That was what I was gonna say.01:06:35.590 --> 01:06:36.714 'cause you know, size,01:06:36.714 --> 01:06:38.953 you know you you you didn't get it01:06:38.953 --> 01:06:40.682 would have said like from disk if01:06:40.682 --> 01:06:42.880 you do a regular refresh now it'll01:06:42.880 --> 01:06:44.582 it'll definitely say like from01:06:44.582 --> 01:06:47.234 disk or memory cache or something.01:06:47.240 --> 01:06:50.048 Yeah, I see. So you know for sure,01:06:50.050 --> 01:06:53.346 like HTML stuff that you know that gets01:06:53.346 --> 01:06:56.280 compiled down into that fifth file down,01:06:56.280 --> 01:06:58.085 you know that gets compiled01:06:58.085 --> 01:06:59.890 into Seth Dash store templates,01:06:59.890 --> 01:07:02.990 so if you if you have it saying memory cache,01:07:02.990 --> 01:07:04.818 that's just what it was before, right?01:07:04.818 --> 01:07:06.694 So you know, make sure you download01:07:06.694 --> 01:07:08.109 the newer version of that.01:07:08.110 --> 01:07:10.060 That's the first thing so you01:07:10.060 --> 01:07:11.360 know it built right.01:07:11.360 --> 01:07:12.879 It built into a new file that01:07:12.879 --> 01:07:14.269 you haven't quite downloaded yet,01:07:14.270 --> 01:07:15.812 so you'd hard refresh to make01:07:15.812 --> 01:07:17.569 sure you get the new version.01:07:17.570 --> 01:07:21.946 That UM, and when that downloads right here,01:07:21.950 --> 01:07:24.940 you're you're thinking, well, I.01:07:24.940 --> 01:07:27.281 I put that on the catalog, right?01:07:27.281 --> 01:07:29.689 So so I'm gonna go look at the01:07:29.689 --> 01:07:31.729 catalog SCI doesn't have catalog,01:07:31.730 --> 01:07:33.266 so that's so that's how we look at.01:07:33.270 --> 01:07:36.510 Yeah sorry you said any.01:07:36.510 --> 01:07:40.395 I did say any a SSP doesn't01:07:40.395 --> 01:07:42.790 really either camp does,01:07:42.790 --> 01:07:44.148 but it's kind of off and on.01:07:44.150 --> 01:07:45.836 But let's see if they're done01:07:45.836 --> 01:07:48.789 working on maybe maybe they are.01:07:48.790 --> 01:07:51.430 Ruby's catalog.01:07:51.430 --> 01:07:52.774 I don't know if the products are loading,01:07:52.780 --> 01:07:54.450 but there's a catalog existing.01:07:57.240 --> 01:07:59.417 Oh yeah guys that pull the cool01:07:59.417 --> 01:08:01.285 thing you helped me build me.01:08:01.285 --> 01:08:04.080 While you pretty much built it really, but.01:08:04.080 --> 01:08:05.980 Well, yeah, well you can't.01:08:05.980 --> 01:08:08.920 You have to log in to see products on it.01:08:08.920 --> 01:08:10.800 We did it like three months yeah oh,01:08:10.800 --> 01:08:12.776 that did so is that on this project?01:08:12.780 --> 01:08:15.388 That cool there's DNN plugin that we made.01:08:15.390 --> 01:08:17.000 Yeah it's on this question.01:08:17.000 --> 01:08:18.212 Yeah, that DNN plugging01:08:18.212 --> 01:08:19.424 that was really sweet.01:08:19.430 --> 01:08:20.300 I liked that.01:08:20.300 --> 01:08:21.460 So that that's actually01:08:21.460 --> 01:08:23.089 what this is that worked.01:08:25.640 --> 01:08:26.564 That was, yeah, yeah,01:08:26.564 --> 01:08:27.488 that's why that's yeah,01:08:27.490 --> 01:08:28.840 yeah, totally worked.01:08:28.840 --> 01:08:31.028 That was legit. That was legit.01:08:31.028 --> 01:08:33.540 I kind of thought that went nowhere.01:08:33.540 --> 01:08:34.470 I'm glad you're using it.01:08:37.470 --> 01:08:38.060 Block01:08:40.150 --> 01:08:43.290 no products, but that's cool,01:08:43.290 --> 01:08:45.760 but you knew you knew it was supposed to be01:08:45.820 --> 01:08:48.212 in the search catalog and we'll pretend in01:08:48.212 --> 01:08:50.649 this case that it doesn't say disk cache.01:08:50.650 --> 01:08:52.778 You knew you downloaded the new thing.01:08:52.780 --> 01:08:53.812 So where was it?01:08:53.812 --> 01:08:55.591 Where was it supposed to be, right?01:08:55.591 --> 01:08:57.208 It was supposed to be kind of.01:08:57.210 --> 01:08:59.256 It was like a called 12
01:08:59.256 --> 01:09:01.170 call FK something or other.01:09:01.170 --> 01:09:02.510 So you search around your01:09:02.510 --> 01:09:03.850 element Inspector for that guy.01:09:03.850 --> 01:09:04.928 'cause if you made it it was.01:09:04.930 --> 01:09:06.650 It was HTML, you wouldn't.01:09:06.650 --> 01:09:10.374 You would search around for it like.01:09:10.380 --> 01:09:11.696 It was called 12.01:09:11.696 --> 01:09:13.670 Called FK something or other and01:09:13.737 --> 01:09:15.760 if you know it all compiled and01:09:15.760 --> 01:09:17.785 you know you downloaded the new01:09:17.785 --> 01:09:20.319 compile and you still can't find it.01:09:20.320 --> 01:09:22.896 Yeah, you know HTML is not cashed in01:09:22.896 --> 01:09:25.070 any other way besides the browser01:09:25.070 --> 01:09:27.680 or you know your memory like that.01:09:27.680 --> 01:09:29.140 That whole Redis thing being01:09:29.140 --> 01:09:30.308 how annoying it is.01:09:30.310 --> 01:09:32.175 That's just for like data01:09:32.175 --> 01:09:34.040 right from like database calls,01:09:34.040 --> 01:09:35.310 that kind of thing, right?01:09:35.310 --> 01:09:36.273 So it's not.01:09:36.273 --> 01:09:37.878 It's not having anything really01:09:37.878 --> 01:09:40.016 to do with HTML, so you know.01:09:40.016 --> 01:09:41.588 That you couldn't find the thing01:09:41.588 --> 01:09:42.390 you just did.01:09:42.390 --> 01:09:42.915 UM,01:09:42.915 --> 01:09:45.540 thankfully we have those overrides,01:09:45.540 --> 01:09:47.549 so if you try to make something01:09:47.549 --> 01:09:49.354 in the original file and change01:09:49.354 --> 01:09:51.405 it around and it didn't show up,01:09:51.410 --> 01:09:52.856 your first thought should be like,01:09:52.860 --> 01:09:55.674 oh, you know what? Maybe some other.01:09:55.680 --> 01:09:57.525 Some other helpful person made01:09:57.525 --> 01:09:59.370 an override at some point,01:09:59.370 --> 01:10:01.345 so I should go look for that and01:10:01.345 --> 01:10:02.720 your yeah that would probably.01:10:02.720 --> 01:10:05.750 I mean that's that's probably right.01:10:05.750 --> 01:10:07.990 So I was kind of thinking like01:10:07.990 --> 01:10:10.769 how would you as a new person.01:10:10.770 --> 01:10:13.200 Figure out that overrides existed.01:10:13.200 --> 01:10:14.949 Oh yeah, right.01:10:14.949 --> 01:10:16.698 I don't know,01:10:16.700 --> 01:10:17.848 like without someone telling01:10:17.848 --> 01:10:18.996 you someone should definitely01:10:18.996 --> 01:10:20.169 tell you it's crucial.01:10:20.170 --> 01:10:22.465 Yeah, it would be really hard to go right,01:10:22.470 --> 01:10:22.818 yeah?01:10:22.818 --> 01:10:25.254 So we should tell you it's critical,01:10:25.260 --> 01:10:27.510 you know.01:10:27.510 --> 01:10:31.033 So I guess you could read you could read01:10:31.033 --> 01:10:33.670 the gulpfile that was always fun to read.01:10:33.670 --> 01:10:34.532 Gulpfile JS.01:10:34.532 --> 01:10:37.118 That's true, but you would have01:10:37.118 --> 01:10:39.967 to know that that existed like.01:10:39.970 --> 01:10:40.898 You know, I mean,01:10:40.898 --> 01:10:42.058 they would have to decipher01:10:42.058 --> 01:10:43.268 that from the gold watch.01:10:43.270 --> 01:10:44.686 There must be something that exists,01:10:44.690 --> 01:10:46.427 or so you could feel in control P and01:10:46.427 --> 01:10:49.690 look for gold and you'd find something, yeah?01:10:49.690 --> 01:10:51.730 So yeah, that's pretty big.01:10:51.730 --> 01:10:53.040 It's kind of a read.01:10:53.040 --> 01:10:54.920 It's pretty big pull.01:10:57.210 --> 01:10:59.094 Yeah, but you might look for01:10:59.094 --> 01:11:00.350 something like override or01:11:00.414 --> 01:11:02.129 template or something in here.01:11:02.130 --> 01:11:09.828 I probably maybe override. Uh, OK, yeah.01:11:09.830 --> 01:11:11.366 Can can convention compare?01:11:11.366 --> 01:11:13.670 That's probably that's that's it right?01:11:13.670 --> 01:11:15.548 There, that's how it does overrides.01:11:15.550 --> 01:11:16.300 That's pretty cool.01:11:18.610 --> 01:11:20.658 No, they'll tree comparison.01:11:20.658 --> 01:11:22.833 That's that's it. Sweet.01:11:22.833 --> 01:11:25.998 Throughout you would, I guess,01:11:26.000 --> 01:11:27.120 the the short answer is,01:11:27.120 --> 01:11:28.614 it's kind of hard, and the more you learn,01:11:28.620 --> 01:11:31.964 the easier to get up, but the longer here,01:11:31.964 --> 01:11:33.590 the more it should be like.01:11:33.590 --> 01:11:35.900 OK, let me remember the fundamentals right01:11:35.900 --> 01:11:39.009 back out a little bit and don't always just01:11:39.009 --> 01:11:41.600 think about the code you wrote itself.01:11:41.600 --> 01:11:43.040 But think about.01:11:43.040 --> 01:11:44.960 Is my environment right?01:11:44.960 --> 01:11:47.768 Right and I in the right editor and I01:11:47.768 --> 01:11:50.889 in the right file in my init override.01:11:50.890 --> 01:11:53.795 You know, like those kinds of things.01:11:53.800 --> 01:11:56.576 So thanks very much,01:11:56.576 --> 01:11:58.154 sorry what's that I was.01:11:58.154 --> 01:12:00.497 I was saying thank you for showing the back01:12:00.497 --> 01:12:02.429 end debugging 'cause it's super important.01:12:02.430 --> 01:12:03.980 Never think that it's you.01:12:03.980 --> 01:12:06.776 You should totally not think like,01:12:06.780 --> 01:12:07.750 oh, that's not my job.01:12:07.750 --> 01:12:08.698 It's back end,01:12:08.698 --> 01:12:11.210 but because you'll find more often than not,01:12:11.210 --> 01:12:13.466 it's probably just some data thing.01:12:13.470 --> 01:12:15.801 That yeah, it should be a little01:12:15.801 --> 01:12:17.980 more clear what the problem was,01:12:17.980 --> 01:12:21.070 but since I II advocate against01:12:21.070 --> 01:12:23.130 against using local databases,01:12:23.130 --> 01:12:24.140 you know for this reason.01:12:24.140 --> 01:12:25.350 Because someone else already did01:12:25.350 --> 01:12:27.019 all the data for you for sure.01:12:27.020 --> 01:12:28.637 So you just use the QA one.01:12:28.640 --> 01:12:29.978 You're probably going to be good,01:12:29.980 --> 01:12:31.716 but to someone's going to be pretty01:12:31.716 --> 01:12:33.298 annoyed if it's just the data01:12:33.298 --> 01:12:34.858 thing and you didn't really check,01:12:34.860 --> 01:12:36.216 and that's how you check it.01:12:36.220 --> 01:12:37.096 It does suck.01:12:37.096 --> 01:12:39.540 Everything takes a lot longer than you think,01:12:39.540 --> 01:12:40.708 because you'll probably need01:12:40.708 --> 01:12:42.460 to debug the back end too.01:12:42.460 --> 01:12:43.316 Thanks for showing that.01:12:43.316 --> 01:12:44.750 I appreciate I really do appreciate it,01:12:44.750 --> 01:12:46.064 and thanks for showing us I01:12:46.064 --> 01:12:47.480 didn't know about the whole step.01:12:47.480 --> 01:12:49.658 Ivy and you know the lot ID and all01:12:49.658 --> 01:12:52.426 at the table. So that was cool.01:12:52.426 --> 01:12:53.730 Yeah, it's critical.