Potluck — Freelancing × Leveraging your experience × Component size × Dealing with mediocrity × How to spend "extra time" × Rust vs Node × Free hosting? × More!

You're listening to Syntax, the podcast with the tastiest web development treats out there. Strap yourself in and get ready. Here is Scott Talinski and Wes Bos.

Welcome to Syntax, the podcast with the tastiest potluck ever. We've got another potluck Episode for you today, whereas you bring the questions, we bring the answers. We got really good questions today about the difference between throttle and debounce. A good one. Freelancing questions. JavaScript question.

This one is really interesting. Not a pollock question, but why are radio buttons called radio buttons? Rid. A lot of interesting stuff there. I don't know the answers to that, but we're going to I think I do know the answer to that, but we'll we'll Yeah? I'll do I'll do my best guess. Yeah. Yeah. Alright. That that was our YouTube hook into halfway through the show.

Today, we are sponsored by 3 awesome companies, FreshBooks, Cloud Accounting, rid LogRocket, JavaScript session replay, and Vonage APIs for your application for communication.

We'll talk about all of them partway through the episode. How are you doing today, Scott? Hey. I'm doing good. Just, feeling feeling fine. I I have this,

EMS tens unit that these little electric cutie pads, and I I have them on my back right now, and it's just, like, buzzing away. Oh. Yeah. Shocking my like, my back all all rid Dude, the entire last episode. You're getting back abs. Is that like the Doctor Ho easy abs? Yeah. It's it's actually basically the same type of thing, but What it is is it's just like providing, like, it's providing, like, a, like, a reoccurring stimulation to the muscle rid So that it, like, learns how to fire better. So it's not for, like, building muscle in my case. It's for getting my muscles to stop spazzing out because that is a rid A common thing for me that just spaz out. You know, you should too is to hook that thing up to a computer Yes. And put it on the Internet. And then when Like, maybe when you have, like, an ESLint

issue or something like that, it, like, shocks you. Yeah. Maybe put it on your eyes or something. Yeah. Somewhere where it's painful.

Oh, man. Alright. Well, we've got lots of really good questions. Why don't we just jump on into it? 1st one is actually 2 freelancing questions from the same person, Maxwell Demers.

I'll read them both, and we'll both have a shot at them. 1st question was, I've read that when you start out freelancing, you should look in your area to first gauge the market, both for rates and type of work that is in demand. If you wanna work remotely as a freelancer, however, is it really still applicable device? Is it viable to work a 100% remote and not be tied to local rates? And then 2nd part of this question was, how can I leverage my years of personal experience when starting to freelance? A lot of material online speaks to those types learning web development for the 1st time. But what does someone do if they've been working at a big company and you can't share your work directly? Rid. What can I do to help prospective clients appreciate those years of experience? Okay. So first question, no. You don't need to Base your rates locally unless you are specifically making websites for local businesses. So that's definitely a type of re Website maker, but I don't think that you are that type of of website maker. So for being a freelance re Remote dev, you just gotta set your rate at something. I would probably say start at $60 an hour or something like that, and then just Keep working your way up from there because you will sort of be learning what people are okay with being charged, and you can work yourself up. There's lots of Freelancers out there that are steadily making a 100 an hour, some sometimes even double, triple that once you start getting into, rid Oh my gosh. Somebody please save my application type of work where you you swoop in and are the hero to fix whatever whatever app that you're working on.

And then the 2nd question here was, I'm a professional. I've been working for so long, but, like, now I wanna go freelance. How do I how do I do that? And I was actually kinda thinking about this previously because, like, in web development, if you want to have, like, a bit of a reputation for being good at JavaScript or whatever it is that you're doing, the way that you do that is conference talks and being on Twitter, and You can go even as far as YouTube videos and podcasts, but that that sort of, like, crosses the line into, like, what Scott and I are doing, I think. So, like, how do you do that? I I think, honestly, just Twitter, just posting, writing blog posts, things like that rid Because that will show people that you are an expert in your craft. And I was thinking about this the other day because I went on my LinkedIn for my Once every 6 months. Yeah. Yes. Your your your annual click yes to it. My annual click is through to get LinkedIn. And there's just people on there, Like, full time posting, like, huge like, as as if it were Twitter posting these huge thought pieces and everything, and I was like, Okay. Like, as much as we hate LinkedIn, it's obviously a thing. It's a thing. Yeah. People are trying to make themselves even though they work for a company and are Professionally employed by a company. They are still outwardly trying to make themselves appear as if they know what they're doing and share information.

Why? Because their next Next job will probably come from that type of thing because they are are making themselves known. So I think, like, this whole, like, be known online And show that you're good at what you do

extends way past being a freelancer by now. Yeah. You know what? It's it's very funny too even with LinkedIn on that same subject. I know it's not rid the question, but the best paying job I contract job I ever got was from someone on LinkedIn. So who knows? You know? It could change your career. Literally, you probably did mine. So it's very funny that you had mentioned that. I don't know. I don't have a whole lot to add to what anything you just said because I I think you really I mean, you nailed Both questions. So, yeah, there's not a whole lot to add there, Wes. I think I think you've got it. Yeah. Alright. Let's just grab the next one. Yeah. The next one is from Gavin. Gavin says, Hi, Wes and Scott. In your opinion, what is the accepted norm for the size of a component? It could be anything from a single element to a full page of content. What is the norm for component size and content? Love the show. Keep up the great work.

Rid He's basically saying, like, okay. You have, let's say, a React component, Vue component, a Svelte component, maybe even an Angular component. You have a component. Rid How big should those components be? What's the normal there? How many how many lines of code? Right? Well, it turns out this whole thing is really just A personal preference. Now some people, they really like to shove everything into 1 giant file and to say, hey. If this is the thing, then this is the thing. I like to think about it really when the encapsulation of functionality comes into play here or when something would be easier rid to do if you broke it out into a subcomponent. Let's say you have a list of checkboxes. Each of those checkboxes has its own state. Rid Then it makes sense to put that checkbox in its own component because then you could just throw, like, a state for that component In the end, the individual component into that and then loop over it, then you don't have to deal with the index of the thing you're updating in the global You don't have to get into more reducer territory.

So for me, there are some practical means of doing it. When something has its own state, Then I put it into a component typically, like, when an encapsulated does, or sometimes I do components for things that are just Feeling a little too hefty or maybe you just wanna sweep something under the rug. Maybe you have a whole bunch of HTML or, like, copyright notice or something that's just hanging out on this component. Just throw another component. Right? You can put it in another another way is if you're gonna reuse the individual thing, then you're gonna wanna throw it into component. But is there a certain amount of length? I don't know if there is a amount of size that a component gets rid too big before all set. I'll break it out. I think it is it comes down to a feeling of what is this thing manageable, unmanageable? Am I gonna reuse it? Does it have its own state rid. Rather than how many lines of code is this thing? Because the lines of code thing or the the size can become unreadable, can become unusable, But I don't think that's the first thing that's going to trigger me to want to move it into its own component. Yeah. I I don't think there's there's no hard and fast rules there like Scott says. For me,

I always, like, write the thing in the bigger component, and then if it needs to be reused or, re a big one for me is I'm like, okay. I got this variable, but I need to work with the data a little bit. I need to split rid string or have an if statement or dynamically generate some classes. And if that's the case, then you have to move it out into its own function. So before you return, you can you can do a little bit of work there. So that's one for me that I'll do, and I'll always just say, like, alright. I'll just I'll just write the thing here And then move it out if if I need it. And then, also, if you find yourself, like, getting like, oh my gosh. Where was I again? Like, you're scrolling Yeah. A lot rid up and down, then, obviously, that's that's probably a point where you should refactor that thing out. But I don't I see a lot of people, like, overoptimize rid these types of components and put them in their own components just because that's like a rule that they have. And for me, that's just more annoying because I just I'd rather write the thing where I where it shows up. This is to me a world where single file components would come into handy because it's, like,

It's much less boilerplate to spin up each time you're, like, refactoring something onto its own component. Granted, there's processes That can make that easier, but, like Totally. Component is re really pretty nice to break out a little bit easier than having to create a whole new function and all that stuff.

Next question we have here is from NRS.

Hey, Westa Scott. I was a bit confused about the throttling and debounce explanation in one of your past episodes.

What is the difference between them? I have been finding different examples online which are not helpful at all. I'll start this off by saying I always have to look it up, Dane. Rid. Always. Because, like, I know the difference, but I never remember which one is which. I flip flop them now.

Throttle and debounce, those functions are used Or when you want when a function is called repeatedly, but you don't want that function to be called repeatedly.

Rid. So you've got a function that fires off a fetch request or refreshes the page, something like that. And if somebody tries to Trigger this thing from the UI 10, 20 times.

You don't actually want that to happen 10 or 20 times. You need to say, okay. Even if Even if they click the button or type in in in a box, then it can only run every x seconds or after every x seconds. So the difference here is that rid. Throttle only happens at most once every 10 seconds, and all the other ones are ignored. And debounce only happens rid After 10 seconds of silence, I'm gonna call it. So some examples mean a throttle. Again, a throttle only happens after every 10 seconds. Rid. A refresh button. You we've all seen the people click click click click click click. Like, even I do it. I go up to the Yes. The button that you used to cross the street Or or the elevator button, and you you slam that elevator button 3 or 4 times just to make it come faster. Right? Like, what happens In the logic of the elevator, I'm assuming, is that it says, okay.

I requested the elevator, But I'm not going to request it again until after 10 seconds. So the person sitting there pressing the button 10 seconds, it only actually triggered the logic to happen once. Whereas the debounce will only fire the search query after one second of no typing. So let's Let's use a a fetch request. If you're typing into an inbox and you're saying when this input changes, fire off a search request.

Re You can't fire off because if you type Wes, you would search for w then w e and then w e s. So what you do is you debounce, meaning that You fire off these functions, but then you wait for 1 second or 10 seconds to pass. And then after that amount of time, You say, okay. This user is clearly done. Then I can go ahead and and fire it off. Same thing when you use a phone. It's like press Or please enter your phone number in when you're on, like, a you're waiting line. You type it in. Sometimes it tells you to press pound to keep going, and sometimes you just Stop. And then after a second of you not putting numbers in, then it will go ahead and and fire off the next request. Does that make sense? I think it makes a fantastic amount of sense. Yeah. I I really like the personal anecdote about hammering it

rid Because that that's something I think we all do. Yeah. Yeah. Totally. It's humans are impatient beings,

And you need to account for that with software. Yes. Humans

are impatient beings. Alright. Next question is from Boris from Sweden. He says, Hi, Wes and Scott. Great show. My question is about climbing the company hierarchy. I have had a hard time getting my 1st job after graduation. I've dealt with the unemployment office, useless recruiters trying to look important for companies, and I wonder if I get a low wage job at a company then apply for their IT department after some time If there is an open position, is it a bad practice or a good strategy taking the shortcut? Would they know that what I'm trying to accomplish? So, Boris, I Don't know if I love the plan. Granted, it's something you could do, but, typically, yeah, people will hire from inside, But you might you might be better off just really hammering hard for that 1st tech job, whether that is a programmer or what, Especially even in if you're trying to become a dev, like web dev, whatever, IT to dev is probably not the pipeline that you're gonna want because I I I think that, Yes. The the tech experience is good experience, but it's not the same as web dev experience. If somebody was coming to me for a web position Or a programming position, anything, and they were formally working in the IT department, I would say, great, but let's see what that web code be like. I wouldn't necessarily say, like, this person has any any advantage over any other person coming to with the code. I think what you're best served in would be spending your doing projects, whether that is freelance projects, trying to get real experience writing code, creating projects yourself. And, sure, if you do get that job, Make sure you're hammering in that time getting in those projects and getting those reps in in the code stuff so that when people interview you for code jobs, you have code stuff to show them.

I don't know if being in the company would give you an advantage there. I think that's very region and company dependent, And it's definitely more of an old school way of getting it, you know, getting up. I like, I became the the janitor and worked my way up to the CEO is is much Less of a thing I think that happens today. People jump around from job to job more to have those advancements, so just getting that first job rid is really gonna be the the critical thing for you. In my not to say that it's a if you need a job, get a job wherever possible. My 1st job, I couldn't get a job as a developer out of college either. So my 1st job was working as exactly like what you said. In in IT, I was working fixing projectors rid for the hospital at the University of Michigan, and that's what I did for a couple years. And that job, I can I can tell you with great confidence, That job did not help me get a web developer job? Absolutely did not. It had no bearing. The only thing it did allow me to do was allowed me to spend 8 hours a day, because when it turns out when you have digital projectors, they don't really have a ton of maintenance that you have to do every day. So I got to spend 8 hours a day just hashing out some code stuff, And that's what really helped me more than anything else. But if you gotta get a job, get a job, ensure I I don't know if it's a plan that will net you that job, but it's a plan that it it's not gonna hurt. Yeah. I I think I agree with Scott is that having that IT job I think working for the company is definitely a benefit because you know the the culture and how things work, and rid. They often like to hire from within, but the chances of you,

like, starting in IT and then hopping over to a web developer is probably less than If you were to just try your hardest to become have a really good portfolio, become noticed online, rid. Apply to lots of companies, maybe work on some open source projects, YouTube videos, conference talks, whatever that type of thing is. I think that's probably rid A higher probability of you getting a job than doing that thing from the inside because, like, what are the chances that they Both need another developer and are gonna look in their IT department. I think that that's probably pretty low. Not to say you shouldn't take that IT job because, Definitely, lots of developers were in IT beforehand, so maybe maybe that is a good solution as well.

Yeah. It's not gonna hurt, but it might not be the the golden ticket. Yeah. No. If you're looking to get nice nice and quick, I think that you like I said, there's probably your time is better spent rid. Figuring out why am I not getting any interviews, or why am I not getting through that? Is there something can I get a mentor who can look at my stuff and say, like, okay? This This is the reason like we said, when Scott and I were reviewing people's portfolios and whatnot, there often is just a whole bunch of little things about a website that put people off, and that could be the same for when somebody goes through an interview as well. Totally. Re Let's take a break for one of our sponsors real quick, and that is FreshBooks.

If you are thinking about starting a small business, if you are a re Freelancer, you need to get those expenses in. You need to send off invoices. FreshBooks is the cloud accounting software that's going to make that happen. It's going to speed up all the time that you spend. Like, the last question is a really good example here is if you've only got so much time in the world rid To do these types of things, you certainly should not be spending them making invoices and and putting together rid expenses and all that stuff. That stuff should be either automated or made as quick as possible so that You can do it in your downtime or or have an assistant or something do that. So check it out. Freshbooks.comforward/ syntax.

It's gonna get you a 30 day unrestricted free trial. Make sure you use syntax in the how did you hear about us section. That will keep them sponsoring. Thank you, FreshBooks, for sponsoring. Thank you. Alright. Next question we have here is from Aaron Hubbard.

Hi, guys. Love the show. I'm getting started building websites and find the initial design to be a re Challenge. I always end up diving into the coding and then spending hours getting lost tweaking the CSS. Rid. The mediocrity of the final design is the masked technical challenge, and I emerged at the other end of the effort with something I'm still not happy with. Well, I heard I think you rid It'd probably be a, like, a speechwriter or something like that if you are not good at CSS.

I suspect There is some kind of mock up stage I am foregoing, and I bet there are some tools to make it easier. I imagine that some kind of application That has really focused me on design and made it easy to tinker most quickly would be an idea. Thoughts would use. This is something I hear a lot of from new developers is that I'm so frustrated that I can't make this thing look good, but I'm also frustrated that I can't write the CSS rid that I'm needing it to do, and then you end up with this, like, you're unhappy with the technical part of the CSS that you wrote, but you're also unhappy with the design that you're making.

And if you want to make the thing look better, you're sort of limited by the fact that you can't rid Write the CSS fast enough to make it look like what you want.

So my suggestion here is and I do this as well. It's just use some sort of rid. Mock up, wireframing, or design program, probably Figma is the one that you wanna reach for and make at least rid A little bit of a I call it look and feel. Make the buttons. Make the layout. Get your colors sorted out. And, like, to me, I don't design my websites Entirely a 100% in a design program, but I will spend that time in a design program trying to nail down those basics first because then I'm not frustrated with how it looks and how I'm doing it at the end of the day. And then I think as you get better like, I I feel like I'm pretty good at CSS now. So there I I jump earlier out of the design program these days just because I can fuss with the CSS pretty quickly in the browser. What what do you think about that, Scott?

Yeah. I I think you should rely yeah. I mean, you sound like rid. You're the type who has programming brain rather than maybe that visual brain. You can tell when something's not looking right, but maybe not have that gap to how you get it to look right, which is good. I mean, they always talk about that Gap in design is being like the gap existing is a good thing that you at least know what good design looks like and you know that yours isn't hitting it. Right? The fact that you're aware of that gap is is a good thing. So, like, don't don't feel stressed out about it. That's how everybody is until they get enough experience with any of this stuff. So I personally would reach for maybe any sort of learning about systems, design systems, and how those systems can help you design things better Without having to get so much in the aesthetic weeds of things and more worry about, like, the the things that your programic brain does well. It probably understands a little bit better than it does.

Does this look right? Why doesn't this look right? And typically, things look right because there is a system behind it. Rid. I like to use things like type hyphen scale .com.

Typography is one of those things that can make or break the way your application looks. And if you use a system that designs your your type for you, then that's, like, half the battle right there. Right? Type hyphen scale, I'll have a link in the show notes, is a tool that I use to Help me define all of my font sizes. There's something called vertical rhythm. So look into vertical rhythm too that helps you set up and understand your margins and vertical spacing.

But overall, look at design systems. I don't wanna advertise my course here, but we have a course called modern CSS design systems. And that course is primarily about, like, writing CSS class list first. You know, people don't talk about that enough where, like, you know, you have CSS resets rid reset the way that the browser does your your CSS. But oftentimes, we just jump into styling individual components. Alright. Let me style the header. Let me style this Page. Let me style this page. And what we don't think about is the entire application as almost like a reset, first and foremost. So one of the things that we do in that course is we talk about rid Classless CSS where you you get your design system looking good before you write any classes at all, whatsoever. You're just styling straight up elements, And you build in the scales and the systems via those elements and even via CSS variables Or Sass variables. We can't use CSS variables for IE 11 reasons, but CSS variables and and how you can set up those systems with those variables. So instead of reaching for, what does this margin look like in this particular instance? You just say, hey. Give me the normal margin. Give me the normal padding. Give me the normal whatever. And And because you have that system in place, it'll all just work right. I'll post a link to the the series if you wanna check it out. But, really, just look at at classless CSS design systems, Type scale, vertical rhythm, those types of things, and it'll just help you find ways to to make it less of a subjective thing and more of an objective thing. I like that. That's really good advice. Rely on the system. Yeah. That's what I do. Alright. Next question here is from Stefan rid From Belgium.

The company I work for works with a SOAP, s o a p, API.

Currently, I'm developing an application in React, but I am wondering what is better to use Soap API or let them create a REST API? Rid Some people on the Internet say that JS and SOAP combinations are not done.

Is there some advice You can give about this.

Is there something that I, this is the first time that I'm hearing about a Soap API. So, if that gives you Do you have any indication of where I'm at here? I've used GraphQL, and I've used REST primarily.

Soap, I use for getting clean.

So I don't Wes, Wes, do you have any thoughts about SOAP APIs? Do you know a little bit about SOAP? Yes. SOAP APIs are what predated REST APIs. Like, we're talking,

Like, probably 12, 15 years ago, these were the ways that they opened up API access to places. And Funnily enough, like, I don't know, 6 months ago, I used Canada Post has an API, and it is in SOAP. I'm not kidding. Rid. Essentially, what that means is that you still send requests and get responses back, but those responses and those requests are formatted as re and often the way that you format your request has to be done a little bit differently. And It's it's really frustrating because, like, working with XML is painful.

But that said, like, rid If your company can make you a REST API, absolutely.

Go for that because using a SOAP API is very, very dated. Like, I've been around for, I don't know, forever as a web developer, and I've only used the Soapy API once. And that was 6 months ago. Actually, no. I'm I'm probably when I first did my 1st co op, they also had a soap API as well, but that was 12 years ago or something like that. So You you can get them to build you in an API. Would that be great? And if not, that's the case for a lot of people. There are packages out there that will convert everything to just regular JavaScript and JSON, and it will just interface for you. There is a package on NPM just called Soap, And it has 200,000 people a week are using this type of thing, so you are not alone in this type of thing. If it is simply just rid You pulling data down and not sending and and creating things, you can also just find, like, a XML to JSON

thing, but I would check out the soap package because you're not the only one out there. Yeah. That's neat. I, I have no experience with this. Rid. I have to work with XML to do the, the syntax player on the LevelUp tutorial site because I we we wrote our own little syntax player on the LevelUp site, and that's coming in from RSS. I just Hit the RSS feed to get the latest episode.

And, I was it was so funny because we we had always used a package to work with XML. I know this is just tangentially related here, but We always use the package to just, like, convert that XML to JSON, and then I found out you could just use a DOM parser. Have you ever done that? Rid Yeah. Or you do, like, a new DOM parser? Yeah. I was like, oh, this is actually really pretty simple, and it allowed me to rip out a library that we you didn't need and didn't Three lines of JavaScript. I actually use that for my wife

watches a sitemap for this clothing company she loves. And When they drop new products, I found out that it it shows up in their site map before they actually make the pages public. Oh, interesting. Rid I wrote a little parser, and I was like, should I convert this whole thing to JSON? And I was like, oh, no. You can just take the XML, dump it into a div, And then use query selector Yeah.

So neat. It's easy. To

yeah. And so, yeah, it's just We talk about how much we hate XML, but guess what else is XML kinda? HTML.

Oh, hey.

Rid get elements by tag name, items. Got it. 1st one. Alright. That's the episode. Got it. Scott, though, we have a a syntax

API endpoint to grab the shows and the latest shows if you want that. Say what? From our website?

Yeah. Oh, I was pulling it from Synology.

So maybe that's yeah. Oh, I'll grab that from ours. Synology?

Or Or Synology? Yeah. Lib Libsyn. Yes. Not from Synology. Libsyn, rid. Siblin, Libsyn. Yeah. It's all the same to me. Yeah. I use the the syntax API on my website to pull the latest show in. I don't know

Why? My brain was like, oh, we gotta use Libsyn. Oh, they don't have a I guess I gotta use XML. I didn't even think about it. I don't know why I didn't. Okay. Yeah. Because pulling in the RSS feed is massive, probably, like, megabytes of data. Right? You're probably doing it server size. It doesn't matter that much. Rid Yeah. And I'm doing it lazily anyway. So so Oh, yeah. That's fine. But

I would do it better the other way. Next question we have here is from Paul m. Not a pollock question, but for one of your quizzes, I just wanted that I just learned the answer to. Why are radio buttons called radio buttons? Do you want me to get my my guess here? I want you to guess. Yeah. This is a a pre Google. My guess rid

is that they come from a car radio, a car stereo, or not even probably predate that. It probably comes from the AM FM on, like, a normal radio That you have, like, a a thing because you have those AMFM buttons. Those are toggle buttons. When you click 1, one goes the other, whatever.

The other one unselects. Yep. That's my brain. That's where I I the like, the first thing I think about. Yeah. Because they physically you can physically only have 1 down Yeah. At a time, and when you press 1, the rest oh, that's good. I was thinking, like I don't even know what I was thinking. So let's Google it now.

Radio buttons were named after the physical button used on older Razer radio select preset stations. When one of the buttons was pressed, All the other buttons would pop out. If this was stumped, I woulda just won. Man,

you you nailed it. I'm impressed. Car radio. That's my first thing went to car radio. That's where I went. Doug DeMiro.

There's a whole Wikipedia page for radio button.

Yeah. You could see Doug Demir really pushing these things and saying, oh, I love the the feel of this button.

Impressive. Good job, Scott. Hey. Thank you. You know what else is impressive? One of our sponsors, that's LogRocket, is the perfect place to visually see all the errors and exceptions happening in your along with a re session replay video. So some bugs happen, some stuff happens in your site. Hey. You get to see it happen. You get to see how and why that happened. You could just scrub that video replay. You get your Redux Or if you got it. You get that network request tab, which we all love, that network request tab. Right? That's probably my my goat of, Chrome dev developer tools tabs. So I, you know, I personally really, really am a visual person. So being able to see how and why and where and these things happen, it really makes or breaks bug solving for me. So you wanna check out LogRocket at logrocket.comforward/syntax.

You'll get 14 days for free. Definitely one of those services rid. That you gotta see to believe. Give it a try. Throw it on your site. The 1st time an error comes in and you'll be able to see how exactly that happened, you're gonna be feeling very, very happy about that. So Check it out. Logrocket.comforward/ syntax.

Alright. Next question is from Malin.

She asks, I am midway through Post bacc in computer science. What's a b a c c? Bachelor

Post baccala.

Post re program are reserved for students who are working towards a 2nd bachelor's degree Yeah. Or a 2nd entry degree. These programs are offered

For those who already have a 1st undergraduate degree. Oh, wow. Well, I've hardly got through my first one, so I wouldn't know that. Yes. Rid. Yes. Likewise. Actually, that'd probably be good for me because I went to school for music and, Oh, there you go. Yeah. You get that CS degree. I recently quit my job 1, could it make me money now? 2, help me hit the ground running when I graduate.

3, rid Get a job easily for make all kinds of cash.

Okay. So Melon is all about stacking that cash here. She's it's her money, and she wants it now. What's that? That was like a ad like a crappy ad on TV. It's my money, and I want it now, rid. JG Wentworth. Alright. Yeah. What's that from? Yeah. I think it's JG Wentworth. Could be. I don't know. Either way, she wants to make money now, hit the ground running, rid Get a job easily and make all kinds of cash. So extra time. What do you wanna do, Madeleine? You wanna start a blog. You wanna start a YouTube channel. Wanna start a Twitch channel. You wanna do any of those things, and you wanna document what you're learning, when you're learning, and how you're learning, and the things that you're learning. Because rid. As somebody who's in your position, there's bound to be other people who have not necessarily even a similar position, but maybe you're in a similar stage of life and could learn directly rid People like Wes and I, we teach the stuff that we teach, but we can't teach the stuff that you can teach because you have very specific rid. Types of knowledge, and as you're learning things, your brain is going to decipher them in different ways. So if you want to set yourself up To be, you know, all of those things, make money, get a job, hit the ground running, I don't think there's a a better opportunity than to Start some sort of a resource where you're sharing what you're learning and you're sharing it, sharing it, sharing it. The best job is the biggest, high paced, highest paying jobs I ever got. Rid. Let me tell you. My YouTube channel came in so handy in those job interviews, oh, and I could teach the interviewers a thing or two about what I was learning or why, or they could see that I was re Putting my knowledge into work, and the side benefit is it paid my rent at the time. So, you know, that's where it's at, and I I really honestly think you'll get a much better job if you set yourself That way, if you wanna be doing as many things as extra as possible, is that that's what you're saying, I I would just go forward Teaching what you're learning. Yeah. I I love this question. First of all, I thought it was really funny because you wanted to make all kinds of cache.

But, also, like, to me, ideally, is you can make money doing something as well as set yourself up for the future rid as well as help yourself get a job. And I think Scott nailed it there. Is that sharing what you know online, whether that is YouTube or TikTok or Twitter or writing a blog post or literally anything.

We see a lot of people come to Scott and I and ask us, how do I do what you are doing? And, unfortunately, is, like, you Can't do it that quickly, so I'm glad that you're thinking about it now because, if you set yourself up for doing all the things that we talked about, rid Then you are going to you can make money in the meantime. No problem. You can you can put ads on there. You can you can make money on YouTube ads. Rid TikTok has a thing. I've I've been watching a lot of TikTok lately, so I'm that's why I'm saying it. I can tell.

I really like it. I thought it was a silly thing where people dance on it all day, but, man, it's like a mini creator platform where people who who are Super knowledgeable about random topics. Share what they know on it, and, apparently, people get you can make money on it as well, which is really cool. Read. I've heard that the the the biggest

strength of TikTok is just that the video editor is, like, teaching a whole army of read. Video editors for the future where that's like a a skill that you'll just like, the video editor in TikTok is supposed to be very good. I haven't used it, but I saw one where a, an older lady was Trying on a bunch of clothes, and she's spinning and throwing a hat and doing all this, like, crazy stuff, and I watched it over and over again. I thought it was just unbelievable.

Yeah. The the video editor is is amazing, and I I think I need to start making things because it's exactly what I you and me do is we rid are knowledgeable about something and share that with other people, whether it's YouTube or it's podcast or on Twitter. And, like, just TikTok is just where younger people do that. Anyways, TikTok, I think you should spend all your time on TikTok. But like I said, just put investing in these types rid thing or something you can make cash now, and it's really gonna set you up for either getting a job or launching something larger in the future. So Wes says, rid TikTok. TikTok.

Bye now. Okay.

Next question is from Tihas Argual.

What is your opinion on a Rust rid GraphQL server for a web back end. Do you think it is better than Node. Js? Not part of the question, but just a comment. I found you yesterday.

And, dude, I have to say, you are legendary.

Thanks, dude. He's talking about me, I think.

Oh, this is Scott. Yeah. Obviously.

Just I am 13 right now and also started web development when I was 12.

Scott, we need to make money now because these kids are gonna take our jobs.

Yeah. That's the first thing I thought of. That's why I put this one in here. Yeah.

I have been looking for a good web development podcast for 4 months now. Oh, man. We need to do better outreach if this is what the teens Young teens are finding, looks like I found the one I need. Wes, Syntax on TikTok. Let's just make up the joint Syntax account. It's actually not a bad idea because you could we could take the clips that we have. If we start recording video, we could do clips.

Anyways, Teejas, Young young buck, what do you think about a Rust GraphQL for the back end? I think that if re You really need the benefits of Rust, then, yeah, go for it. But you probably don't necessarily have the problems that Rust solves, rid And being able to use the entire JavaScript ecosystem, be able to share things from the front end to the back end, I think that's a bit much of a bigger benefit. Plus Part of the whole point of GraphQL is in the name. It's a graph, meaning that you can stitch together things rid from multiple services if you need to. So if there's something that only Rust will do or Rust will speed it up like, I was listening to the CodePen Radio podcast, and they were talking about how some of their processes went from days to, like, minutes.

Like, I think it was, like, database processes that they were doing. They were switching it over from Ruby to Rust, and, like, that's that just shines rid for, why Rust is so good. So I thought that was a really good example of, like, why you might wanna use Rust, but I doubt that you as a 13 year old are having any Mhmm. Scaling issues. So unless you wanna specifically learn Rust, which is a good idea, I would probably stick with pure JavaScript in my own opinion. Yeah. I I think you nailed it. And and I actually heard something very similar with, Mongo Compass. They, rid Like, in their analytics or whatever in that app, they had changed it to be in Rust, and we're we're doing it via WASM and seeing huge benefits. But,

Really, those are problems that they needed to solve. And for the most part, like, we have a a a Mercurius GraphQL API, which is Node. Js. Right? And it is very fast. Like, I don't I don't think I needed to be any faster right now, but if I did, you know, maybe you'd think about something like that. And like you said, You could always port parts of it to be part of like, it it's an external thing. Also, another use case could be if you are very good at Rust. Like, if if you're like a Rust head, and that's, like, what you wanna do. Like, you wanna be good at Rust. Rust head. Is that what they're called? Rust station. They're called rust stations. A rust.

That's that's great. That's literally what they're called. Yeah. Really? Yes. Yeah. Because they're they're, the the logo is a little crab.

Oh,

wow. Yeah. That's genius. That's way better than we don't have anything like that. Yeah. No. It's a fantastic I love the rust station thing. There's a podcast, New Rust Stations, that I really liked.

If you are, like, very into Rust, that would be a cool opportunity to just Goof around and try on some things or or or, you know, it's not gonna be a problem.

But like Wes said, if if your JavaScript and everything you're doing is in JavaScript, keep it all in JavaScript. I don't think you're gonna be hurting for that extra performance unless you're running into some issues. But, again, you are, 13 and And thinking about these problems, so you'll probably be, you know, my boss at some day. Who knows? Yeah. Wild stuff. So, congrats on on on, really having a good eye for this stuff, and and keep it up. Keep it up. Keep up the good stuff. Absolutely.

Yeah. Next question is from Tom. Hey, guys. Amazing show and great work. Thank you, Tom. Whenever I feel tired and frustrated about something code related, I just listen to an episode, and my motivation comes right back. That's great. Here's my question. How could you go about introducing React to existing big websites with a lot of legacy code and a template based CMS? I can't do a full rewrite, but would love to start turning bits and pieces into a single page experience to check out. Slowly modernize the site. The front end is already TypeScript and SCSS, but it's old self made framework and the content coming in from a CMS is mostly put into data attributes right into the I don't really have an API for most content.

How would React hook into existing DOM in different places, loading data from the Template or potentially writing it back to the templates as well. Cheers from Austria.

Wow.

Tom, this is an interesting question and definitely one that I think people Often think about, like, a React application needs to be a full application.

Right? You could reenter React. You can render React into a dev rid Of any pun anytime you want using React DOM, you can just pick any div and have that render in just like you would do so by attaching, re jQuery to a specific item. So if you wanted to do, say, the checkout in React, which by all means is a great candidate for that because checkouts are rid Complex state management opportunities there. Definitely would be a giant pain without something like React to Me. I don't see any any problem in just doing explicitly that. Rid. You you would render check out into that. I mean, that's a a good candidate for it. Just pick a dom, and and you can do all your React stuff and just have it be that one little component. Maybe move things over here or there or whatever before eventually maybe doing more in, and you don't even have to. You can just keep it in being these little things. So, that's one little bit. Wes, I'm gonna let you do the, initial data thing because I know about this because we do it for server side rendering, but you wrote it, so I'll let you take it. Rid. Yeah. I think it's totally normal or not normal, but this is a very real world problem where you don't have this perfect situation

Or you can just build this app from the total total ground up, and you have APIs for every piece of data that you want. The real world is is that Sometimes you don't have the APIs that you need, and sometimes the data that you do have is just dumped into the DOM via server rendering. Rid. So what you'll need to do is make some sort of, like, useEffect hook in React that when the component mounts, You literally use regular Dom APIs to go and parse out that data. So whether that's looping over a bunch of nodes and Parsing the dataset from each one, which is our data dash attributes, or whether that you can get the server side just to do a JSON dump Into a input with the type of hidden. I personally do that on my own, website. If you view source while you're watching a course, You'll see that all of the videos and everything are just dumped into a hidden input, and then I pick that up with React on the rid on the client side and then start to render out the the video player from there. So that is a very common thing even with, like, server rendering. Right, Scott? You use this. Yeah. If you use server rendering, it needs to pass a whole bunch of data from the server to the client on the initial render. And rather than waiting for the page to load and then sending a request to the server, you can just pass that in the HTML. And if you view source On Instagram, you'll see that they have a massive dump of JSON

that is injected into the thing. Every time I say massive dump, you It's very funny. I it's very funny to me. I'm sorry. I'm a child. Yeah. This is commonly how it is done with, like, server side rendering because you think about it. Right? Rid The API, your GraphQL API, your your REST API, whatever hits this data on the initial thing. And then if it does the rehydration, it would have to hit that data again. So, like, what you do during the server side rendering process is the server hits it, and then it just filters that into a JavaScript variable that makes itself available rid to the EUI, and then you just pick that right back up on the front end and use it for rehydration so it doesn't have to or, in in my case, rehydrate the cache rid of Apollo so it doesn't have to go refetch all that data. So definitely options there. But, yeah, I think you should give this a try, especially for the checkout. I think it seems like a good opportunity. It sounds like, either way, you got 2 apps that need to talk to each other, and one of our sponsors has made their bread and butter off of people talking to each other. That's Vonage. Wes, do you wanna talk a little bit about Vonage? Yes. So we're we're sponsored today by Vonage, specifically, the Vonage API developer,

which is everything you need to build and connect rid. Applications with Vonage API. So they they have APIs for sending SMS, for talking to each other with with voice, As well as video, they have a conversation API. If you wanna do chats, that's something that is currently in beta.

They've got account management API. So I've said it before. These are the hard parts of your application, voice, video, SMS, authentication, accounts, all of that. Those are hard parts, and those are Core fundamental parts of your application.

And if you need help with that, you wanna reach out for Vonage APIs. You wanna check it out at rid Vonage dotdevforward/ syntax.

And if you use the promo code syntax rid Ten. You're gonna get €10 of free credit when signing up. So that's a pretty good deal because you're gonna get you can use that on video or SMS or any of these APIs that you have. Thanks so much to Vonage developer APIs for sponsoring.

Next question we have here is from JMS.

Hi, guys. Thanks so much for doing a tremendous job with this podcast. What's the best way to host personal projects from end back end for free, in quotes, On the web or in stars. I would like something where I can SSH into and install, for example, Node. Js in a database. I already bought a domain, but I don't wanna pay some premium plan because I'm short on money, and it's for personal projects. Anyways, would really like your insights. Thanks so much. Hello from Austria. So I don't think that you're gonna get server space where you can SSH and do anything you want on that box for free. And the reason behind that is because, first of all, it costs companies money to run servers. Right? And if they rid. Cannot lock those down in any way, meaning that you have full root access to a box where you can SSH into it, Then that's just right for people to start mining Bitcoin and doing nefarious things on them. So it's not that that wouldn't necessarily be profitable, rid Like like DigitalOcean or Linode or someone that could have, like, a free plan where you get 10 megs of RAM or something really, really small. Right? That probably would work, but the free plan always, always, always attracts bad people. So that's why you often don't See really good free plans. So there's that. You're not gonna get it. That doesn't exist out in the world. You can get things for rid For $5 a month, which I think is pretty affordable. And and that's probably what I would recommend you doing. I know you said money is tight, but rid. $5 a month. Do something. Write a blog post. Throw some ads on it to make $5 a month, and you could you could pay for that. Otherwise, What else is there? There's services out there that will allow you to still run these projects and still host your projects for free, And, usually, there's there's not a whole lot of limitation in there. So, Vercel is a good example.

I should say with all of these free things, They will probably go away at some point because that's their business model.

Not to go away, but their business model is to Get you in for free, and at a certain point, their business model will change, or they'll get bought or something like that, and then they will deprecate those. So we saw that with Vercel, which used to be now. We saw that with Meteor too. Meteor, it pretty much happened with Every service ever hosting will go away.

Except for Netlify.

Yeah. Netlify is a good example.

You can also use things like Glitch, rid CodePen, CodeSandbox, specifically Glitch, and CodeSandbox will let you run server side code as well. I don't know how they are rid Stopping people from mining Bitcoin, but I'd be curious to to see that. Yeah. I have a a sneaky suspicion whenever these free Services go away. It's because they cannot deal with the amount of bad

either spam or DDoS attacks Or Bitcoin mining. That is happening on them. I think that I don't know anything, but I bet that's what's happening. I think in Meteor's case, it was just too expensive. I mean, they're from firing up all these servers. People are just throwing a bunch of hobby projects on there, and it just got too expensive. Right? Rid. Coin mining thing is is a little bit bigger of a deal than it was then, so that sounds like something that I would not want to deal with. But it seems like, you know, rid problem that could be solved, but still, I don't know. I don't wanna deal with it. I think you really nailed it on that one. I don't really have too much to add to this one. Rid Oh, I should also say, once you have your DigitalOcean

box or your Linode box or or whatever hosting provider you're using, rid As long as it's a Linux box, go ahead and install both Caddy Server like we had on. Let's go listen to the episode on Caddy Server, as well as rid. What's the one that I'm using on my PM two? PM two will allow you to run multiple processes, specifically node processes, And then you can run as many as many projects as you want on a single box as long as the resources. And And if these are just hobby projects or side projects, they're probably not getting slammed with traffic, and that's great because that's how I learned to code as well. I had a PHP server, And I had 40 projects, and they're HTML or WordPress projects. I could just throw as many as I wanted on a server and run them and put custom domains on them. And that's what you want because you want to be able to

host all of your projects without having to you can't spend $5 on every single one. Right? Yeah. And if you're on DigitalOcean, then they got or even if you're not on DigitalOcean, they have some really good documentation on DigitalOcean for locking down your servers and stuff and, you know, changing the parts and changing the root user stuff. And so that way, you can be confident you can hack away on that stuff and have as many projects up as you want And, you really treated it as sort of like a hobby thing, which is, you know, again, like what Wes said, that's what I learned how to do on 2, and, That was very valuable experience there.

Alright. I think that's it for all the questions. Thanks everybody for submitting them. We this is the 2nd rid potluck we did in a row just because, like, those were all very good questions, and I felt like we were skipping over some of the really good questions. So we thought we'd do another one. I know the potlucks usually get some really, really good listens as well in the stats. So you like them. We like doing them. So thank you for submitting them. Keep them coming. Syntax. Fm. Click on the submit a potluck question button and send us your questions. We would love to answer them. Zig.

You got a sick pick for me today there, Scott? Sick picks. I, I have a sick pick for you here today. Sorry.

Rid Wait. You had this to open. If you have 1, you can take it. I got 1. So we're currently up at our cottage right now. And for my daughter's birthday, she wanted walkie talkies.

And I was like, absolutely. We can do that. That is so much fun. Yes. I remember having walkie talkies when I was a kid. So I I did my usual thing where read. I did a bunch of research and found out, like, the Motorola ones are the best, and I was like, these are super expensive.

Rid. There's gotta be, like, the Amazon version of them that is even better.

And I know people give Amazon a hard time for Not having good quality stuff or whatever. But, like, usually, when I'm looking for, like, some sort of tech that has been around forever, rid. And I don't wanna buy the, like, Motorola version of it because this is just for the kids. Usually, Amazon has a really good version of that with some random brand name on it, And that's what I got.

It's the Retevis RT 45 walkie talkies. Comes with rechargeable rid. Lithium replaceable, rechargeable lithium batteries, which is really key so that if you wanna carry backups that are already charged. If you just wanna throw double a's in there, you totally can, but you can also just recharge the thing on USB, rid Just best of both worlds. Or if you like Scott has the external lithium charger, you could throw them on that as well.

And these things go super far. They say rid. They say you can go a kilometer. We definitely went further than that, and it was super clear up here. I if you're in a city, it's probably a kilometer, but I'm excited to try them on the boat, and and we just clip them to the kids. And then you're able to talk to them even if they're biking. Like, you know, you you go biking with your kids, and they're They're, like, in a 100 feet ahead of you, and then you say, alright. Stop. You you we have to catch up to you now. It's nice just to have a walkie talkie. So we bought 2 of them. Now we're gonna buy another set rid Because my wife and I wanna have be able to, like, say, hey. Can you bring me a beer down and, have, like, a adult channel or something like that?

Do you know what? We've been using a crazy amount lately on the Apple Watch. There's a walkie talkie function on the Apple Watch. Really? And And since it it's on your wrist, it buzzes you. So, like, if Courtney let's say she's doing bath time, I'm I'm upstairs doing the dishes and one of the kids having a hard time and she needs me to run down and help, I get a little buzz on my thing, and it's a walkie talkie. And she'll be like, beep beep.

Hey. Need some help, and I'll push it. And they'll be like, Roger that coming down. It's funny because we use the radio we use the walkie talkies because you kinda got you know, you know, Roger that over and out, that kind of stuff. Got you gotta do it. Oh, yeah. My my call name is kitty cat. Oh, nice. Nice. Nice. Yeah. I need a I need a call name. But, yeah, we've been using that like crazy, and it's really cool. I I would love to have a a set of walkie talkies around for something like that. I got one on my wrist, but for kids, you know, you know, the kids aren't gonna wear an Apple Watch. Apple Watch, man, I Have been every time the Apple Watch comes out, I look at it and go, not yet. But

recently, I've been seeing a lot of things that rid One day, I'm gonna make

the make the pull the trigger and get an Apple Watch. It seems so cool. The the fitness stuff is really fantastic for it. You know, we rid We we do fitness challenges. Currently, Courtney challenged my dad to a fitness competition, and my my my dad got one. And They have both been just trash talking like no other, and I've never seen my dad work out so much, at least recently.

And in like, I'll I'll get the pings. You know, my dad just finished a workout, and then I'll see Courtney. She's she's getting the ping, and she's like, shoot. I gotta catch up. They're neck and necks. Rid. It's it's very fun. It's a blast. My second pick for today is going to be the Wyze sprinkler controller. We've used several Wyze products in the past, rid And I recently got their sprinkler controller. So if you have, all all you homeowners out there who water your sprinklers with one of those old dark knob turny ones, I have ascended into smart sprinkler territory. This thing is $57.

It is cheap for this type of thing. I know other other setups cost a lot more. Oh, yeah. Rainbirds, 100. Yeah. And It was the easiest install. I mean, you just plug it in, and then each of the wires that you have for each of your zones just scoot right into the thing. It's, like, connecting a or something like that. The the install took me, like, 10 minutes max, and then I took photos of all of the zones, because the app is really neat. It's just the Wyze app, but I have photos of all of the zones for the sprinkler in my phone, and I can say, oh, just water this zone, and I can tweak it or whatever.

The best the single best utility so far that it's been for me was, like, it's springtime here rid In Denver, we're turning on the sprinklers. I'm getting it started. And, you know, you always gotta do that sprinkler check to make sure which of the heads are working.

Instead of having to run up and down or or tell each zone to run for 1 minute, I could just say, hey. Zone 1 run right here. And I didn't have to leave the zone. I could see all the head. Oh, hey. It works. Let's go to the next one. It was really nice. So this thing for $57, it was totally worth it. And, you know, I I might not pay $150 for a smart sprinkler controller, but I'll pay $50 For a smart sprinkler controller, that that seems like a a good use. And and if you go water sensors, if you pay for Wyze plus, which I'm not or whatever, You can get all sorts of, like, weather integration stuff, but you can get water sensors to sense how how watered all of your zones are, and it works all really nicely. So,

Really neat. That's cool. Man, why is this coming out with so many cool things? They for April fools, they came out with the car Yeah. Where you stick a rid I actually got one, so it hasn't come yet. Did you? It's a it's a real it's a real I thought that was just a joke product. No. No. It was real. It's like a like a Wi Fi based rid Remote control car where you can see where you're going. Oh, that sounds so cool. It was, like, $50. I was like, my kids will love this. Kids would love that. Yeah. So I I haven't got it yet. I'm excited to try that. I also got a scale a smart rid Gail to track my weight over time, but I didn't get the wise one because it's hard to get wise stuff in Canada. Yeah. I I got the, I forget which one it I won't sick pick it yet because I don't know if it's any good or not, but I'll I'll give it a couple months, and we'll talk about it. I have a u Unami

maybe. Oh, got it. Eufy. Oh, Oofy. Eufy?

E u f y. It's the, like, same company that rid sells all the Onkar stuff. Yeah. Yeah.

So the coolest thing about having a smart scale was because I've had mine, since 2016.

So now 6 years of tracking my weight. Oh. It's so funny. You can see, like, The over time, how my weight has gone rapidly up, and it's very funny, rid. But it it gives you a lot of info useful information. I can track it and whatever, and I'm not obsessed with weight as being some sort of a metric for how healthy you are. But It is really nice to be able to see. If you track yourself at the same time every day, you get those metrics day after day, year after year, and it's really fascinating to see, so I I I really like having a smart scale. Wes, we gotta do another fitness episode. Yeah. We need to do pandemic Our annual fitness episode. Coming out of the pandemic fitness. Yeah. Yes. Yeah. We should do another fitness episode and another smart home episode. Yeah. I'm in. I'm in for both of those. Cool. Well, that's all we got. Shameless plugs today. I'm gonna plug my latest course, and believe it or not, it's not even my course this time. This is a course from A guest content creator on LevelUp tutorials, Brian Douglas has created a course on GitHub actions, and it is fantastic. So head on over to level up rid. .Comforward/pro sign ups day, and you will get 25% off if you sign up for the year. Brian works at GitHub. He's rid. Totally fantastic, so I'm super excited to have him teaching a course on level up. You're you're absolutely gonna love it if you're a subscriber already, and if you're not, Get on it. This is, of course, to check out. GitHub actions power so much of what we do and level up tutorials from running our tests to running our TypeScript rid code on PRs and stuff like that.

It is very good, and who better to learn from than someone like Brian who literally works at GitHub on this stuff. So check it out at

re level up tutorials.comforward/pro. I am going to shamelessly plug all of my courses. Wesbos, w e s b o s, .com forward slash courses. You can check out my advanced React and GraphQL, Master Gatsby, beginner JavaScript. You name it, you can take it, And you will enjoy it. Thanks so much for tuning in, and we will catch you on Monday.

Peace. Peace.

Head on over to syntax.fm for a full archive of all of our shows, and don't forget to subscribe in your podcast player or drop a review if you like this show.