Complex Routing with Express and React (P5D43) - Live Coding with Jesse

Key Takeaways

hey everyone welcome to live coding with Jessie I'm Jessie today we're going to do some routing with node and Express and we had a pull request from Nikki aka rook in the live chat and I don't think Nikki's gonna be able to make it to this chat but we're gonna go over that pool request I had mentioned yesterday some of the things I needed to do with the routing Nikki reminded me that there was already a pull request there that was trying to fix the same problems so apologies to Nikki for me forgetting about that but I did review the pull request I have it on a branch here locally and it looks good it looks I think it's gonna solve all the problems that I was talking about yesterday so we're gonna merge that into the master branch and we're gonna try it out with some of our more difficult routes make sure everything works alright I'm also going to take you through the logic of it and we're gonna try to find any areas where we could make it faster more efficient where we could clean up the code if if at all possible and that's the plan for today I do want to let you all know well we're kind of waiting for viewers to get here that I received a job offer yesterday afternoon so I'm not gonna share details at least not right now so anyway so I received a job offer so I have a lot of thinking to do about that but I know that some of you have been following my kind of process of interviewing and things like that so I just wanted to give you an update yeah so I will I will be giving you more updates as things happen and Blake asks if it's a bigger company I guess I think like in terms of total employees I don't think it's as big as the University but like geographically it's more spread out so there are multiple locations where does the university is mainly just one location with I mean we do have a campus in Austria so I guess it's two all right ib shik is asking about CSS we're not gonna do a lot with CSS today but we do use CSS you know somewhat frequently so if you check out some of the other streams as well we'll get into that but you know if you want to stick around today we're you know we are gonna do a lot a lot of other stuff Blake asked if it's a web developer job yeah yeah it is you know basically doing a lot of the same stuff I'm doing right now I'd still be working with react which is cool all right well let's get started and mites all right so now you should be able to see my screen if you want to check out the pool requests that we're about to merge you can go to the repository under pool requests currently it's the only pool request that is not merged so it'll be easy to find and the particular file that we're really worried about right now is server j/s so we're gonna spend all of our time in server dodge as there are a few other things that think need will probably end up just getting rid of them because there was some test things here like you can see hat and hat list Jas so there are some test things just so that Nikki could illustrate near the new features that he built into this pool request so we'll probably get rid of those at some point today let me start my Pomodoro session so for those of you who are new I'm not sure how the stream goes I break things up by Pomodoro session so I will start this clock it'll be 25 minutes for 25 minutes we're going to go through the code I'm gonna not really look at the live chat that much during that time so I will glance at it occasionally but after that 25 minutes is up I'm gonna take a five-minute break go back to the live chat and go through all your questions and comments and then we're going to do another 25 minute session of code after that the whole rest of the stream will be question and answer so if you ask a question and I'm not getting into it right away please be patient and I will get to it you know within you know the longest you have to wait is is till the end of the stream I suppose and if you can't stick around to hear the answer you can always watch the recording and for those of you that already watching the recording later on you can ask me questions as well in the comment below and or in any type of social media that you like I'm on pretty much all the the main social media channels so just find me somewhere so I can't always get back to everyone right away but I do try to get back to everyone at some point all right so enough about that let's just get started so I'm not gonna start and rock yet whenever we get this merge then I'll start and rock and right now it's just not I mean I guess we could start it and it would work all right so what I've done so far I've made no changes to the code manually but I've just merged what we had in master because master was a little bit farther ahead than this this pull request so I merged everything in master into this alt router branch the OL trout er branch is not in the repo right now and I won't push it to the repo because we're gonna merge it right now it'll be part of master so what did change from what's in the pool requests are some of the the routes in here see so we we have a route name search that will be in there so just a few minor changes so I'm gonna increase the font size make some room and then step through what's going on and then that way as we step through it maybe we can get an idea for ways to improve it although nothing against nakey this is really genius I love this but if there's a way to make it faster refactor it a bit then we should take the opportunity because this is a key function every single visit is going to go through this function for every page view so if we're gonna find one spot where refactoring is gonna have the most value it'll be here so anything we can do just to make it just a little bit faster will have a huge impact you know when multiplied by all the visits you know which will get which which will be millions over the course of I think over the course of a year we're getting I don't know four or five million visits so you know it's not like we're you know top ten site in the world or anything like that but it's a lot of visits okay so here's our object so if you have been watching when we've done things about the router earlier then you you know what's going on here but if you haven't basically this object we're listing a lot of routes so this value here is what's going to come in through the URL so in this case you know I'm doing this locally so it's localhost 3000 slash if you went to slash faculty we're saying go to that component the page component called faculty that's what we want to render and the data type is faculty so we're telling the router what component to send this data to and then we're telling it the data that actually needs sent and then with that it's going to go through a graph QL query to WordPress it's gonna get the data when the data comes back the component will render and then the user will be able to see the data the reason that we are doing it like this and it looks I mean it looks a little messy right honestly is because we have to keep all the routes all the URLs the same from the current site the old site to this new one that we're making so in order to do that you know we need a lot of control over what the routes are so we couldn't just use a built-in routing solution that comes with next chasse you know or even you know trying to use a different routing solution you know may or may not have worked but it would have required a lot of customers so we're just you know basically doing everything custom you know within express within our server dodge as file one thing that I think would be good as this gets bigger is to put this into its own file and just import it in so that's actually maybe I'll make an issue about that and then that'll be a really nice like very easy pool request for somebody to get if you're looking to get some pool request you're getting a profile especially if it'll be like your first pull request so maybe I'll save that as an issue all right so let's to actually step through what happens when you go to somewhere on the site so we'll go through an easy example first so if we go to slash search let's just assume we went to slash search it would go here and you know server get would fire off and we would do we're checking parameters right so in this case we only have this first parameter okay so the other ones there's there's not going to be anything there right we are making sure all the parameters go to lower case and yeah okay so if the parameter exists which is pretty much every page except the home page then we're going to take it you know put it to lowercase otherwise it's going to be null and it's the same thing for each parameter so it's either going to be null or it's going to be the lowercase version of that part of the URL we do have some things that we want to we don't want to do anything to in terms of custom routing so any files that have these parameters we're just going to let them pass right through and we're not gonna do custom routing otherwise we're gonna go down here and we have a few things so we have this default page route and that's just kind of a it has minimal styles it's our default component to display data we do have more specialized components to display certain types of data we also have our site if the user doesn't specify a type they're going to take the parameter and then just add pages onto the end of it and that will be the type okay we've done it like this because this is the naming convention that I'm using for data types for for a lot of the data types not all of them make sense to do it like that but enough of them do that this is a good default and will save us you know some space in our object and then the subtype and the ID or no for now and they will be given a value if they exist in this case when we're just doing the search route they they don't exist so actually let me let me know if anyone's still there I haven't seen anything in the live chat for a while and that's weird everyone's usually more talkative so it's showing that there are viewers but there we are okay that's something new I was afraid that the the stream cut out or something okay let's see all right hopefully y'all are still with me let me know if I need to explain something else you know over again if it's not clear so now we're really getting into the logic of things here so we're gonna filter out this is kind of interesting let me make this a bit bigger as well okay so we have an object right and normally you don't use filter on an object you use filter on an array so what object got values does and we're doing that on our params object that values returns an array of the values of the object so objects are our objects have key value pairs we are just getting the values and then we're filtering and we want to know if the length is equal to 1 all right why 1 because 1 we were checking for one parameter and the the comments in here that that Nickey put in here are really good to explain what's going on so we're actually this will pass this this if statement will pass for what we have right now and if we had two or three parameters it would fail and we pass to the next one so if if they find so we're looking in that translation object so if we find as a key the name of that which would be searched which is in our translation object then we'll do what's in here so we're gonna get that search and then page right so within our search key we have a value so we basically have another object in there and then we have another key called page the value of that is going to be the component that we want to render this to and in this case we want to render it to the component name search okay so it's gonna find that and then it's going to check for this next if statement so if the value of page actually I'm sorry first it's just checking if this exists so I was I was getting ahead of myself so it's just checking to see if the page value exists for that then it's checking to see if the page value is an object if it is an object we want to get the default value for the object and this is some of the new stuff that's been at it in Bini key in this last pull request so what we're doing by making the page giving the page the option to be an object is that we can have the same route render to different components depending on the number of parameters so if it's one parameter it does the default but in this case we don't have a default on search so we're gonna drop down to this else statement so if there isn't a default but there's still a value there then it's just a string so we're just going to take that string so the value of page now becomes slash search the string slash search and we drop down to find our type and in this case I don't believe we have do we have the type let me double check our objects I don't think we have one no we don't so in this case with search we don't have a type we don't have an ID so it's just gonna pass down right we're gonna pass over that elsif over that else--if okay we're gonna pass all the way down to here and we're gonna render in cash and we're sending all the data that we need and where's a rendering cache there we are so within this function I'm not gonna go over this because this is a new stuff but basically we're checking to see if we have that cast already the actual markup rendered and cached on the the react that the node server where this lives if we do have a caster Rd great we just serve that up no need to go grab the data anywhere no need to re render it just goes right out this is best-case scenario the user is gonna get a near instantaneous response if it's not cash though then we're gonna send it through we're gonna render we're going to call this render to HTML and so we're gonna send all those query params and then that's when everything's gonna happen like I explained at the beginning where you know graph QL query is gonna go get some data from WordPress and then it's gonna render so the only difference if we had more parameters is that it would skip over that first if statement and would drop down to this else else if if we have two parameters and then it would get let's see there's a second frame coming to play okay there we go so something with two parameters then gets this value of we grab the page standard so instead of the default page we want to render this using a different component which we're going to give the key of standard and then if there are three it looks like this isn't finished yet so I don't think Nikki has finished this part yet so you know we'll need to grab we'll find an example of something that's three parameters we'll copy and paste a lot of this and then set it up see if we can get the three parameter thing to work okay I feel like I need to take a breath after that let me take a drink I have my G fuel handy as I usually do and alright I'm gonna quickly check the live chat to see if I lost anyone okay it looks good so in about ten minutes I'm going to come back and answer questions in in the live chat right now what I'd like to do is find a route I want to find a route where we're actually going to use some of this functionality and then we're gonna build out the rest of it so I guess we could this is entirely functional right now so let me merge this with master push it to github and then you'll have everything there to look at all the code so let's do that now so I'm gonna go back check out so we're going to check out master now we're on the master branch and I'm gonna do a git merge and we're going to merge that alts router branch I've already merged master indle router so there should be no merge conflicts going the other way I always recommend doing that so that you can test everything out while you're still on that that branch I think it just makes things a lot easier especially if there there is you know there are weird things going on I mean if if nothing weird happens it probably takes a little bit longer but it's worth it in case it messes everything up then you can just abandon that branch start over much less of a mess so let's merge awesome we merged everything went well and now I'm gonna do git push so now all of this new code is there and I said there is some stuff to clean up so we may or may not get to that the actual clean up stuff because that's not really exciting it's a stream so if you do notice at some point that things still need cleaned up and you'd like to get an easy pull request you know feel free to do that I just I'd like to help you all who maybe haven't gotten very many pool requests in or none at all to be able to have you know get your first pull request in and get your practice in on something like this where we can I can help guide you through it if if needed and then you know build up your confidence a bit and then you can go off to other open source projects and you know and work on those is I know it's really intimidating to get that first pool request in on you know someone else's project alright so I need to go let me find I think I had a window open on my other screen that was a good example of the yes I do all right all right let me check this page out so academics undergrad majors currently works and that has three parts let's see where I have it going right now so I think I had two I think I had to mess things up a little bit to make it work actually let me I do want to restart this too just to make sure occasionally I have trouble when making big shifts between branches that some of the old code it remains so before I started doing anything I'm going to check this out okay all right so for that academics page is working what about our other academics pages okay no wait let's try to the our other academics pages so in our drawer if we should have a list of all the links in that side drawer and that's what we need to change here to do our tests sure menu [Music] bar so data yeah it is your menu okay all right so under academics you can see here we're passing in undergraduate so here's the URL that is typed in and then we're passing in here as page type academics pages ID majors okay cool so we are passing in everything that we need here so let's try passing in what we need from from this one so yeah page type academics pages ID graduate graduate programs the reason we're doing it like this has to do with our client-side routing so you wouldn't always have to do this all right let's save that and come back here and click this now okay can't really you know that undefined all right I was kind of hoping we got an error I didn't want it to it's not as fun when everything just works all right so first thing to check is within WordPress make sure that we actually have a page that fits this description we may not that might be the source of our error okay almost time to go back and answer questions okay cool so that's working my phone keeps thinking that I'm talking to it and it keeps coming up with you know the Google thing Google assistant alright cool so that is working awesome when we come back I'm gonna try to solve I'm gonna try to load some pages that I've been having issues with and make sure that our solution can handle that because I was I was wasting significant brainpower on trying to figure something out the last day or two so that's what we'll go to if if it passes that test let's say then I'm really confident that this will work for us so we can move on and build out what we need if we happen to get three three parameters in our URL okay so it when we just did this it was I don't want to say it was a little bit of a cheat but we were feeding the router exactly what we wanted what we want to do we're gonna do next though is users are gonna put in a route and it could be essentially like we won't be feeding the router the ID and the type and everything like we're doing in that list so we want to make sure it can still pick out these different parameters and go where it needs to go oh and I lost the live chat window where is it okay I found it I have live chat windows open for the last two weeks of streams I really really need to clean up my my tabs as soon as I update Chrome the wall go away okay let me set this short break and scroll up and get to the chat it's kind of quiet in the chat today and I that's not necessarily a bad thing oh cool I have so mad Dutchess says congratulations thank you if you missed it at the beginning I got a job offer for for a job last yesterday right at the end of my day at my work day I got a job offer so I'm considering it among other opportunities so I'll keep you all up to date on you know what happens and how it's gonna affect the stream but I just wanted to share that with you all since you've kind of been with me along this whole process of interviewing and things let's see Blake asks what do you think about view as it looks simpler than reacts I haven't used view so my opinion on you is not going to be very reliable let's say but I've seen enough def so that I respect and that do good work using view that I can be you know pretty sure that view is a solid product and I think it's a good alternative to reacts for whatever reason you met you may not want to use react so can't speak from experience but from what I do know I I think it's it looks promising it looks good I'm sorry I was a little distracted the head of my department just sent me a text okay when when your boss's boss messages you you got a you got to read it see Omar says the beard looks nice thank you I appreciate it it's getting a little bit longer I'm gonna get it trimmed tomorrow I'm gonna go get a haircut and the beard trimmed up so it's not gonna be that much shorter but it's just not gonna look at scruffy I did comb it this morning so I appreciate you noticing it's getting to the point now where I wake up and it's it's like wild and it looks crazy so if I don't comb it it's I mean it really looks like puffed out and wild Mohammed asks what software I use I'm using Visual Studio code as my code editor and my terminal that you can see in the background is I term - hey Nicki's here awesome Nicki I thought you had family coming over hopefully if your family comes please don't watch the stream anymore hang out with your family if you are still here though I just want to let you know that your your pull request is awesome I really really like what you've done I'm I'm pretty sure it's gonna solve all the problems so really really good work I very much appreciate it it just took a big load off of me that I kept thinking of how I was gonna make this work not realizing that you had already solved it so thank you again craftsman oh six says can you shout on my channel sure so I assume your channel is just craftsman oh six so there's your shoutout I don't know what your channel was about so I I can't really recommend it to anybody since I have no idea what it's about but if anybody's interested in you know figuring out what that channel is check out craftsman oh six bosses here hails us how's it going see John's here how's it going John well Leeds here Wow hey I'm Justin say hey to everybody there's a lot of people saying hi are in it in a sense that's great news thanks Anna yeah it is it's it's great I have a lot of decisions to make now so I'm really happy to be in this predicament of having to really think and make some decisions now it's a good problem to have so yeah it's it's exciting Jason says congrats you thank you old sauce also says congrats says is this the job where you had a three hour long interview it is it is that one I begun to think that I wasn't gonna get an offer because a decent amount of time had gone by and I hadn't heard anything so it was a very good surprise when I got that it was right at the end of yesterday stream raid at the end of the stream I got during the stream I think but I just hadn't checked my email then and as soon as I ended the stream I checked my email quickly before I had my next meeting and I just saw it briefly got a chance to just scan through a little bit before my next meeting and then I was sitting through this other meeting just like I couldn't wait to come back and read through everything about the about the offer so anyway my timer is up so Mahmud says hello from Turkey ah so you do it awesome thank you thank you I appreciate it and welcome let's see jason says decisions on framework seemed to come down to team / project rather than features one has over another yeah honestly it there's a lot of different decision decision points that go into what tech you're going to use what stack you're going to use so yeah I guess it's not always just simply about let's compare feature by features so yeah there's a lot of them I've had to make a lot of decisions on what stack we're gonna use and there there is a lot more involved so luckily I've been able to kind of work my way to a point where I have a lot of freedom with the stack this tech stack that I choose and a lot of people are in that position so I do appreciate that I'm in a nice position there it's not everybody's in okay let's go back let's reset this timer we're gonna get in at least one more moment or a session and CNN video says I'm new how are you I'm doing really well today how are you doing also welcome thanks for watching and that's going to be the last comment that I read until after this next session all right so we tried out a few routes now here is where the the bigger test is gonna to play so let me I'm still trying to find on my other screen the routes that were giving me problems okay I think I found one all right so in our server dot j s file we have theology and right now it goes to the page major to render with the type of majors okay all right I've we are gonna have to modify this this function so what I need is just like how we can have multiple IDs and pages we need to be able to have multiple types I do I need the ability to pull from different post types all right so let's let's do that so right now what this is doing is if you go to the page slash theology it pulls the the post type with the the slug of majors or I'm sorry with the slug of theology from the post type majors and it renders that using the component major but then what's going to happen is we're gonna have a route and it'll be slash theology slash like online Associates is one of the routes what the the problem that is there is online Associates is going to exist as a from post type so it's not it doesn't belong in the the majors post type so that's where we need a change so let's go down here and see what we need to do apologies for the awning that's you only need to do to make that happen i I just I kept thinking it's this is so easy it's everything's working I knew it I knew we were forgetting something and so let's see where this is so the type so we're grabbing a default ID second frame all right so we're definitely going to do this in the second per am spot it makes no sense to do it with the first program so second program and where we have the type okay so the type now is going to be an object so let's grab all of this copy it now you know what I don't think I'm gonna copy it all because I wanna oh yeah I guess I can let's copy that and let's paste it here below this so we're gonna have to change everything here to type all right so all of that is tight and then let's keep this standard all right let's use that and so that way it'll be easier to kind of tell like okay if we have two params for both page and type it's both gonna be standard we may end up changing yeah maybe we can change that so Niki had mentioned about like the naming he wasn't really sure about the naming so for now I'm just gonna keep it the same because we all know the hardest part of coding is deciding what to name things well let's just keep it the same and let's remove this now and now what we should be able to do is go up here and put in or as I add theology so let's do it like this let's say we're gonna use the page type a major actually you know what I do want to keep it as major so I just glanced at how this page is structured on the current site I think we're gonna structure the same way but we are gonna change the type so Rd we're gonna have to do a default side too are we yeah okay the full type is majors and our standard type is going to be theology pages and we haven't even made this type yet so I'm to test this really I'm gonna have to go to make that I suppose okay and then our ID all right we're gonna need let's let's see I need to go back down and see how we're handling IDs to see if we need to change this but for now I think this will work we do need to add something to make this default word see if I'm jumping around too much please let me know if once I do this and we see if it works I will go back and you'll explain more but I'd rather not explain something that's broken in that way you know I may be misleading someone and I'd rather not do that so our default okay we need to add default type here so let's take our type and since we're now using standard and default there we are okay all right that should work and let's see what's going on with the ID shows our first program ID first second to him okay so we are going to get the the correct idea it looks like that'll be fine we won't have to change anything so I'm gonna save that save that route let's I guess very quickly add theology pages let's see where I I don't think I brought that data in anywhere but if I have already it will save us some time let me just take a second to look so on my other screen I have my WordPress admin panel open if you really want to see that let me know but otherwise I'm just searching for this content within the admin panel this may be under sociated programs now hmm okay I don't think I have this here all right um how much let's see if I have enough time I think we have enough time for this to work maybe or we could just try a different page where I already have all the data how about that okay so first let me see sorry I just quit talking the middle of a sentence okay so I double-checked we do have some data that should work I'm just changing yeah changing the slug so it will work for us okay so I'm gonna test the route just to double-check that it won't work with our current system whoops what it works okay how does it work I guess who's it as the same content-type all right how about this alright here's what I'm gonna do since I'm having trouble finding a suitable piece of content to test this with and I don't want to take up the rest of our time in data transfer which is really boring let's build out the rest of what we know we need and this is this is weird do we really need that now I'm wondering do we really need these this part yet like how did this what I'm wondering is how did this even work all right let me try out a few pages to see what's working and what's not working I forgot these links are not gonna work for us yes we can make sure some links still work okay there's a route that's usually - and that still works I think we did some of these routes okay so here's one that okay so it's it's giving us this page isn't giving us an error but it's not taking us anywhere else so it's giving it this should be the page URLs admissions Franciscan difference undergraduate but what is giving us is the same page as if you went to the URL admissions undergraduate so it looks like it's ignoring that second bit and just giving us the first two so we will need that third you know this third one here and we need a way to handle those routes I wish our URL structure were different but this is what we have so we have to make this work so let's go now all right okay so we have our filter here three parameters page first for him so type second for him okay all right so let's see where I need to go from from here to here all right so we'll start by a copy and pasting you know what we what we already have and then we just need to modify it a bit so we're gonna instead of standard let's say thirdly this it doesn't really matter at this foot so see the ID is gonna be third per am right and the tight the first frame is still under graduated I'm sorry that's it says their friend Heidi say alright let me go go check the live chat quickly see if anybody has any ideas for this Shanxi modification Association AHA Jackson okay five minutes okay let's see let's walk through this and see what we need in this specific case let's check and see where this this content lives at in in WordPress hmm okay so currently this content has has come in under the same content type as the rest of the admissions pages so let's see what rain in admissions pages I think it's up here oh we're not even doing anything okay that makes more sense as to why it worked okay yeah so admissions phages we're working fine without even having to put them in in the object because they fit the default pattern for tight and they use the default component so we didn't need anything in there so since since that was the case it would always just take whatever the last thing is as the ID okay so we are gonna have to change that so let's grab something that probably end up being similar a few departments you all right let's do that and let's put it down here let's say let's get rid of hats right now while we're at it okay so this would be admissions page they page like the admissions pages ID the fault of admissions I don't even know if we have a page that's just admissions oh hey we do okay so yeah so by default it'll just say admissions otherwise what was the other one standard alright so if it's if we don't have a standard ID how do we use that standard ID before with theology right tell G pages just in your type all right with this change let's see what works and what doesn't work okay so that doesn't work now which makes more sense okay all right so that's not working now commissioners case I page the admissions pages - two parameters second program is the ID okay this should be fun it should be getting the right site and then don't ID as I should have a second for him okay so it's not working I guess because of the ID thing so alright so I think it can't handle right now the ID as an object so we're we're just going to change this up a bit so that I can handle that whoops ID and this is gonna be standard and now we can get rid of this and I'm ready okay I'll shred it out now see if we can get this to work No okay so if JD objects during else oh you know what I'm not we need to add in more checks all right let me go back to the live chat here and because my my point over time I ran out okay so let me let me just explain quickly what the next step needs to be and why this isn't working and then I'm gonna go back to the live chat and answer all your questions so what we've done is we've given it the ability to handle the ideas and object and the check for the ID you know dot standard but what happens if there is an ID object but there isn't an ID dot standard so in that case what we need to do here is after we do this this check you know if it is the type of objects and we could probably just put an an here and there is this ID standard that exists then what we want to do is set the type to standard if that's not the case though so we need a else here I guess we already have the else going here so if there is the standard type equals first frame ID okay so this one was checking to make sure we could still use a string as the ID so that's not 100% necessary we could potentially always have an object then that would be okay so just for demonstration purposes let's take this out so let's say else meaning there is no stand there is an object but there's no standard key on that object type is going to equal second / am let's say that and see if I know what I'm doing no and I don't I don't know what I'm doing unfortunately cannot create a feel an undergraduate on type root query he yep not sure what I did there now so we won in the right place here go on the right place here this should just be ignored hmm wait a second the IDS already second program so we're still in there is an ID and then if it is an object and there is standard it does this let's take this back for a second yeah so that wasn't gonna run because we're saying if there is an object so we need we need to pull this out that was my mistake that was bad logic on my part so the idea of what I'm saying works but I put the in statement I combine those if statements and I should not have combined those if statements sufen is an object we're gonna say they were going to check to see if this is a lie if statements then side standard else it's gonna be done I don't need the else right do anything else let's just put let's put the Elson just to be sure all right let's see if that works this is the last thing I'll try whether or not it works I'm done and I'm gonna go to the live chat I'm feeling that point where my brain just needs a break anyway one more hard refresh alright didn't work okay so mission not accomplished today we did get some things working that weren't working before and then I broke some stuff that was working so I guess kind of a win I mean like all in all I think there are more pages working than we had when we started so we can we can be happy about that I wish we would have figured out what's going on here but it's just not gonna happen right now so I'll work on this some more today hopefully I'll have it fixed by tomorrow and if you have any questions please put them in the live chat right now I'm scrolling down through and I will answer everything in the chat here's a question from Blake I need a new laptop what should I get Lenovo ThinkPad vs. Dell XPS 2 1 vs surface pro 2 3 with at least I 5 8 gigabytes of RAM mad Duchess says the surface Pro's seems powerful little experience with it but look it feel beautiful Dell was always decent powerful so I'm an HP girl myself I always have leg on Lenovo no matter the specs I had Duchess also says Dell has never let me down I've had four different lenovo's two laptops and two desktop always the same lag issues I'm a bit of a tech geek I have three Dell machines all beautiful and powerful never miss a beat don't have much experience with surface pro my dad has one and it's nice but I don't use it enough to give a full and accurate UX UI opinion on them all right cool that was super informative Matt Duchess thank you for that yeah I don't I've been using Mac's primarily now for about two and a half years so I I don't think I'm I've been out of the PC world for too long the the Microsoft world for too long to really know what's going on there John says I just got a new Lenovo yoga 9 20 set up most of yesterday loved it installed Visual Studio code just now impressed love the stylus for my art 16 gigs of ram one terabyte solid-state drive that's cool congratulations on the new computer John let's I'm using Oh Nikki I didn't realize you you had switched accounts alright I need to go back through and read some of this now realizing that Nikki switched accounts oh I see now where you told me you switched accounts it all makes sense now see there's some more discussion about different pcs so I'm kind of skipping over a bit hi John says I really think today Jessie you've got my brain fried usually I can follow I can kind of follow lol yeah today my brains a bit fried too it's yeah it's uh this routing stuff has been really tricky every time I think I haven't figured out I find a different URL on the main site that just won't quite fit with what we have so yeah I'm gonna I I may actually like draw some of this out on paper to help me visualize what's really happening that may help me yeah that really meant might help me see the big picture and not mess things up so that's going to be my next step here after I in the stream also says how to use enric in my projects I would I don't remember exactly how I set it up initially cuz it's been a while but check out the instructions on how to use and grow it's not it's just a command-line tool so you would in terms of what you're going with your project nothing in your project would actually have to change at all so this would just run right alongside your project Zubin says what coding style slash guideline do you follow I don't see I see you don't use semicolon your JavaScript I was following his style similar to yours and got a hard time from a co-worker yeah I follow standard jazz I don't like using the semicolons seems to me that if there's a character that doesn't need to be there then it's inefficient to keep putting it there and the circumstances where you actually need a semicolon and JavaScript are very rare if I were to come across one of the circumstances and I would use a semicolon but but I don't need to so some people are very strong opinions about semicolon so I that's probably you know where your co-worker was coming from there personally me I it doesn't matter if you use semicolons or not but if you're working on my projects and you try to commit it'll automatically remove the semicolons so you can do it however you want and then it's going to get turned into the way that the standard way that we're using but yeah the way I see it you can use them you could not use them if there's a certain way you have to do it for a project and yeah follow that way or set up some sort of automatic formatting so that you can type however you want and it'll get formatted the way it needs to be and it says how was your day Jesse pretty pretty good so far that in last night was rough cordelia my little one she's one and a half and she was sick and she just wanted me to cuddle her last night so I took her and she was just coughing and up a lot and then you know he got a baby right next to you trying to sleep was like I'm always waking up trying making sure she's okay you know even when she's still sleeping I'm waking up and I woke up in the middle of the night and felt her leg or leg felt really cold and so I was like freaking out like oh she all right so I'm trying to listen for a breathing and I couldn't hear anything so now I'm really freaking out so then I like grabbed her and she moved and so I was of course very relieved but then you just have that adrenaline rush right so you it's hard to go back to sleep so I didn't get that much sleep I still have my sore throat I don't know if I I haven't been feeling well unless I guess it's been a week now just kind of sorcerer sluggish tired so anyway I woke up kind of late didn't get my workout in but I was able to get into work about quarter after 8:00 a.m. which is pretty early compared to you know everybody else in my in my office here so it's kind of nice to get in like that and yes I guess it's been a not a bad day so far yeah I'm feeling good a little tired but I'm feeling good otherwise thanks for asking how was your day a noble and savage says you sexy bearded coder that's probably the first time anybody's ever said that phrase to me congratulations that's you are the first and I really that's a great way to describe me I think so anyway hey noble savage how's it going [Music] Matt Duchess says brain fry happens but it's good it means we have something new to learn yeah hopefully like when you work out your muscles get sore and then they get stronger hopefully your brains like that too because I'm about to get really stronger in my brain this my brain is super fried right now John says you're gonna have to show us your artwork the big picture oh if I draw something up I will show you but it's it's not gonna be that great my artwork skills are minimal and that's like putting it nicely alright well I think I'm gonna end this dream now and probably take a little break to rest my brain before I go back at this let me think what's going on tomorrow I'm gonna try to stream tomorrow if I can I have a couple of meetings and things going on so I'll try to I'll try my best to fit in the stream tomorrow I'm not sure what time I'll be able to do that yet but hopefully we will be able to have one and you think yeah and that's it for me thank you all so much I really appreciate all the help thanks for hanging in there when I was just confusing my own self and until tomorrow have a wonderful day