Potluck! Node Versions, Old Man Internet, Responsive Design + 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 Boss.

Welcome to Syntax. We got a potluck for you today. This is where you send in the questions. We will ready. Answer them. It's a great episode full of all kinds of really good questions.

We're gonna get right into it. We're sponsored by 3 awesome companies today. Prismic, rid. They are the host at headless CMS, Sentry error exception performance tracking, and FreshBooks online accounting bookkeeping software. We'll talk about all of them partway through the episode. With me, as always, is mister Scott Talinski. How are you doing today, Scott? Hey.

Doing good, man. I'm I'm, Just tweaking my tweaking my shell here a bit. Not my turtle shell. My, or not my prompt. I guess it's my prompt. My my prompt.

Yeah. I I'm I'm trying to own my posh. I don't know if you've seen that, but it's pretty neat. Is that a is that a sh prompt? Or It's a zedash prompt and A lot of really nice config options, a lot of really nice default themes, and a ton of really interesting features. So I don't know. Give them a check. That's cool. I,

rid. I recently switched over to Warp, and they because they finally let you use your existing prompt on it. And, I was very happy. Although, like, one of the features of Warp is the ability to keep all of your prompt and everything rid. When you're SSH ing into another box, which is great because, like, you have you ever, like, you log in to a server or even you log in to your Synology And like you've lost all your Yeah. I hate it. Everything that makes you comfortable in the shell. So one of the features of of warp is supposed to be that you keep all of that and all of your shortcuts Cuts and everything. I could get to work. I don't know what what I'm doing wrong, but,

I really want that. I know every I think about installing ZSH on, like, everything. Like, whether it's Yeah. My My Raspberry Pi or any of that stuff. I'm like, well, yeah. Take some time to install some ZSH on here, and then think about it. I'm like, I think I can get by ethically.

Rid. I I had it on all of my servers, and it was great. I just and I just set up the, like, prompt to be random.

I guess I didn't need a whole lot of stuff in there, but it was nice to just have a have it better than rid Like the brutal terminal that comes by default, you know, or the prompt. Sorry. Brutal brutal prompt. Yeah.

He always had to type PWD to find out where you are, and rid. What a awful, like, initial experience. You know? Yeah. I hear you. Alright. Let's get into the first question here from Nick Hebert.

How do you generally resolve errors when starting up a project with NPM that you haven't touched in a while? Is perhaps the version of node for the project isn't installed in your machine? I generally find this happens. My solution is recreating the project every single time, which isn't sustainable, And the projects will never continue.

I can't seem to find the node version for the projects.

Gatsby JS, in this instance, big fan of the show. Alright. Yeah. That can be a bit of an issue because I've said this many times is web development projects rot Over time, mean that you unfortunately can't just leave them, especially if you're just using Node v like most of us, you're rid. Just using Node in your command line and you're updating versions of Node and the older version of your project was installed with a different version. So Generally, the way that I'll approach one of these things is, first, you can throw the entire thing into if if this rid is really a big issue for you or this is mission critical, you could throw this entire thing into a Docker image. And what that will allow you to do is to rid Isolate literally everything about the project into its own image so that other things on your computer are not rid not running like giving you you grief about that type of thing.

Second, generally, when you switch node versions, You're going to want to do an npm install again on your project. So just nuke the node modules folder.

Sometimes delete the package lock file, but the benefit of the package lock file is that it spells out exactly what version of every package was used to install were running. So if you delete the package lock, Then you are going to get the latest, like let's say it was working on 4.2.1 And now 4.2.6 is out. If you nuke your your package lock, you're gonna get the latest 4.2.6.

Like, not the latest, latest. Like, if a 4.6 comes out or a 5 comes out, you're not going to get that, but you'll get the minor version released. And rid Most cases, it's not a big deal, but it could it could be. So nuke the node modules folder and run npm install again, and that usually gets you there.

Very rarely do projects drop, like, full node versions.

Unless you're coming, like, rid 3 years later, you're gonna you're not really gonna have it. Have you have you run into that where, like, oh, like, it was made on Node 15. Like, Some of my stuff runs 10 versions node old, and it still works great. I actually do run into that at at various points where, rid

Just something will work. Even I think there was, like, a Svelte could update I did recently where they popped up the node version I had to update. But I I actually found it quite a bit with, rid I think it was, like, Gatsby projects in the past to, like, change the node version.

That but I I like to keep on top of that anyways just They have a newer version of Node. You know, you gotta have those latest goodies and all that stuff. So you know what I I found interesting, Wes, is that, you know, you've been using PNPM. Right? Yeah. PNPM has a thing in their package dot JSON Oh. That allows you to specify the node version. And that this might be things in in outside of PNPM as well. But in PNPM, you can have an engine's property, and you can specify a They like a greater than 17 point o whatever for node version, but also for PNPM version. We recently updated our PNPM to version 7, rid. Specifically, 75 something because we wanted to take advantage of the new patch package stuff that's built in. And so I added these rid. Support. And sure enough, when I went to deploy my site, it yelled at me saying my node version wasn't high enough, so I, had to tweak my node version. So, yeah, I use that engines to make sure

that whoever's running it isn't running on an older version, but I I don't get too much into the Docker stuff myself. No. Me neither. Like, I've I've never been, like, a fan. I I understand the benefit, and I use Docker for everything on my Synology. But rid. I've never been one to, like, oh, let's make a Docker image of this. And I know there's people that are bonkers over are doing everything Docker, but Yeah. It's not for me. But That engine's property is a standard field in your package. Json, and it will warn. So you can set your engines for npm and for node, rid. And you can set, like, greater than or equal to and less than or equal to, or you can set the exact version that you need.

Rid. And if you do not have that version, it will throw a warning.

You can also, in your npmrc file, You can put an engine strict equals true flag and it will literally not let you start it. That's kind of a pain because then like because NPM itself doesn't have a way to switch what version of Node you're on, and then you're going down the rabbit hole of trying to figure out that out. So it's a bit easier with