Joel Clermont (00:00):
Welcome to No Compromises, a peek into the mind of two old web devs who have seen some things. This is Joel.

Aaron Saray (00:07):
And this is Aaron. I don't know about you but I've been in a place before where I've been programming and came across some sort of challenge or a bug where I couldn't seem to figure it out. You're writing the same thing in your application and it's just like, "How is this going to work? or, "Why isn't this working?" Honestly, probably the number one area that's happened to me in the past has been with either JavaScript or CSS. Where I'm looking at something and I'm trying to write some CSS, and I've done my work, I know how it works, but every time I go and put something in it's just not working as I expect.

Joel Clermont (00:52):
Yeah, I might call that you're stuck. Like, you tried a few things and you reach a certain point you're just kind of spinning your wheels. You're like, "This isn't helping anymore."

Aaron Saray (01:01):
Yeah. I mean, we've talked before. There's a number of different ways you can talk to your team and you can do some research online or whatever. But there's a technique that I do that I've shown a lot of people that, well, as soon as I explain it to you you'll be like, "Oh yeah, duh," but it's really hard to catch it in a moment, right?

Joel Clermont (01:17):
Mm-hmm (affirmative).

Aaron Saray (01:17):
So this idea basically is to take out your challenging code and start fresh in something brand new. Basically you're pulling out the challenging part or the part you're stuck on from the main project and kind of remaking it or duplicating it in something that's fresh, brand new, that has no legacy around it, that has nothing going on so that there aren't other things affecting it. For example, let's just say you return to, I don't know, style some sort of input box or something and it's not styling right.
Well, the first thing I usually do when I get stuck there and I just can't figure it out is I'll go and I'll make a brand new HTML file. I'll put maybe the basics, like if we're using something Bootstrap or something, and maybe I might import Bootstrap, maybe. Then I'll make an input box maybe with the surrounding label if that's part of the issue or not and then I'll start writing the CSS. Basically, there's a couple lines of code there's really nothing else in the way. And I start to build this out and say, "Oh, do I really understand what I'm doing? Is what I'm writing actually real or am I writing it wrong? Or is it something else in the application that's affecting it?"

Joel Clermont (02:30):
So there wouldn't even be Webpack or Vite or whatever you're using it. It's literally just like, "I'm going to pull in the CDN script and I'm going to do the simplest thing to make sure that at least my assumptions are correct in the basic thing I'm trying to do."

Aaron Saray (02:46):
Yeah. Because I found a couple times you run into one of two things, either one. The first one usually, hopefully, the best solution is, oh, you don't actually know what you're doing so it has nothing to do with the rest of the application you just haven't figured out how to do this yet. So when you're in this very simple place there's nothing else that could possibly be affecting it. I don't know, I've taken on many different legacy applications and when you start working on something, you're like, "Oh, I'm making an input box. Why is it suddenly bold?"
And you're like, "Oh, well, I got to track this down seven layers into different imported CSS files and stuff," I don't know. So when you start over afresh and new, you can kind of say, "Oh, I do know how to style this input box, it must be something in the application." Or, "No, I don't know how to style this input box." So that's basically being the first thing is like, "Oh, do you know what you're actually trying to do? Have you figured out how to do it?" And then the second thing is you might figure out, well, there's something in the context of the application that I have. So that kind of goes down the route of basically then I'll start to try to remove everything I possibly can from the current application-

Joel Clermont (03:55):
So now-

Aaron Saray (03:56):
... back here.

Joel Clermont (03:57):
... you're back in the real application, it's like process of elimination. Like, "When does this thing start working when I remove these 10 other things on the page?"

Aaron Saray (04:05):
Yeah, exactly. I'll basically try to bring in what I've just done into the normal application. So if it's a huge blade file or something like that, I might just delete everything in there. Just temporarily, of course, thank you Git.

Joel Clermont (04:18):
Great skill.

Aaron Saray (04:18):
And just put in my little bit of code there that I wrote. Maybe it's staged in TMLC, it does existing CSS affected or not and then kind of go that process.

Joel Clermont (04:29):
Yeah, that makes sense. In fact, I kind of remember doing that with you recently where you had built something and then I was working on getting it up in a prod environment to demo and it wasn't working. This, I think it was the CSS or the JavaScript. It wasn't even building, running prod was failing with some weird error. So we did that and we figured it out. We did it locally and we kind of eliminated things one at a time. And it was a pretty useful exercise because at the start of it we're like, "I know something's breaking it, I just don't know what it is." And it was something weird as I recall, but we figured it out that way.

Aaron Saray (05:04):
Well, and let me make sure I clarify that. You kind of said it one way and I think my point is there's ways to do it a different way. You said I started eliminating things one at a time, I'm actually preaching starting a little bit differently saying start from nothing and add things one at a time.

Joel Clermont (05:18):
Oh, okay.

Aaron Saray (05:19):
There's two different processes there because you can get stuck like, "Oh. Well, if I remove this, whatever." So when I talked about removing stuff from the Blade file that's not where I went first. I started out with a brand new plain HTML file, found out I know what I can do in this clean environment, now I'm going to remove everything I possibly can in order to still get the app to load barely and start adding things in there.

Joel Clermont (05:41):
I think in the case I gave that example. Because it was a build issue, you couldn't just start with an empty thing. Like, in this one particular context, it was the combination of things so we had to go the other direction. But, yeah, I like that idea because otherwise you might be in a dead end. Like, if you're assuming this thing should work this way and it's not working that way, and then you're like, "Oh, maybe it's some other related thing in this project," and you go down that path. It's like, "No, your initial assumption was wrong," you need to figure that out and kind of doing it in a clean slate seems like a nice way to try that.

Aaron Saray (06:14):
There's another example I ran into recently with a friend who's working on a product and they're having an issue sort of getting something to work. Had to do with mobile and various different things. And it can be a tough situation to kind of test out locally.

Joel Clermont (06:29):
Sure.

Aaron Saray (06:29):
So basically there was this idea that you could only do this... We could write it and we could push it to prod and see how it works. I don't know, that's... Nope, don't do that.

Joel Clermont (06:40):
Oh, it sounds like the approach you'd love, Aaron.

Aaron Saray (06:42):
Right. The other suggestion I had is, "Do you really need to go and add this to your mobile app that thousands and thousands of people are going to be using?" Or could you basically copy the app or even make a brand new one and add in this little bit of technology you're trying to figure out. Let's just say it's NFC reading or something. He put it in this brand new app, you don't have to even release it in the app store unless it really depends on it or whatever, used test flight or something like that and make a brand new thing where there's a button that says, "Do this thing." So you press the button it does that thing and then you can push that out and test it on phones and say, "This makes sense." And at least then you can remove at least some of the steps of having the cadet just testing in production.

Joel Clermont (07:24):
Yeah, that kind of has the initial benefit we talked about with the first example where you're doing it in isolation and you can really focus on the thing you're trying to test. But it has the added benefit of not messing with real users. It's kind of like another reason to do this approach is maybe don't push this to prod and potentially break something for somebody else or make the user experience worse or whatever. Yeah, makes a lot of sense.

Aaron Saray (07:53):
So I think the summary of this is, the next time you kind of get stuck on something, yeah, you can kind of work it in the current environment to you're in, maybe remove a thing or two. But if you're still stuck maybe start from the other direction and build up instead of tearing down.

Joel Clermont (08:08):
I like it.

Aaron Saray (08:14):
I don't know what the deal is but I have experience of people telling me that I don't know what I'm talking about. And it has really nothing to do with technical stuff and more just in life. So I grew up in northern Wisconsin and there's a town there called Oconto. And then around where I am now, which is a Milwaukee area, there's another place called Oconomowoc. And one of the things I do is... Oconto is very small, so I would talk to people and I'm like, "We're living in Wisconsin." They're like, "Oh, yeah, so am I." And I'm like, "Oh, well I'm from Oconto." And they would say, "Oh, do you mean Oconomowoc?" I was like, "What are you talking about? No, I know where I'm from." Like, why would you tell me I don't know what I'm talking about?

Joel Clermont (09:07):
Maybe it's a local pronunciation versus an outsider, like NAW-lins instead of New Orleans, and they thought maybe if you live in Oconomowoc you just shorten it to Oconto. No?

Aaron Saray (09:19):
I mean, yeah, that name was always fun too. Because I remember I was in a conference one once when I was really young and they announcement me, they're like, "Oh, Aaron." I don't know, I think they might have said my name when I wasn't paying attention. And they're like, "From Osonto."

Joel Clermont (09:34):
The C is?

Aaron Saray (09:35):
Yeah. And I'm just sitting there like not paying... They're like, "Aaron. Calling again, Aaron from Osonto." I'm like, "Oh, do they mean Oconto?" But one of the other things is I am allergic to pork. And it's pretty rare so I've had to deal with a lot of that stuff. So I've told people too, like, "Oh, I don't eat pork." And the number one response to that is, "Oh, are you sure you're not Jewish?"

Joel Clermont (10:07):
What?

Aaron Saray (10:07):
"What? Yeah, I know for a fact I'm not."

Joel Clermont (10:15):
That's one of the founding principles of Judaism, is having to be allergic to pork. Wow. Yeah, I can see how that'd be a little annoying, Aaron. I sympathize with you.

Aaron Saray (10:25):
So I think that's why I think I've turned into a grumpy old man now. And like, "Don't tell me what... I'll tell you my..."
Have you tried following our advice and you're still stuck though?

Joel Clermont (10:42):
We don't want you to suffer alone. You can contact us for help on our website nocompromises.io. Click the button to book a call and we'll see how we can get you unstuck.