Logging × Blogging × Testing × Freelancing

Welcome to Syntax. We got a Pollock episode for you today. This is where you bring the questions. We'll bring the answers. We've got some really good questions today on login, blogging, testing, freelancing, JavaScript.

You name it. If you got a question you'd like us to answer in a future episode, go to syntax.fm.

And in the top right it's not even I always say top right hand corner. It's it's very close to the middle now, that button. So, hopefully, you can still find it, but it says potluck queue.

You click it. Bring your mouse on over. Click it and put your question in the box, and we will answer it on a future episode.

My name JS Wes, developer from Canada. How are you doing today, Scott?

Hey. I'm doing good. I got some yard work in. Feeling really nice to be outside. You know? I I found out that half the things in my front landscaping were weeds that were just really they were like a lot of little tree sprouts and stuff like that. When we moved in to this house, it was clear at some point the previous owners had paid for professional landscaping. Right? So the landscaping at one point was very profesh.

But I do not think the previous owner ever got his hands dirty whatsoever because there's somebody, like, the trees were every single tree on this property was completely overgrown. Every shrub, everything. It's the exact same problem at our house too. Just like Yeah. What were they doing? The amount of stuff that Node cut out of here? Yeah. Kinda keep it on top of it. This guy had he he had probably no Sanity skills whatsoever because there's so many, like, little maintenance things that he did not do clearly. So, yeah. No. It felt good to clean up that stuff. I spent all day, Wes, pulling maybe hundreds and hundreds and hundreds of these little little tiny things out of our garden. Node it's incredible. It it looks like I could not even

I have never seen it look this good, so I'm I'm pretty stoked about that. We did that as well. And then about 3 days later, all the dandelions started coming through the mulch, which is nature's wild. Have you ever seen the, like, photos of houses in Detroit that have burned down, and then they I did.

Oh, yeah. You've been to it, I guess.

I lived so close to Detroit for so long. I went to a lot of break dancing battles in Detroit.

We spent a lot of time in Detroit. And, how, there's a Danny Brown song where he says house field field field field house. That's where I'm from or something to that degree. And it's there there was, like, parts of Detroit that are certainly like that. Detroit has some very lovely parts as well. But, yeah, it is it nature takes

over. It's amazing how quickly it it just comes back to nature.

Yeah. Yeah. What? Like, 20, 30 years? Yeah. You you you do the that. Like, the often, you'll see, like, a a house, and then, like, 8 years later, there'll be, like, a 20 foot tree that has has shot up,

where the house is too Bos. Yeah.

Let's talk about real quick. If if you want answers to any of the questions that you have in your code base, check out Sentry. Sentry gives you the answers for performance, errors, issues, anything that you could possibly have. It even gives you, answers for your metrics and user feedback if your customers wanna give you feedback on your site. Just about anything you could possibly want to know, Century's got your back. So head on over to century.ioforward/ syntax. Sign up and get 2 months for free. This show is brought to you by Sanity, and they answer all of our tough questions whenever we have questions about our code Bos. And you know we do. So shout out to Sentry for that.

Alright. 1st question, Roger Pnpm. I think it's worthy of an entire show, but I'd like to know more about logging from a site.

Console dot log is clearly a hot mess with Vercel, and I'm sure there is a better way to go. Help a nerd brother, please. Yeah. Yeah. It is weird. I found the logs on Vercel to be extremely difficult to navigate about. And it's not I don't know if it's it's definitely a skill issue on my part.

But logging is one of those things that I I've always liked to set up a really proper logging solution.

And I set it up, and then I very rarely use it.

It's never been one of those things that I've I've really, like, really decided to go hard in. But I have used, as far as logs go, I mostly used PaperTrail.

PaperTrail JS a really, really cool product for storing your logs. It's cloud hosted. The the UI is fine. You can aggregate and search through your logs and find the ones that you need specifically.

But at the end of the day, I you know, logging can only get you so Yarn. And I think you'll probably want more. If you're doing logging for, like, errors and stuff like that, I I would probably not really rely on that. I would go for something and and forgive me for pitching our own product.

But I would go for something like Century that gives you a much more organized throwing a proper error.

Yeah. Throwing a proper error and really categorizing it. So if you're talking about logging for errors, I would much rather use something like Sanity. If you if you think this is too silly, you can ignore this recommendation. But we used it long before Sentry took over syntax.

So yeah. I I don't know. I've used paper trail again. Logging is one of those things that could be really helpful. Like, let's say you have a cron job. You wanna make sure that cron job is executing at a timely time you know, executing at the correct time. You can tag your logs and all sorts of things like that.

So, yes, logging in production can be a hot mess. I don't know if I'd necessarily recommend relying on it for errors, but for general logging, yeah, toss a service like PaperTrail on there or I know there's a few others. Wes, have you used any of these services?

There's tons of them out there. No. I I don't. I I usually rely on the logs from my provider, to be there. Generally, the way that it works is that your hosting provider will maintain logs for however long.

Sometimes they'll say we'll hold them for a week or whatever.

And then if you want logs for longer than that because you need them for compliance or sometimes for security, people need to be able to reconstruct, like, access or or what had happened.

Often, that's why people will keep logs for a longer time. And and if that's the case, you often have to set up what's called a log drain, which is a totally separate service that will hold them on. And the reason behind that is because logs we just did a whole episode on, hosting large files. Logs are huge.

Huge. Yeah. And it's very expensive. You look at the prices of a lot of these logging platforms, they're kind of expensive because they have to hold lots of data because every single request that comes in, if you wanna be able to log that, then that's gonna be fairly expensive.

But, also, they then index them so they're quickly searchable. Right? So then they're putting them into these special databases that can hold billions and billions of rows and and are searchable in an instant. So there's it's a it's a quite a wild, a wild space. But in most of my applications, I've been able to get away with, oh, I I have the last 3 days, and I can just log in and see because, like, I do quite a quite a few logs. And if it's a if the application crashes, I see those in my Sentry. I don't even need to to do it. But if I need to, like, get some information on, like, a a Wes that's coming in that is not necessarily an error, but I wanna be able to see what's happening, then like like, for example, I was trying to figure out some issues with the IP address when you use Cloudflare in front of a Vercel server. And there's headers with Vercel, and there's headers with Cloudflare. And when you use a reverse proxy, those headers get overwritten.

So I needed to, like, see, oh, what headers are we actually getting in this case? So that in that case, I had to go and look at the logs in Vercel, and I actually find the Vercel interface for logs

pretty good. It's like it's live. You can refresh. You can filter. You can search. I find it I have a hard time finding what I'm looking for typically. Like, if I'm just going for, hey. I'm using the application. Give me a log for the current, like, session that's coming in. I found it to be easier. And so, like, render Render as a hosting platform. You click logs. There JS your logs. No more clicks. Right? I feel like with the Vercel one, you gotta do so many clicks to get to where you wanna go.

But yeah. Well, I'm on I'm on render for my application, and I much prefer the Vercel experience.

So we're we're different there. That is funny. Alright. Next 1 we have here from Alex. Hey, guys. When will there be another episode on blogging? The last 1 was back in 2019. It seems like the ecosystem has changed a lot, especially after COVID. Big love. Yeah. That's a good question. We've had a couple episodes just on, like, content creation in general, and I think, like, blogging has kind of fell out of love with a lot of people. It's it's been sort of replaced with content creation in general. YouTube. Yeah. Where, yeah, people are making YouTube videos or TikToks and and things like that. But I I I feel like it might be making a bit of a a comeback because Google's changed their algorithm recently. I I tweeted a photo of this where Google changed up the algorithm so that good quality content rate rises to the top. And we saw, like, probably a 2 or 3 x on our search results on the Syntax website overnight, not overnight, over, like, 4 or 5 days as they rolled out the algorithm, which is unbelievable. We did nothing. We changed nothing on ours. It just Google said, like, have you ever tried to search for best printer on on Google? I ever tried to search for anything on Google? My kid has a cough. Here's 14 reasons why your kid might have a cough.

There's so much garbage on on Google for searching, and I I think that Scott of deterred people from writing, like, actual helpful content because it's it's not found or not seen by anyone.

Yeah. I I totally feel that.

Blocking is, like, in my mind, a long term play. You know? You're not writing a blog to get dev famous overnight or to have a 1000000000 hits or traffic on your thing. You're building it as a long term play. People will find your stuff as they need it. And if they find your post and they like it, they'll come back to your site. I there I can't tell you how many times that a Wes Bos blog post JS Save My Bacon or, get this, just while we were researching this episode, I came across a blog post from Dave Rupert, and it, like, answered every single question I could possibly have. We'll talk about the thing that it was on later in this episode. I'll share a link to it. But I was just like, thank you, Dave. Like, thank you so much for being the person to put this down because there was nothing else good on this particular topic, and it was taken from such an unapproachable way. So there there's just so many times when I do. I Google things, and the best answer is coming from a blog. You might be wondering about AI.

Why not just use AI to ask ask these questions? Well, you gotta kinda know the answer if you're using AI because AI could just tell you stuff. So if you don't know at least the answer ahead of time, you you might not be getting, you know, all of the information. So blogs, I think blogs are still very valuable.

I still see endless reason to host your own blog on your own website.

Just do it whenever you want and, have it be a long term play. Don't expect success overnight with whatever success looks like for you in that regard.

Next question from Nick Hebert.

Hi, Wes and Scott. Big fan of the show. Was wondering about your thoughts on adding carbon neutral indicates on websites such as Vercel, GreenWeb Foundation, and Website Carbon Calculator.

I have never heard of either of these, the GreenWeb Foundation or website carbon.com.

These are it's cool.

I'm I'm about this stuff. So, you know, the web, it's easy to lose track of of this kind of, like, environmental impact or energy usage of the things that you're doing.

But, dang, this really shows you, like, straight up, globally, the average web page produces approximately 0.8 grams of c o two equivalent per page view.

Wow. A web for a website with 10,000 monthly page views, that's a 102 kilograms of CO 2 e per year.

Yeah.

Hey. I think this is great. I I I I would like to see more emphasis on this kind of stuff. But, again, apparently, I haven't been seeking it out. So, man, I'm I'm gonna dive into some of these services a little bit more. But, Nick, I think this is sick, and I think it's a a really cool thing. So thank you for bringing this to my attention.

Yeah. I my buddy, Drew Mins, I taught at the hacker you with. He's working on something similar to this right now, which is like environmentally sustainable websites.

And he's often posted about how dark mode is better for the environment.

And I often first of all, this Green Web Foundation blasts you with white. So, wanna help the environment. Give me dark mode, please.

But I'm I'm curious what the actual stats are on that type of thing. You know?

Yeah. Like, what actually makes an impact? Well, Adrian, the website carbon calculator and syntax.fm gets a score of a b, which is cleaner than 78%

of websites globally. So shout out to us. Good for us. Yeah. I'm I'm always curious about this type of stuff. Like, I don't even know. I it's just like what do I say about this?

Yeah. Yeah. It feels a bit over my head, but at the same point, I think it's really neat. Yeah. Like, I've this freaking mammoth of an AI just used 14 kiloflops

of energy to learn how to make anime images from somebody's webcam photo. And here I am trying to put dark mode. I understand that. Like, we all have to make a make a difference pnpm everything counts. But I also sometimes find these things like, add dark Node. And your website that gets a 1,000 hits a day is gonna save the world when it's just like I don't think it's saving the world. Me more power, Bitcoin.

You know?

I think there is a kind of, like, a, like, a false narrative there where people say, it's it's not it's about the private jets, not the plastic straws or whatever. But to me, it's like, hey. You know what? If I if I if I believe in these things as being, like, a positive thing, then like, hey. I'm putting my money where my mouth is, and I'm gonna do the things in the right way. But it's hard to know about all the right ways to do things because there's so much. Right? So yeah. I I get what you're saying. I I just think I think it's it's good to do your part too even if your part is a fraction of a fraction of a part. I'm just hold on. We're gonna see what Wes gets on the the carbon. Need more dark mode. It's what it's gonna tell you. B.

This is cleaner than 66% of all pages globally. The global average JS an an e.

Only 3 0.31 grams of Scott 2 is produced every time someone visits your website. I wanna see how much how many grams of CO 2 are produced from driving. Okay. Well, while you're doing that, I'm going to celebrate that Tolinski.

My personal website gets an a plus.

There you go.

It's a static svelte svelte kit site. So shout out to static svelte kit sites. A plus. Alright.

400 grams per mile.

So loading my website is the equivalent of driving.

What is 1 2000th of a mile? Whatever. I don't even know what a mile is. But yeah. Alright. Well, don't visit my website, folks.

Visit mine instead. I give you a plus. Yeah.

I'm Node curious about how they calculate this. Here we go. How do we calculate this? Data transfer over the wire? Energy intensity of Wes data.

Energy source used by the data center.

Carbon oh, so it's it's your host as well, which is I think goes back to the original one. Like, probably one of the biggest things you can do is pick a host that is carbon neutral because if you are running big calculations on the server and you need a lot of compute to do these types of things, that's probably one of the biggest things you can do. Yep.

Tolinski running on Cloudflare pages.

So a plus for Cloudflare Pages.

It could also be that there's nothing on your website.

It could also be that there JS nothing on my website. Very true.

I wasn't gonna bring that up, Wes. I'm not gonna bring that up. Can we try a different page? This is this is fun. I like this question. Hold on. Can we use a different page on your website? Telenski.comforward/work.

There's literally nothing on my website. Yeah. I think the speaking and appearance is the only one that loads anything. Hold on. Your work page, you get 98%.

Yes. God.

Yeah. Saving the world. Good. Alright. Next question we got here from Eric Zorn.

Have you ever used Langchain when working with LLMs? If so, is it recommend using over something such as the Vercel AI package? So I have used Langchain a couple of times. What it is is it's a set of tools that will they give you helpers for working with the different AI providers. So there's adapters for OpenAI and all the other ones, and then they also give you a lot of helpers for doing common things like ingesting documents that are in a specific format and converting them and chunking them up into specific amounts or or grabbing a bunch of images and and converting them to the format that is needed to send them off to OpenAI. So sort of like a little Swiss army tool so that you can pipe data from one thing into another because a lot of these AI things are not just Node response come back and and display the results. It's what if I took this video, converted it to a transcript, pipe that into the OpenAI, come up with a summary, and then generate somebody speaking out that summary into an m p three. Right? It's going through 6 or 7 different steps, and these helper libraries are handy to do that.

So I ended up ejecting. I initially built the syntax transcript stuff in lang chain, and I ended up nuking it because I felt like it was too much of a wrapper around it, and I just preferred just raw OpenAI API directly to it. So Vercel has one for building AI powered streaming text and chat UIs.

That's really nice because initially OpenAI didn't have streaming built into their API. And also if you're building something on AI, it's really nice not to be locked into 1 specific platform. So if you can pull it back a layer, often it's way easier to switch from OpenAI to anthropic or perplexity, something like that. So I would say, at least in my experience, I wasn't a big fan of lang chain, and I would I would pick something a little bit more peeled back and either just straight using the API, make your own functions. Like, I ended up just making a function called get summary, and, internally, it just switches based on the implementation.

Or, yeah, you can use the the Vercel AI package as well.

Yeah. It it depends on what your goals are. If your goal is to knock something out really quick, you can use the Vercel AI package. But if your goal is to maybe understand this stuff a little bit more and build some actual skills around AI coding. If, like, that is your goal to say, hey. I wanna get better at coding AI things, then you you're much better off, like Wes said, writing your own scripts using, you know, what you want to use specifically.

And I think you'll at least understand it all a little bit better rather than yeah. The the other thing I'll say with these packages that wrap

is that you're never gonna have first access to every anything. As soon as OpenAI drops their, like, Flintstones video creator or whatever.

They're you're gonna have to wait for the SDK to figure out how do I implement this into the rigid structures we have Node, and you'll have to wait, or you'll have to just bypass it and go directly, to the API.

Yes. Yeah. Absolutely.

Alright. Next question from MCB.

What any idea what the deal with the hyphens CSS property? It seems like it never works for me. Not sure if it has to do with the fonts I'm using or if it's just a buggy property.

Wes, have you ever heard of hyphens as a CSS property?

No. I I feel like what did we hit the other day where we Yarn debugging an issue on the syntax website, and we could not figure it out? And I found this, like, 1 property I had never heard of before the fix. What Wes that? That wasn't hyphens, was it? No. It was not hyphens. I can I can actually tell you because I wrote it down? It was overflow wrap anywhere.

Yes. I was like, I've never heard of that before. What? Yeah.

I know. It just goes to show you, we spend all our days looking at this stuff, and I've never heard of the hyphens CSS property. So let me tell you about hyphens. The hyphen CSS property, basically, it specifies how words should be hyphenated when they wrap. If you were to specify hyphens, colon, none, it will not break your word. It it like, a long word inside of a container will end up overflowing the container.

Hyphens Scott manual will break, but it will break where you've put an ampersand, signifier in here. I'll try to get some some code examples. Ampersand hyphen or ampersand shy? What is ampersand

shy?

I think yeah. I know. Right? This is such what I would say felt like I went into, like, a alternate dimension looking at this. So I've never heard of any of this.

Shy a shy ampersand is an invisible or soft hyphen hyphen.

This character is not rendered visibly.

Instead, it marks a place where your browser should break the word if hyphenation is necessary.

So a shy doesn't actually show the hyphen.

So that might be one of the reasons why it's not showing.

The hard hyphen, we had the soft hyphen. Now we have the hard hyphen. The hard hyphen character indicates a visible line break opportunity.

Even if the line is not actually broken at that point, the hyphen is still rendered. So the hyphen will show up no matter what with a hard hyphen.

This stuff is wild, man. I never seen any of this. So, you know, hyphen hyphens colon manual, I believe you need this hyphen property in there to get it working. Hyphens auto will just throw a hyphen wherever it's appropriate whenever a word breaks.

Man, why is this not working? You know what? Since I just heard about this property, I do not know.

But take a big look at that browser compatibility chart. That browser compatibility chart, be looking like a, Connect 4 board. It's crazy.

It's just red and green all over the place. When I run into this, like, why is this CSS property not working fairly often? And it's often because I don't have something else set on the ESLint. Like, it's it'll only work on ESLint or inline block or inline block or block elements. It's not ESLint. Or it will only work if you have, like, overflow hidden on the parent because it's Scott. And that's the issue we hit in the syntax website. We had a couple show notes that had like super long links and then like word wrap break word was not doing it. So it was what do we do again? Overflow

anywhere? Flow wrap anywhere? Yes.

Overflow wrap. Overflow hyphen wrap, and then the value we had was anywhere. Other property values are break warp or normal.

This was also just a totally new to me property. So, yeah,

the wild world of CSS folks. In contrast to word break, overflow wrap will only create a break if an entire word cannot be placed on its own line without overflowing. Oh, so word break will break a word if it cannot fit on the line, but overflow wrap break word will only will only break it if it's the entire line is a word, which is why we are having issues with those extremely long links. Very long links. You might have, like, check out this link and then a long link, and then then it will it'll break. But if the entire word is 1 line long, which in our case was a huge link, man, edge cases all the way down. Ain't that weird? It's weird. Wild world. So thank you, MCB, for

showing us that one. If you want to follow-up with this question, I would love to see your code where this isn't working, because, yeah, I wanna see it.

Next question from punished Bernadetta.

Is that a Hi, Tom. I feel like someone's tricking me.

The question is, isn't Wasm the same thing as JVM for Java or .net for c sharp, but for the Wes. I mean, in all these cases, you Yarn shipping bytecode, but that isn't quite assembly, but pretty close.

And then the client spins up a virtual machine and runs your right once pnpm everywhere code. Yeah. So I've never used JVM or or any of these things, but that's the idea JS that WASM is made so that you have some software that is not written in JavaScript, and it can be encapsulated and compiled as close to like you said, it's not quite assembly, but as close as you can so that it can be spun up and run anywhere. So, for example, you might have FFmpeg to convert some videos that often requires a hard installation task on your computer. But if you want to put that on a server somewhere, you wanna run it in in the browser somewhere, you wanna run it on someone's device, Wasm is a really good use case for that type of thing. So isn't it the same thing? I it sounds sounds like it. That's the whole benefit of of being able to run it everywhere. And then Wazee instead of Wazee takes that 1 step further. And instead of just running it in a web development environment, you can now run it almost like a Docker container Mhmm. Anywhere.

Yeah. Word. Alright. Next question from Shivan.

Can you guys please go over writing tests? This can be from unit tests with v test, for example, all the way to integration Wes and end to end testing with Playwright, for example. Yeah. I think we could do a whole show on this, but let's give you the basics.

Unit testing is testing 1 specific unit of your code. Oftentimes, that's a function, and you're just testing that singular function. The function adds two numbers. You write some tests that say, hey. I expect the value if if I'm doubling the number, I expect if I put 2 into this function, that 4 will come back. I expect if I put 6 into this function, that 12 will come back.

And so that is a unit test. And that's one of the reasons why, functional programming can be nice because when your Node a bunch of functions, it's really easy to unit test a whole bunch of functions, especially these pure functions.

Right? So unit testing is testing 1 individual piece of your code. There is a test driven development thing that people used to talk about a lot more than they talk about it Node, where you write your tests, then you write the code. I don't know if anybody's actually doing that. That's so much work. But, typically, you're writing these tests in Node using one of several packages, whether that's Mocha or Chai, v Wes. There's a lot here. So we I'm not gonna get too deep into that stuff because, there's a lot here, especially in the modern way. And we have native node testing now as well built into node. Yeah. I'm a fan of that approach when I'm like like, I had to write a

a function that formatted money in a specific way a while ago. And anytime I'm like, I need to cover all of these use cases, it's often really nice to just start out with the the tests first and then write the code against it. It's not my go to for most things, but when it comes to, like, this function needs to very clearly do this thing, and there are many different use cases that could possibly happen and be passed, then I'm a big fan of that.

Yeah. Totally. So that is unit testing really quickly. Again, we should do and I in fact, before this question even came up, I I was putting together a show on testing because I think it's, you Node, there's a lot here, and things have changed enough since the last time we talked about testing.

Integration testing is how things work together in a system. Right? You have 2 or 3 things. I mean, that's just an arbitrary number. You have a few things. You have things that work together. You're testing to make sure that when I put into this into the system, this pops out of the system. Right? It it's a little bit more of testing how so you made sure that all of your individual units work.

Now you're making sure that all of your big units work.

So first, we're testing the little bitty units, and then we're testing the big units as a system.

Now for my money, the only testing that I invest any time into and granted I'm just writing websites and web apps here. I'm not writing major application code or any things like that. So your mileage will vary here. I think many people wanna get way more into unit testing and integration testing than me.

But as a straight up web app developer, for my money, end to end testing, biggest bang for buck. Because the way end to end testing works for web development stuff is it loads up your site in a real browser.

And then using either Playwright or Cypress, it uses a language to essentially interact.

You can fire click events. You can navigate. So, like, if I wanna navigate to a page, I'm not saying in JavaScript, hey. Navigate to this page. I'm saying, go to this page and then click on the link, and then make sure that link works. Right? And then check to see if the heading's there, and then click play on the on the audio player. Then while the audio player's playing, you can check to see if the the, actual time stamp is updating and things like that. So end to end testing is running your application as users will run it. And for me, that is if you're investing Sanity time, that's the the best way you can get a lot out of a little bit of time. What's cool about Playwright and Cypress is they both have test recorders.

So they'll open up your website, and you can click through and enter things into text boxes, and it records the test. It writes the test for you. So it's, those things, it's just it's endlessly useful. I always make, like, a site tour to make sure all my pages and, common things are working like how I'd expect.

Alright. Next question we have here from Drew Hill. It's been a while since you talked about kids. I'm going to be a dad very soon. Congratulations. Any tips for new dads to be that will keep up with the fast paced web development world? You are awesome. Thank you so much for the show.

Yeah. It's that's that's a great question.

First of all, I think that having kids gives you secret dad power or secret parent power Wes my career went way up when I had kids because there's something about having to provide for them where, like, life is real when you start having kids. It's all good. It's just a bit of a kick in the pants. So you have that to look forward to. I think that's that's really good.

Second of all, listen to this podcast. It's a great way to stay up to date. And I think, like, third of all, is once you have kids, you're going to stop caring so much about absolutely everything, because you realize that there's more to life than, freaking out over absolutely every single little thing that changes in the web development world. And you realize, like, there's a certain pace or you can still keep up without having to absolutely obsess with with everything that's going on.

Yeah. You also get really tired. So so that's another reason why you don't obsess over every little thing. Yeah. I I think the biggest thing that you don't realize for the first, I mean, may you probably realize this, but maybe some of you don't. The 1st few months, you're doing a lot of sitting on the couch with access to only 1 or no hands because you're holding the baby. And even if that baby is sleeping, like, it's not like you're getting any work done when that baby is is sleeping in your arms because you just you can't you can't type with 2 hands while you're holding a baby. Not gonna work. So I think, like Wes said, listen to podcasts.

Subscribe to YouTube. This would be a good time to invest in your ambient learning, putting things on, having stuff get into your brain rather than your getting your hands dirty kind of learning.

Yeah. I I think that's that's my big advice. And, gotta say Drew Hill, that's a pretty sweet name if that's your real name, Drew. Yeah. I wonder if people ever make Cisco or Thong Song jokes to Drew. That'd be very funny.

Man, I I just looked up the members of Drew Hill, by the way, because the only one I know is Cisco. I feel like everybody knows Cisco. They got some pretty Node, the entity. That's another guy in Drew Hill. Nokia,

the entity. Nokia. I don't know any of the words that you're saying right now. All I know is Thong Song.

Enter the Drew. Yeah. Everybody that's it. I I've seen, like, a 1000000000 Drew Hill album covers, but I've only heard the Thong song. So, shout out to Drew Hill.

Next question from Matthias.

Hi, Wes and Scott. Great show, long time listener, first time caller.

Question, do you have experience freelancing as a web developer? How would you start now? I have a ton of experience working for company startups and agencies agencies in the Wes.

But I would like to start on my own directly working with clients. But I'm in South America. That could be an issue. Yes. You may have, very real trouble getting clients that are not near you to do the work.

But I think that's just an opportunity to maybe flex a little bit more online in terms of your networking skills and things like that.

Because let's face it. Somebody's looking for a developer.

You know, they might hire out of country for that developer. That's totally common. But how would they find you is really the biggest thing. So, Matthias, you can definitely do this. You gotta work on your findability. You gotta get listed into things. You gotta put work up online.

A buddy of mine ended up getting his 1st major job just because he was dribble famous. He was dribble famous, and then all of a sudden, companies were knocking down his door to pick him up. And he he got some pretty sweet jobs out of that. So I think this is an opportunity to step up your web presence in a way that can get people to know that you're out there looking for work, but also make them aware of you.

Online Upwork and stuff is kind of a shoot to the bottom.

So, yeah, I think this one will be tougher, but I I think you gotta flex online a little bit. Yeah. I I people are looking for for good devs wherever they are. I'm I'm not sure you'll be getting, like, coffee shop and local brewery companies Mhmm.

To do freelancing gigs for. But if you can sort of position yourself as, like, oh, like, a wicked reactive developer, somebody who other developers would hire rather than you're going directly to the client, I think that would probably be a bit of a better fit, especially because South America time zone is so much closer than Totally.

Europe, India, Australia, much of Africa.

So if somebody's looking at developers from all of those countries, the being able to have somebody on the same time zone as you is a major, major plus.

So I would probably push that as well. Just so just, like, just double down. I I think if you're a good enough developer who is on the same time zone as the people that are hiring you on, I think that's very, very wanted in our world. So I'd say push and double down on that. Word.

Next question from Node. 1st, congrats, Wes, on another baby. Thank you. Should come any day, maybe tonight. We'll see. I have 3 kids. I think it's brave to go for 4. Me too.

My question for Scott.

How is a Newman m t 48? Please tell me all about it. What's what's the Newman m t 48, Scott?

Alright. Let me let me check you right there. It's Neumann. If that's how you say it, Neumann. I've seen Seinfeld before. I know how to spell Neumann. Gosh. I'm so mad at you.

Neumann, Neumann Node for making the best microphones in the whole world. The Neumann m t 48 is a what do you call it? What do you call yours? A audio interface? Yeah.

Yeah. I think yours is probably a little bit more than what mine does, but mine simply takes the XLR cable that sounds good and turns it into a digital signal.

Yes. The Neumann m t 48 is that, but also a computer. So there's a little computer inside of this thing, and onboard in this computer is digital signal processing. There's a compressor. There's a gate. There's preamps because before I had a hardware compressor and gate. I had a physical hardware preamp. I had all these things sitting on my Wes. And this thing does it all. But it does it all with presets and with digital. Like, there's 32 tracks out on this thing. You could do 32 individual tracks out. I can apply effects individually to a channel, and then I'll put that to a 2nd or separate channel in my computer. That means I could record, Wes, a track with a different EQ and a track with a different EQ, record those as 2 separate pnpm, and then decide later or potentially, you know, have 1 clean for the audio editor and maybe one that that doesn't need additional help or anything like that. Either way, this thing is dope. It's very expensive. But as the fact that I spend most of my time talking into a microphone on the computer, having a really good, highest quality preamps, highest quality software is great. Not to mention, when I had the podcast from my parents' house in Michigan, It's it's this little itty bitty thing, and I can take it with me. And it has all my presets, and it has all my settings.

With the hardware that we used to have, the DBX two eighty six, I believe it. It's huge. That thing, it's a big old rack thing. I can't take that with me. It's okay. Then my gate and compressor's out. Okay? My preampture, I can bring that. But this is is definitely travel, portable, comes in a nice little case, and it's cool. I think the coolest thing about it though JS the fact that we're in a situation here where computers have gotten fast enough and small enough that you can put onboard digital signal processing into things like a audio interface.

And to even go further with that, my homie, Devin of Good Hertz, they launched a guitar pedal.

And this guitar pedal JS actually really cool. You should give it a look because it replicates the sound streaming music on a 56 k modem.

That's, like, kind of, like, the the vibe that this thing is trying to replicate.

But this is not just a guitar pedal the way that typical guitar pedals are. There JS a little computer in there running actual software on it. So,

man, what a cool world that you can put little computers and stuff and run software on them. It's crazy. I so I went to a show a couple of months ago for a bunch of bands. And the first couple of bands like wheeled out their their amps and they put microphones in front of the drums and all that. And then the big touring bands came out just with guitars, you Node, and it's all wireless, not single amp, and it sounded huge. And it's because they're they're mixing it.

They're, like, they're they're essentially mixing it and adding in, like, the effects. Like, you can tell the, like, screams are, like, like, really full, and you can tell they're turning knobs.

And they have all of their settings, and they just plug it into some little Neumann thing somewhere.

And Yeah. It's amazing. That A fancier thing that they got real time auto tune and stuff. You ever Yeah.

Hear J. Lo without the real time auto tune? Woof. So here's the here's the question I have, though, is this thing is $25100.

Why can't you just run this on your laptop? And I know the answer. People are probably, I think, asking, though.

Yeah. Well, 1, it takes all of that stress off of my my computer JS is, like, really the biggest one.

In reality, the software on this thing is just really good. So if I was let's say, I was buying audio VST plug ins.

And many of these VST plug ins you're applying after the fact and then, you know, per potentially, like, Node, like, rendering it out, but whatever. You're you're processing it ahead of time.

Those plug ins would cost more than this thing. So the the software that you get on it is really good for the hardware that comes with it. So, yeah, it it's an expensive piece of hardware. But the software itself, if you've ever tried looking at, like, waves VST plug ins Yeah. Yeah. That that'll shoot your head right out or your hat right off your head. They, they're expensive.

Actually, I think I I moved to the Volt, and I think you can put plug ins on it as well. But, yeah, they're they're not cheap. And, like, running on your computer, like, we have enough issues trying to get our webcams to come in smooth.

And morning for me. I do not wanna introduce more software into the mix, which I understand software's running on this thing, but at least it's its own separate component that runs by itself.

Totally.

And there's a part 2. Stuart from the UK, this is a different, question asker, but it's related. Thanks so much for the awesome podcast. I just heard you were having GoodHertz devs on. If you haven't already recorded, can you please ask them if they have any recommendations for UI libraries for audio synth plug ins, skeuomorphism, visually UI making their analog counterparts lives on in audio plug ins, but I haven't managed to find any libraries which emulate knob switches you find on audio hardware. Yeah.

Stewart, that's a good one. I I will ask them that question when we get them on. Devin, he's a hard guy to, schedule with, but he knows. He has the ESLint. So I'll I'll bug him a little bit. We'll get him on the show. I'll ask him about their UI development. They do it all on their own, and it's all web tech, SVGs, HTML, all that stuff. So, we'll get them on and ask that question. If you're interested a little bit more about that, you can hit us up on the YouTube. And then we haven't recorded it yet, so I'll have plenty of questions to ask, for the Good Hurts folks. Okay. Next question here from Ollie Williams.

What do you think about CSS module scripts? It seems they were added to the platform mostly to improve a styling story for Shadow DOM. Would you use them outside of that? Man, Wes, I heard of CSS modules.

And CSS modules JS I had known them before this question came in, was simply just you import the CSS and then you can use CSS Scott class name or whatever it was and then apply that to your HTML to get that class name and CSS properties applied there. I don't like that. But this is not really that. It's it's more of a means of wrangling in style sheets and keeping style sheets separate specifically for web components. But you can use it anywhere. You can use it for the DOM DOM. You can use it for the Shadow DOM. Gives you all sorts of things like deduplication, a consistent order of evaluation.

Again, this is where that Dave Rupert blog post comes in. So Dave blogged about this in 2021, and I thought it was pretty interesting.

Definitely not something that I've used. It feels like, like you mentioned, Ollie, that this feels like a good fit for tangling or untangling kind of shadow dom styles. And Dave actually makes a really good point for exactly that in this blog post.

So I would say, yes, you're probably I think this is probably for web components folks first and foremost.

It doesn't solve any issues I have in particular because I'm using a bundler Wes if I do import, you know, styles Scott CSS in my Vite application, And Vite just does it for me. So so this isn't something that I'm necessarily reaching for myself. Maybe at some point, the tools that use these things are gonna just do all this for me again.

Or maybe they already are, and I'm not even knowing it. I'd never heard of this being referred to as CSS module scripts, but it's interesting stuff.

Yeah. I it's funny because I didn't even know that until about, well, 4 months ago that CSS modules were part of, like, a official spec. I just thought it was, like, another thing that like, another way that people write CSS. But, like, the way I found out about it is when the import assertion spec came up for JavaScript Wes you can import, like, something as CSS, then it will it will, throw it into style tags, I guess, or you can import You have to you have to add it to the document.

Okay. So you just it's basically it's like a text import. Because the idea with import assertions is you're able to import something that isn't JavaScript and the most common use case being JSON.

But and the 2nd use case that we've seen come up now is importing straight up CSS.

So the you have an example here in the documentations, import sheet from styles Scott CSS, and then you tack a assert type of CSS on the end, and that will, I guess, tell the browser or the JavaScript runtime that this is CSS, and then you can then throw that into, into the document.

Yeah. Yeah. Interesting stuff. I can see this being handy with the the CSS scoping because, like, right now I'm like, oh, yeah, that's cool. But like I like like Scott said, I just use whatever my v bundle or gives us. But now that we have standards for this type of thing, I don't know. Will will the next generation of tooling just import these standards,

across the board? Your, your instinct to say anything about scope was dead on because Dave also says in his blog post, maybe one day this problem goes away. Miriam Suzanne has a proposal and explainer for the new CSS feature called scope. So maybe it's not even something we end up getting ESLint, and scope just kind of takes over what you would even do for scoping there. Because, ultimately, the problem of shadow styling in CSS JS, like, how do you encapsulate CSS to 1 component without leaking, but at the same time, give people the flexibility and everything? So, yeah, maybe perhaps the answer at the end of the day is just scope takes over.

Cool. Well, we'll we'll keep an eye on that for sure.

That's the last question we have here. Again, please keep the questions coming. We love answering them. Syntax. F m. Click on the potluck button and submit us your question.

Let's move into some sick picks. Do you have a sick pick for me today?

Yeah. You know what? I've been listening to a lot of new podcasts. Sometimes I just go on Pocket Casts, and I click the discover button, and I just, like, look for some things and, you know, see what kind of catches my eye. Did you see that we were featured? And who was it? Plexus? On Plex. Yeah. Plexus picks? Shout out to Plex or the Plex devs or whoever, listen to this show. That's pretty sweet. Yeah. So thank you for that. I've been listening to some some new podcasts, and I'll I'll give you Node here that I really enjoy. There's a a podcast called Deep Cover, the Nameless Man, but it it's just called Deep Cover.

This is season 4 of Deep Cover. I've been listening to this since season 1. And the I the whole concept of this show is not necessarily somebody undercover because that it can be somebody undercover, but it's also just like identity.

So people taking on false identities. So, like, the 1st season is about, basically, it's about FBI agents going undercover to to track down the mob. But, season 4 is really interesting here because they don't always just go straight to, you know, undercover cops kind of thing.

Season 4 is all about there's a murder, and they just heard a rumor of a murder. They don't even have a victim.

All they have is a rumor of a murder, and they're starting there trying to track down who was murdered, where were they murdered, all that stuff. And it's all about, trying to find this person's identity so that they can then charge the the murderer.

It it's very funny. It's like they they know there is a guy who's a murderer, but they do not know who he killed, when or where or how or anything.

Very wild. Interesting. Kinda like Clue. That does not sound like something I would be into.

Do you like playing board games and, like, Clue and things like that?

I do like board games. Yeah. We play, a lot of board games with our kids. Not like the fancy ones, but, like, our kids are getting really into to board games. I grew up playing a lot of cards. So cards may be more than, board games. But

yeah. What about so for when we went to Miami with the whole syntax team, we did a escape room where we had to, like, figure out all these puzzles.

And, I surprisingly, I was really into it. I was like, this is actually kind of cool.

I'm not the type that likes to figure out stuff like that, and I certainly never want to play a board game for the rest of my life.

But it was kinda cool to I Wes mostly impressed by everybody else that was able to put all the pieces together because I was sitting there being like, how do they make this door unlock? Yeah. You know? Is it magnets? Scared me. It wasn't I was so curious about the tech behind it. I was trying to, I was trying to pick the lock or, not pick the lock, but crack the combo because if you pull it I was more interested in that, but I was really impressed that everybody's what do you what do you call that skill when you're able to, like, be like, this person has,

like, drugs, and this person is from Colombia. And, like, you have put all those clues together. Just the data connection and the data and the infer, everything. Wes, I'm surprised to hear you don't like board games, and it makes it frustrating that when we played our dumpster fire, Century game. Century made a game called Dumpster Fire, I believe. Oh, yeah.

Yeah. When we played that,

you dominated us. That's really hard to hear that. You don't even like playing games, and you beat us that badly. Very good at games. That's what I always tell my wife. Like, we'll we'll play them every now with the kids and whatever, but, like, I'll win. Of course, I'll get 1st place, but Mhmm. Not gonna enjoy it.

Our sec pick today is a surface cleaner for your pressure washer. So we have a Wes were just talking earlier about how we have a backyard that nobody had maintained for many, many years, and, the concrete needs to be, like, cleaned and resealed every couple Yarn. And it hadn't been done for, probably 20 years or something. So we got this service cleaner, which is a big disc that you hook up to a pressure washer and then just push it around kind of like a lawnmower.

And it got this concrete so clean, and it's a 1000 times faster than sitting there with the pressure washer trying to get every little nook and cranny. It's just it's, like, pretty much just mowing the lawn, but you're cleaning the cleaning the concrete. So highly recommend either getting 1 or renting 1 if you just have a a space that you need to to get clean.

Yeah. Man, I gotta get one of these for we got a pressure washer, and I was like, I'm gonna pressure wash this whole, driveway. And then I start to do these little to drink. I'm like, this is going to take me 2 centuries.

The the pressure washing is so exciting for the first, like, 3 minutes. Yeah. And you make, like, a little satisfying video, and then you're like, oh, shit. Like, this is gonna be all day long All day. Sitting here doing it. So don't I'll tell you. Don't get that crappy little one. I I had bought, like, a Sun Joe version because we had the Sun Joe pressure washer, which is really good. Just a little little cheap, little electric pressure washer. But I bought the, like, cleaning head for it that's, like, 12 inches wide.

You have to move so slow for that thing to actually do any damage. So we got, like, a 24 inch really big one, and I, I split up my dad because he is also they have, like, a a big backyard as well that's brick, and they need to clean it every couple years as well. So, like, this probably makes sense to to own rather than have to rent from Home Depot every year.

Yeah. Man, one thing I pressure wash that many people might not think about, shoes. I pressure wash, especially, like, my lawn mowing shoes and stuff like that. Not on your feet, though. Don't do that. Not on my feet. No. That would be really painful.

Yeah. I I did my shoes a couple times as well. It's amazing how how clean they come. Yeah. Especially the you got these junky shoes that you've been mowing the lawn in for, like, 4 Yarn. Yeah. And it made them look brand stinking new. So, yeah, shout out to pressure washers. They rule.

Cool.

Sick.

Shameless plugs. Check out Syndax dot f m. We have Scott just added a new video section. So Syndax dot f m forward slash videos has a a list of all of the most recent YouTube videos you can check on out.

CJ has been working really hard, cranking out some really cool self hosting videos, as well as a bunch of side dish explainers, which is a little bit more code context to some of the episodes we've done. He's got 1 on, CSS has. He has has 1 on, using maps and sets in JavaScript. So check it on out. Syntax.fmforward/videos.

Take.

Alright. Thanks for tuning in. Catch you later.