872: Too much AI × Disappointed in Firefox × Planning New Projects × Hard Truths

Wes and Scott answer questions about HTML semantics, TypeScript, adapting to AI’s impact on web development, and the best and worst browsers for developers. They also tackle project planning, deploying SvelteKit apps, and navigating online opinions in tech. Show Notes 00:00 Welcome to Syntax! 01:04 Best container element for a grid of products? 04:50 TypeScript null checks 09:44 Adapt to AI or get left behind Syntax Episode 870 13:13 Why did 3D never take off? three.js React Three Fiber Rep Fitness Rack Builder Maxime Heckel GitHub Universe The element 18:53 Podcast audio and video in one feed? Who Smarted? 21:06 Brought to you buy Sentry.io 22:30 Best and worst browsers for web dev? Firefox Edge Chrome Arc Safari 27:39 Why use a lock file for managing dependency versions Don’t gitignore your lock files! 30:34 Should you build your own sync engine? Scott’s Naive Sync Example 34:21 Best practices when starting a new project from scratch Habit Path 38:33 How to deploy a SvelteKit app on something other than Vercel or Netlify Coolify Crash Course 42:54 The reality of online opinions in tech 48:10 Spending $120k on an app idea 54:12 Sick Picks + Shameless Plugs Sick Picks Scott: My Mind Wes: Metal Detector Shameless Plugs Scott: Syntax on YouTube Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott: X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Speaker names marked ? are inferred from speaking time and the show’s known hosts — they are not voice-verified.

• 0:00Scott Tolinski?

  Welcome to Syntax. Today, we've got a potluck for you, which is you bring the questions, we bring the answers. We've got some really good questions today on TypeScript null checks. How do you check if an element is there before you go ahead and use it? What's the best approach for that? What's the correct HTML tag for items in an ecommerce store? Finding good opinions online. Somebody needs the truth. Spending $120,000 on an app idea and getting nothing. Awful story. And how to plan a new project.

• 0:29Wes Bos?

  You know, one of the questions we got in the potluck is when are you going to stop using this janky Google form?

• 0:34Scott Tolinski?

  Yes.

• 0:35Wes Bos?

  Which, we should move it over because we wrote the submission form for a couple other things, for the spooky story submissions, for the open source sponsorship thing. So it just needs to be switched over because yes, it's... A Google form is always a failure of your infrastructure.

• 0:53Scott Tolinski?

  It's maybe not a failure, what it is. It is a, it's an acknowledgement that my time is more important.

• 0:59Wes Bos?

  It's lean.

• 1:01Scott Tolinski?

  Yeah, it's lean, right? Yeah, totally. All right, let's get into the first question here from the Ponderer. What's the most appropriate container element for a grid of products on an ecommerce store? I'm building a storefront at the moment, and on the collection template, I'm not sure. What is the best element to use? I'm looking around at major online stores. Div and ul seem to be the most common. I'm wondering why ol never seems to be used, even if a sort order has been manually selected. Presumably, in that case, ordering is relevant. Yes, so I would not use any of these elements for this. I mean, me personally, here's what I'm doing.

• 1:45Scott Tolinski?

  I'm doing a section, each product is an article. That's what I'm doing. End of story. Just CSSing a grid around it. You might see this differently than I do, but I don't personally see products in a grid as being a list, right?

• 2:01Wes Bos?

  I don't think so either.

• 2:02Scott Tolinski?

  Yeah, I don't see that.

• 2:04Wes Bos?

  You think about like bullet points and whatnot, like ol, not for sure. The order is

• 2:08Scott Tolinski?

  Absolutely.

• 2:09Wes Bos?

  Not very important, right? I guess if you are sorting it, but that kind of is inferred, I think. But no, certainly not an unordered list for that. And I reach for unordered list for a lot of things.

• 2:23Scott Tolinski?

  Yeah, I'm the opposite. I'm always asking myself if I, if I can get around this without using an unordered list. Please, for the love of God, don't make me use an unordered list on this.

• 2:31Wes Bos?

  An article is interesting. I would have thought an article is more for like text-based contents, but it's not. What's the semantic meaning of an article?

• 2:43Scott Tolinski?

  Let me double check and confirm this, but the way I use an article typically is for like serial content. You might think of like a, a listing of blog posts or for instance, on the Syntax website, we have a listing of each podcast episode in the listing page. In the listing page, each of those are an article. That is a thing. It is one of potentially many of that type of thing. And that's why it reaches for the product. Yeah.

• 3:14Wes Bos?

  An article HTML represents a self-contained composition in a document page, application or site which is intended to be independently distributable or reusable. So that's the key, meaning that it's its own thing and you are able to click off to a separate URL with that piece, right? Like it's its own item. Examples include a forum post, a magazine, newspaper article, blog entry, a product card right there, or a user submitted comment. So yeah, if it is its own thing, which can be distributed likely via its own URL, then reach for an article. And you, and sorry, you said you'd wrap that in a section, which I agree.

• 3:56Scott Tolinski?

  I would, yeah.

• 3:57Wes Bos?

  Yeah.

• 3:57Scott Tolinski?

  Yeah, because it is, that section of the page is the product listing of things. You could throw in a div, but section's probably more appropriate.

• 4:04Wes Bos?

  Mm-hmm. Along with this is make sure you're also throwing JSON LD in there. If you ever like go to Google and you search for something and it shows you like the rating or the stars or information about a, like a recipe or a product or, or anything like that, you'll often wonder, hmm, how do, how do they infer that data? You should be dumping.

• 4:32Wes Bos?

  JSON LD into the description of that product so that Google knows like the price of it and all of that stuff around it. So we should do an entire show on it because we are also due to add JSON LD to our website as well.

• 4:48Scott Tolinski?

  Yeah, totally.

• 4:49Wes Bos?

  Next question we have from Tim Wrinkle. Hi guys, bollocks are great. Thank you. I'm trying to come to grips with TypeScript while working with a settings form. Whenever I try to access an element, TypeScript wants to make sure the element is there before it lets you go ahead and do anything. Okay, I get it. So he's saying, this is quite a thing with if you're using vanilla JavaScript and TypeScript, which I do a lot, is when you query selector an element off the page, there is no guarantee that that element was actually found. So the problem that he goes on to say is if I want to do something like add event listener on the element itself, you get like a TypeScript error that says

• 5:32Wes Bos?

  my button is possibly null. And that's true because there is a possibility that nothing was found. And if you try to go ahead and run a method on that, then you could possibly get an exception in JavaScript because it'll say cannot find add event listener. So he goes on to say that the ways around it is you can put a bang on the end. So mybuttonbang. add event listener. What that does is it circumvents TypeScript with the non null operator. The bang is very rarely ever a good choice in TypeScript. You're almost always sort of sidestepping TypeScript in that case. And then he also says you can add a optional chaining, which is a question mark. So mybutton question mark dot add

• 6:17Wes Bos?

  event listener. What that will do is it will first make sure that mybutton exists and then go ahead and chain on the rest. So he says both of these are frowned upon in general. The only real solution is you say if mybutton, then go ahead and add event listener, otherwise log out an error. So this is a pain. And this is something that I hear about a lot in TypeScript is people say this is so much. Boilerplate for this type of thing. And, and the answer to that is, is yeah. TypeScript often makes you do, write a lot more code, not just to make TypeScript happy, but because there are situations where you're going to run into these actual errors. And, and TypeScript is finding those possible situations and, and getting them for you.

• 7:02Wes Bos?

  So what would I do is I either create a helper method that will do that internally, or in most cases, I do what you said is I, I'll pop an optional chaining on the end, because that's not frowned upon at all. You're simply just checking if the button exists, and then going ahead and adding the event listener. The only downside to that is it fails silently, meaning that if the element is not on the page, for example, if you, if you mistyped a selector, somebody submitted a, a change to your Git repo and it changed the ID of that button, and it's no longer finding it on the page, you're not going to know that something has,

• 7:45Wes Bos?

  is no longer there, right? So if you care about that, then yeah, you should, you should probably do a long form if statement and then throw an error, submit that data to Sentry would be kind of nice, make a little, um, little helper method for that. Otherwise, the question mark is not a problem at all.

• 8:04Scott Tolinski?

  Yeah, I totally agree with that. And honestly, like you said, it depends on the context, but a lot of the time I am just using optional chaining for these things. And the worst part about TypeScript for me is that it makes me realize how full of holes my code is if I'm just typing it with, like without TypeScript. I'm like, oh yeah, I'm just not even checking things, you know, I'm freewheeling so much stuff. So I'm thankful and angry at TypeScript for that.

• 8:31Wes Bos?

  One more tip I have with this, and I don't love this tip, but it can help you is if you have, like, let's say you have three functions on that page that use that element, that button, right? And if you were to query selector the button, check if the button was there, and then go ahead and define your functions. All of those functions still don't know that the button is there or not. And the reason behind that is because JavaScript hoists the functions to the top of the file. So it's technically taking your functions and moving them above where you have checked if that button exists. So it's kind of a pain and that means you now have to check if that button exists in all three of your functions.

• 9:14Wes Bos?

  So there's, there's two solutions to that is one, pass the button into that function as an element. So that when you call it, you're passing the button as an argument. Or two, if you use a, like an arrow function or a, a function declaration. No, a function assignment, meaning that you stick it into a variable instead of typing out the word function. Then that will not be hoisted and you can, you can do your check above where you define your functions.

• 9:44Scott Tolinski?

  Yeah. Word. All right. Next question from Anon. And this is more of a statement and less of a question. They say, and honestly, I think a lot of people are feeling this way. So I thought it might take some time to talk about it. It says, I'm genuinely so fed up with AI. Can we please get something different already?

• 10:04Scott Tolinski?

  Anonymous submitter, I hate to inform you of this, but that genie is not going back in the bottle. Like we are in this new world and in my opinion, as somebody who loves this stuff very deeply. You either adapt here or you're gonna get passed by. So if I were you, I would take the time and accept that this is the new reality, 2025 and beyond. And harsh truths here, you gotta adapt or die here. I, I think, I think you learn how to implement AI tools into your workflow.

• 10:41Scott Tolinski?

  You see what the hype is about and that doesn't mean you have to take part in garbage AI art or any of that stuff. That doesn't mean you have to take part in garbage AI code, but there are some genuinely very helpful tools out there. Things that will make you faster, things that will make you more efficient. And if your coworkers or somebody that you're competing with for a job is using these things, and you're just like putting your foot down and saying, I don't want to use this garbage stuff. That's gonna be hard for you in the future. So in my opinion, you gotta get on it. And I'm sorry to hear that. It's not going away.

• 11:21Wes Bos?

  I totally feel and understand this

• 11:26Scott Tolinski?

  Same.

• 11:26Wes Bos?

  exhaustion that people are having because it feels like every single day there's something new, some big thing. There's a lot of people with a lot of money tied up in having AI win. And like you have to be, like, we had the Windsor folks on and we're like, hey, like, given that you raised a quarter billion dollars and you need to make this thing work. That's the little caveat. Let's ask this question of if you think it's, if it's think it's going to be the next thing, right? Like, so like, maybe that's my advice here is that when people are talking about this AI stuff, ask yourself, is it somebody who has a vested interest in this type of thing?

• 12:07Wes Bos?

  Because there's a lot of people telling that it's absolutely game changer and it's gonna change you and you're gonna, you're gonna lose your job. And those people have investors to make happy at the end of the day. But then on the other hand, there's people like Scott and I is, we have zero money tied up in whether AI works or not. But we know that unfortunately or fortunately, it's going to be this new amazing thing. And while we would love to just sit around and keep building websites, the way that we built them for the last 10 years is it's not going to be the case. Things are changing very quickly. And you are certainly going to have to learn how to adapt to this type of thing. And I think that we probably will see

• 12:51Wes Bos?

  a good amount of like rage quits from this type of thing. Totally. People do like, this is just not what I fell in love with. This is not what I love. Or I just don't feel like having to reinvent myself one more time. You know, I just want to keep doing the same thing that I'm doing. I think that's, we'll start to see that in the next little bit.

• 13:11Scott Tolinski?

  Yes, I 100% agree with your answer.

• 13:13Wes Bos?

  Next question from Dan P. Why do you think 3D never took off? Example, 3JS, React 3 Fiber. Seems like it could create a cool UX or something unique. That's kind of interesting. Why did 3D never take off? You're starting to see little bits of 3D added as little design elements, as little helpers. I think like for stuff to really take off, it has to also be genuinely useful rather than just look really cool. So for example, Rep Fitness has this amazing, if you want to build a Rep Fitness squat rack, there's so many different options, right?

• 13:57Wes Bos?

  You can get different sizes, different color, different heights, different attachments. It's just infinitely configurable. And they have this like 3D configurator where you can sort of build it online. And that makes sense for a 3D thing because you can spin it around, you can zoom in and out, you can kind of get an idea. You can place it in your space to kind of see what it would look like and how it would fit. So I think that as things become more approachable, it's not easy to build this stuff either, right? Like, and once you move into Canvas, you're giving up all of the niceties of HTML and CSS of laying things out. So I think that it's, it just has its place.

• 14:41Wes Bos?

  It's not going to totally take over absolutely everything. Maybe it will once we, Scott's goggles get more popular, but we'll see.

• 14:48Scott Tolinski?

  Yeah, the goggles are going to have to undergo some big transformations in terms of like, how people are wearing them before they take off. Because I acknowledge that the thing is a big thing on your head, but it is pretty sick. I wore the Vision Pro in my car while working outside of my daughter's dance class yesterday. So she goes into dance class, I go to my car and I now have an ultra wide monitor in front of me and that rules. So once that becomes a better form factor, I do think it'll take off. But that said, on the 3D tip for web stuff, I sincerely believe this has taken off.

• 15:29Scott Tolinski?

  I see websites all the time with 3D and you might not notice it, you might notice it, whatever. They, they might just be there in the background. You know, what you, you don't necessarily see are websites that are. I mean, you do, but not everywhere that are, you know, just completely 3D masterworks all the time. What we're seeing more of is, like you mentioned, background elements, things here or there, shaders on top of things.

• 15:58Wes Bos?

  Yeah.

• 15:58Scott Tolinski?

  So, yeah, I think, I think it, it did take off and it does exist. I just don't think that its place was ever going to be a full takeover of the entire app, in my mind.

• 16:10Wes Bos?

  Yeah, I, I agree. Otherwise, we're, it's flash, right? It's hard to make that stuff accessible. It's, it's hard to make that crawlable. If you put everything into a flat JPEG, like, thing, it's, it's hard to get stuff out of it.

• 16:24Scott Tolinski?

  Yeah, totally. I, I've also posted a link in this to one of my favorite blogs and websites that I've talked about several times on the show. It's Maxime Heckel's blog, his website. It's amazing. It's well worth your time if you're interested in getting inspired by 3D stuff on the web.

• 16:41Wes Bos?

  Sorry, one more thing. A nice little 3D touch is githubuniverse.com. They have these little, like, Octa Cat and their duck. They have all these little animals spread throughout the site. And as you scroll, they turn their head. And I went, if you go into it and like, download both the model and the, the shaders to make them colorful, it's kind of interesting to see how they did it.

• 17:05Scott Tolinski?

  So, I don't know if, if you've seen this, but actually Safari has added an element specifically for 3D that I do think, I don't know if the other browsers have it or not.

• 17:18Wes Bos?

  It looks like it's a draft spec at the moment. That's not to say that it will hit, but they're going through the process of trying to draft it up and they're probably testing it out in Safari to see how it works.

• 17:32Scott Tolinski?

  Yeah, so it could be interesting if that, that ends up coming here. I know that they probably have vested interest in 3D on the web, given they now have a spatial platform.

• 17:43Wes Bos?

  Oh, so what would the model element do that Canvas cannot do? Is it just that you don't have to load 3JS and, and have a canvas? Like, you don't have to get all that stuff in? Like, you could just? I'm sure that they would say like this is a standard model file that works on the web. You could just export that from your 3D software and then it will, you'll have access to it in JavaScript.

• 18:05Scott Tolinski?

  Yeah, that's it. The model element allows for a website to embed interactive 3D models as conveniently as any other visual media. So, yeah.

• 18:15Wes Bos?

  Okay, and it looks like .usdz or GLB files.

• 18:21Scott Tolinski?

  Yeah, GLB is.

• 18:22Wes Bos?

  Are currently, GLB is the, what I've seen a lot. Cool. Also, I think a lot of these, like, going back to the last AI question is, you're now able to like prompt for AI models. So it's going to be getting a lot easier for people to just generate quick little assets that they need.

• 18:41Scott Tolinski?

  Yeah, you, when you say AI models, you don't mean AI models. You mean 3D models within AI.

• 18:47Wes Bos?

  AI-generated 3D models, yes. We're running out of words.

• 18:50Scott Tolinski?

  We're running out of words, I know. I know, it is very funny. All right, next question here from Mike R. You have mentioned this before, but for the video format of the podcast, is it not possible to push audio and video to the built-in iPhone, Apple Podcast app? Mike R., it is not possible. At least if you want to have them within one feed. What we can't do is serve both the audio and the video in one feed. We could have a separate video feed as an entirely set, but you'd have to subscribe to that separately. And then you're like splintering the audience on the podcast. Now you got two separate feeds. It makes more sense for us to do it all in audio. I don't know why, maybe because of the way that the podcasting is kind of the Wild West.

• 19:35Scott Tolinski?

  It was a thing just made by Apple and now it's kind of just this open thing. And I, I would imagine somebody solves this eventually. You know what it's kind of being solved by? It's being solved by YouTube doing more podcasts. And Spotify doing more podcasts. But Apple should do something about that because I know a lot of people don't want to listen in video, but they want to subscribe. Some people, occasionally you want videos, sometimes you don't. Yeah.

• 20:02Wes Bos?

  As much as it absolutely kills me to say this, RSS is dead. Try find the RSS feed for a popular podcast. Try find it. It's impossible. My daughter has this Yodo player and she loves this kids podcast called Who Smarted? And the Yodo only shows them 25, so I wrote a script to download them all. And like, trying to find the RSS feed for that podcast was so hard. Like, no websites have RSS icons on them anymore. And like, it's absolutely wild. And then we have issues like you want video in a while, right? And Spotify solves that. We can upload the video and the audio,

• 20:46Wes Bos?

  or we just upload the video and it will strip the audio for the listeners. And as much as it kills me to say that, because like, believe me, we like it when people use the app with the RSS feed, because we're not competing with like, cooking videos on YouTube. But that's just the way that the general public is going.

• 21:06Scott Tolinski?

  This is the hard truths episode, the episode full of hard truths. Here's a hard truth. Here's another one here for you. Your website has bugs. It is slow. It has issues. And if you want to fix those things, oh, I got, yeah, we all got them. But if you don't want those issues to become GitHub issues, head on over to sentry.io, sign up, use the coupon code TASTYTREAT, all lowercase, all one word. And it's actually at sentry.io/synthesis. We'll have a link in the show notes. Man, Sentry as a product just keeps getting better. You know, we use this thing for all kinds of stuff, whether that's session replay to see what went wrong.

• 21:49Scott Tolinski?

  You get a nice little scrubber, so that way you can visually see what happened. I use the AI tools to help me find like, what exactly this bug is doing. I've identified performance issues with the apps, slow queries, slow pages. Just in general, we push an update. There's gonna be little bugs here or there, old browser versions and stuff. And I gotta say, the Sentry team is cooking, Wes. They're constantly adding new stuff and I can't talk about a lot of the new things just yet. But yeah, a lot of new stuff, a lot of great stuff. It is just an ever-evolving, awesome platform. So check it out at sentry.io/syntax.

• 22:30Wes Bos?

  Daniel asks, what browser are you guys using at the moment for web development? I'm a Firefox lover, but unfortunately I've been disappointed lately since it seems there's not much development and it sometimes lags. Yes, I was Firefox for probably eight years or so. We talked about this on a couple of shows ago. I've been on Microsoft Edge for quite a while now, maybe, maybe four months or so. And I've been absolutely loving it because their dev tools is, it's just so, it's Chrome, right? But they have tweaked the dev tools so that it's like a little bit nicer looking. So they have icons, you can dock it to the left, you can have just icons or icons and tabs.

• 23:14Wes Bos?

  The spacing, the colors are just a little bit nicer, a big fan of it. Edge in general is awful when you first boot it up. So I think I'll maybe do a video of like how to turn off all the garbage Microsoft stuff and get like a good one. And plus like there are a handful of other tools in, in Microsoft Edge that are really nice for web development. They had the selector performance that's been upstream now. You can get that in Chrome as well, but I've been really happy with it.

• 23:42Scott Tolinski?

  Yeah, I think if you did a video on that, it would do well just because people love ragging on stuff like Microsoft. So you can say, you know, how to de-Microsoftize Edge. I, you know what? There's something about Edge's UI that still rubs me the wrong way. We've talked about this repeatedly. I'm still on Arc. I can't get rid of Arc. I just can't quit it. It does so many nice things for me. If I hit Command-T, it takes me to the tab I already have open instead of opening a new tab. That way-

• 24:12Wes Bos?

  Ah, every browser does that.

• 24:14Scott Tolinski?

  They do?

• 24:15Wes Bos?

  Yes, yes. So I'm going to hit Command-T and I'm going to type Riverside and it says, "Switch to this tab," because I'm on Riverside right now. Every browser's done that for like 10 years.

• 24:26Scott Tolinski?

  It says, "Switch to this tab where?" What is, what do you mean? It says, "Switch to this tab."

• 24:31Wes Bos?

  So here, let me, let me share my screen with you there, Scott.

• 24:35Scott Tolinski?

  Oh, but then you gotta, you gotta go over and click on that thing?

• 24:39Wes Bos?

  No. So like, let's, so I've got this Rep Fitness tab open right now, right? So I'm just gonna type Rep Fitness. Oh, it's a Canadian version, ca rep. Okay, I'm, there we go. Right there. Hit it. Boom. Nope, that didn't work.

• 24:58Scott Tolinski?

  Yeah, it doesn't. And you, you have to hit Tab twice to get it. I want it to be the default. I want it to always be the default, unless I specify otherwise. Because that's such a common thing, you know, that, that's just a little thing for me. But like, there's so many nice, useful things. It cleans up my tabs automatically for me. I can do split. I can split a window and have two things like always open at the same time. There's like little issues here and there. The profile management inside of Arc is like second to none. Where I have, you know, my column and I just swipe to the left and I'm in a different profile. And that profile has its own set of bookmarks and pin tabs. And I swipe and it has another one with its own set of bookmarks and pin tabs.

• 25:43Scott Tolinski?

  Like if I have several different profiles, whether that's Syntax, Sentry, my own personal stuff. Like I can just have those workspaces so perfectly defined in a way that feels like, you know, effortless to go between them. I just can't find that experience anywhere else. And I've tried all of the Arc-like browsers that people have suggested. And they're all just skins on top of other stuff. It's, it's, they're not good. Yeah, they're not good.

• 26:12Wes Bos?

  Oh, the other benefit to using Edge, I can't believe I didn't say this, is Edge has not gone away with the Manifest 2 Chrome extension. So meaning that you can still use Ublock, the old version with it. So, and...

• 26:28Wes Bos?

  Because they're corporate, they'll probably have that forever while our corporate clients have these old Chrome extensions that they can't live without. So they'll probably hang on to that for quite a while. Although the container tabs that Firefox had was the best. In every other browser, you have to have like a different window. If I want to have my syntax one open and then I have my regular one open. And that way I don't have to sign in and out of everything or use a stupid Google switcher. And the Firefox tabs was the best because you could have them all open in one set of tabs. For Microsoft Edge, you gotta like create an entirely new profile and you gotta turn off all the same thing, got to reinstall all the same extensions. It's a pain.

• 27:07Scott Tolinski?

  I know. That's what that's what Arc does best, that kind of stuff. So, nice little swipe. You know what I can't get behind is I always want to use Safari, but I just cannot get behind Safari's dev tools. I just, no. They're dead last place for me. I would rather use Firebug at this point. Because there are times when you gotta use them, like you're debugging iOS, you know, something on the simulator or you're connecting your phone to debug something in production or even on just a device and you're like, I wish I was not using these dev tools. Yeah. All right. Next question here from Unlock Me, please. Why would I use a lock file for managing dependency versions rather than just pinning the exact version in package.json? Seems like both of these actions accomplish the same thing, but the lock file is a billion

• 27:52Scott Tolinski?

  lines long and not human readable. MIO, IMO.

• 27:57Wes Bos?

  IMO.

• 27:57Scott Tolinski?

  IMO. Pin your dependency versions, run npm audit often and get ignore lock files. Wes, I'm gonna toss this one to you. You can choose to either answer this one or point it to your video.

• 28:09Wes Bos?

  Yeah, so I just did a video on this question and explained how Semver works and why this is not a good idea. But I'll go through it quickly for our audio listeners. So your package JSON has listings of all the versions of the package that you have. And generally, when you npm install something, you'll get a carrot in there, meaning that you will get the latest major version. So if you have version 2.0 0.0 with a caret in front of it. That will give you 2.0.1 if it's available. But it will also give you 2.1.0. And those numbers mean the first one is a major version, breaking changes. Second one is a minor version.

• 28:54Wes Bos?

  That's features have been added, but nothing has been broken. And then the third one is a patch, meaning that, oh, I fixed something that was accidentally broken. So by pinning those, meaning that you remove the caret or the tilde will only give you the last patch version. If you remove the caret and just give it the package version straight in your package JSON. That will pin the version to your NPM install, but it doesn't go all the way down the dependency tree and lock those versions. So if you install Tailwind version 4.0.0. Tailwind dependencies still aren't locked, meaning that there's a possibility that what you NPM install locally and test against.

• 29:39Wes Bos?

  And what you push to your server and build and CI is going to be different code. And believe me, I've been bit before by not having these things totally locked down. So a package lock file will all the way down your dependency tree. It will specify the exact versions of every single package. So that when you go ahead and deploy it, the NPM install knows exactly what versions are needed. And then you only will update those when you go ahead and rerun an NPM install or NPM update, which will update your lock file.

• 30:13Scott Tolinski?

  Nice. Very, uh, very.

• 30:16Wes Bos?

  Yes, thank you. But go to YouTube, uh, check out the video I did and it explains it a little bit further as to why this is not a good idea. As well, some of the security implications that could come along with, with not lock, not you having a lock file.

• 30:29Scott Tolinski?

  Nice. Cool. Send it to your friends as well. Uh, send it to your grandma. Send it to everybody.

• 30:34Wes Bos?

  Next one from Mark Bozinski. I have two questions. First, when are you going to change that ugly Google form? And now the real one. So we already answered that one. Thank you, Mark, for that push. We'll switch it over. Second, I am building a mobile app using expo to handle the invoices for my business and expenses slash income tracer. All my data is stored locally in SQLite, but I would like to add a sync ability to not lose anything. What database would work best with SQLite for a cheap option? I was thinking to build a simple sync library by myself. Famous last words. I'll just build a simple thing myself.

• 31:15Wes Bos?

  Just to compare timestamps and push data, or maybe it is better to use some sync engine. So yeah, we explicitly had some spooky stories on this year's Halloween episode where somebody tried to build their own sync engine and accidentally like screwed an entire project. So I would probably say unless you're keeping copious backups, maybe don't build it yourself.

• 31:38Scott Tolinski?

  I build one. I can talk about that.

• 31:40Wes Bos?

  Yeah. Oh, maybe. Maybe you can. By the other hand, I don't think there's any conflicts. No, no, no, no. Thank you. So yeah, what do you think? Should he build his own?

• 31:49Scott Tolinski?

  I think there's no, there's no problem with building your own if you want a simple sync. The only time that sync engines get to be tough is if you're dealing with multiple people writing to the same data at the same time. And if that's the case, then yes, do not write your own. Go find something. If you are simply having a sync engine where anytime I make an update, it should sync whatever. And then when the app loads, it can check timestamps, like you said, which is newer, which is older, and then just update it that way. I did that and it's like, I call it an extremely naive sync. It's for my dance app. I actually have it. I have it on GitHub, so I'll post a link to that.

• 32:32Scott Tolinski?

  That way you can see what I did there. But it's extremely naive, but it works super well because only one person is ever going to be writing to that specific thing at any given time. And you know, the only way that there could be some problems is if I made some changes offline, never connected again online with that client, then made some more changes online with the same records. And there might be some conflicts there. But if you know that that's not how this is going to be used, then of course you can write your own very naive one as well. As far as what database, anything, man. I've done it with PocketBase. I've done it with Postgres straight up with a drizzle. I've done it with, you know, several different things. So you could even have it as a CMS if you,

• 33:15Scott Tolinski?

  if you want to have it saved to a CMS. Like I said, with like, I did it with PocketBase, which is kind of a pseudo CMS. So I don't think the database matters.

• 33:23Wes Bos?

  What about if he wants to stick with his existing database? Could he stick zero on top of that?

• 33:30Scott Tolinski?

  Only if that existing database is Postgres. So zero is only.

• 33:33Wes Bos?

  Oh, zero doesn't work with SQLite. You're right. Okay.

• 33:35Scott Tolinski?

  Yeah.

• 33:36Wes Bos?

  It sounds like it's fairly simple. It probably wouldn't be a big deal to move it. If you do want to stick with SQLite, I would check out either Cloudflare, D1, which has like time travel, meaning that if something does go wrong, you can scrub back to any minute in the last 30 days of your database. So it's like minute base backups for 30 days straight. So if you do screw something up, especially like while you're updating, you could possibly just store the old value as well. So you at least have it if you ever do need to roll back to it. Or use Tursa. We had Globa Costa on, who is the creator of Tursa. They have forked SQLite into their lib SQLite and they're, they're a pretty good service as well.

• 34:21Scott Tolinski?

  All right. Next question from Joe. Hey, guys. Love the show. Been listening since episode one. Nice. Wow. Nice, Joe. What is your approach for planning out a new project you want to build from scratch? Scott, what approach did you take when building your habit app? I.e. did you start with a design first? Or did you just dive straight into code? What did you use for design, if anything? Yeah, it depends. For me, I have my own starter that I call drop-in. That's what I use. And actually, when I built Habit Path specifically, I didn't have that starter. And just about everything in my drop-in starter was pulled from Habit Path. So I just started building these things. It was like, oh, I want to use these on other projects.

• 35:01Scott Tolinski?

  So I'll have them. Now I have my own set of libraries for auth and base CSS and stuff like that. But typically, I'm not building a ton of super long-lasting products. So I start from scratch and I just start getting in there, which isn't always the best idea. If you really want to take your time and plan something, I'm also very bad at planning overall. So in my mind, what you should do is think long and hard about the product. You should think, is this something that I want to be well-structured for years and upon years? That doesn't mean you can't restructure and change things.

• 35:41Scott Tolinski?

  In fact, just like two nights ago, I rewrote Habit Path, the whole mechanism for determining if a specific habit has a check on a specific date. Because that's a lot of data that you're working with, right? You have 20 habits, you have 365 days a year. You could potentially have a check for each one of those for every single day, if not more than that. So I ended up moving that all into an object lookup within, and each of those has a set as the property, and it got way faster. But it wasn't anything like that when I first wrote it. And so you can evolve how things are being done, especially if it's a type of product or a project that you haven't worked on before.

• 36:24Scott Tolinski?

  You don't have a clear experience in doing that exact thing. Your evolution of how you think about things. Things might change. I've actually found a lot of value in AI tools here where I can say I'm looking at building this specific type of project. What type of design patterns or architectures are common for this specific type of project? And I've gotten good luck with results there. That doesn't mean it's you're always going to get good luck. But I've gotten good luck in terms of at least giving me more context than I would have had, you know, outside of my own understanding. So in all honesty, I think you should take the time to plan things. I think you should think about it, especially if this is something you want to keep for a little while.

• 37:06Scott Tolinski?

  CSS wise, you know, a lot of times, or even like the structure or frameworks or whatever, a lot of it is just sticking with what you know. Unless you're explicitly setting out to build something with some new tech and that's the experience you're looking to get. Otherwise, take the things you're good at and just keep rolling with that because you can find other times to build up your skills and try new things and potentially find faster ways of doing things. But maybe on a long running project that you're looking to keep maintaining isn't the best place.

• 37:36Wes Bos?

  Yeah. When I'm starting a new project, I'll almost always start about it in terms of thinking about the data model. Because everything starts with the database, right? Or everything starts with the database or everything starts with the router. So I will often scaffold out a schema for all of my data. And then I'll go looking for what do I want to use for like a framework, you know? Like you probably know what library you want to use, you know, and doesn't want a Svelte or React or Vue. Do you want to use something on top of that? Sort of make your decisions there. Stick with what you know for the most part, but certainly take a look out there and see, is there something else?

• 38:19Wes Bos?

  That has been sort of superseded in terms of CSS approaches or database ORMs? Because it's often a nice time to try something new and learn a bit more.

• 38:31Scott Tolinski?

  Yeah, totally. Word.

• 38:33Wes Bos?

  Nick, the new guy says, I feel stupid asking this question, but you guys have been with me my entire dev career. Oh, thank you, Nick, the new guy. I am struggling to understand how to deploy a Svelte Kit app on something that is not Vercel or Netlify. My employer is PHP and SQL all the way. I finally convinced them.

• 38:54Wes Bos?

  So let me build a little internal web app using SvelteKit as a proof of concept. It is not a static site and requires some server-side stuff and I just don't know where to go. I have a dedicated Ubuntu server with full access to do whatever I need to do, but I've not been able to find any good resources on how to deploy an app locally. That's not the exact word, but not a cloud provider, etc. This app is only inside of our firewall. I don't mean the DNS stuff or anything like that, but what do I need on my server to make the app work? I know this is a super hard answer, yes. So what he's talking about here is you're probably used to just having a PHP server that is probably a lamp stack, meaning that there's Linux running on it. There's an Apache that runs as a web server.

• 39:39Wes Bos?

  There's MySQL database installed to store your data. And then there's PHP already installed. So you essentially need that kind of collection of things, but for a node stack. And on an Ubuntu server, you're going to need pretty much Node.js installed. You can still use a, like a server in front of Node.js, because like Node.js can be its own server, right? But you can also put like an Apache or Nginx or Caddy in front of that. And you probably don't need that in this case unless you're doing some like weird proxying with multiple apps. So pretty much grab that Ubuntu server.

• 40:22Wes Bos?

  You may want to install Docker on it so you can deploy your whole thing as a Docker container. Otherwise, you just need a way to get that app on your server and then run a start command. So basically, what I would do if you have an Ubuntu server is SSH into the box, install Node.js on that box and then use Git to pull down the application. And then you'll have to run like probably a build step. And then finally, you run a start command, which is Node.js will run the SvelteKit app. So that's the, that's the very basics of it.

• 41:03Wes Bos?

  If you want something a little bit more like friendly, like you're used to these nice cloud environments, you probably want Coolify. And we have a huge YouTube video from CJ on the Syntax YouTube channel on how to do that.

• 41:17Scott Tolinski?

  Yeah, that's my exact recommendations. You know, I mean, like you said, you're used to just deploying these things to these automatic hosts or whatever. Any Svelte kit or most modern apps, and I think this is true for NextJS, I'm not sure how difficult or easy this is because I haven't, can be deployed as a straight up node app. They can be deployed as a straight up static site. So if you need a full-on server, you need the server-side code, just make it a node app with the node adapter and host it anywhere you want to host node sites. And same thing with static. If you don't need a backend, you don't need a server, turn it into a static site and host it for free

• 41:59Scott Tolinski?

  on something like Netlify, Cloudflare Pages, even Cloudflare Pages for server-side stuff. Honestly, I end up hosting most of my apps on Cloudflare Pages or Coolify. I would say 100% of them these days. So that's what I do. Yeah.

• 42:15Wes Bos?

  But he doesn't want to do that because

• 42:17Scott Tolinski?

  I know, I know.

• 42:18Wes Bos?

  Internally. So, yeah. Yeah. If you want to go the Coolify route, you'll have an easier way because Coolify can also do the whole build step and whatnot. But at the very basics, you can simply just SSH, git pull, npm install, npm run build, and then npm run start, and that thing will be up and running. You just have to do that every single time you make a change.

• 42:43Scott Tolinski?

  Yes.

• 42:44Wes Bos?

  Which is why people like these cloud environments.

• 42:46Scott Tolinski?

  Yeah. Yeah. Another reason why Coolify fills that void of that experience with having it on your own server. Next question here from Truth Seeker. "I'm finding it increasingly difficult to find correct information online. Opinions are stated as facts. If I do research online, I'll come away with the conclusion that React is a horrible choice for a project, and why would you ever use it? But in reality, it's the most widely used front-end technology with good support, community, and stability."

• 43:16Wes Bos?

  That probably half the audience is thinking, "No, that's true."

• 43:18Scott Tolinski?

  Yeah.

• 43:20Scott Tolinski?

  Yeah. For years, I've heard and read online that OPP, object-oriented programming is bad and functional programming is superior. I've had multiple dev jobs in both big and small companies. All of them used object-oriented coding and the software is running fine. What gives? Why is reality not reflected online? Where can I get the reality? Sorry if I sound sour, but coming off a long journey with Rust and Wasm being the answer to the front end only to find out that Wasm can't even interact with the DOM without significant overhead. It's the same exact thing with the news and politics, but we don't have to get into that. LOL. Yes, truth seeker. Yeah. Hey, man, you're right. You're so right.

• 44:03Scott Tolinski?

  And here's why. Let me tell you. Let me tell you exactly why. Because opinions stated very confidently is how you get clicks. Now, you just state that opinion. This is the only way to do it. This is what you gotta do. And man, let me tell you, people just share that. They either hate share it or they love share it. And they click on it and everybody gets the links. And then, you know, next thing you know, that you cannot have an opinion that varies at all from what one person on some specific channel or anything said as being the fact, the way you gotta do it. But let me tell you, here's where you get the truth. You get the truth from your coworkers.

• 44:45Scott Tolinski?

  You get the truth from the people that you work with, that you trust their opinions. You get the truth from straight-up experience. Like, when I'm looking for stuff, I'm not looking for who said what is good. That never crosses my mind, unless it's me. If I said it's good, then you should listen to that because I'm me. But specifically, what I'm looking for is the answers to the questions that I have. And if somebody says something is always universally better than something else, unless it's like a straight-up consensus, then just ignore it as clickbait because it's almost never the case. Is React terrible? No, absolutely not. If somebody says React's terrible, then they're lying to you to get clicks.

• 45:30Wes Bos?

  That says, yeah, or it says more about their own skill set.

• 45:33Scott Tolinski?

  Totally. Because it's not terrible. It's fine. I don't even use it. And I'm gonna, you know, I would stick my neck out for React. It's a great, you know, a lot of people use and like React. That said. I think what you're getting at is a problem with like clickbait, which has just only gotten worse and worse and worse. We're feeding these algorithms and the only way to do that is to give into the clickbait. So I would say, don't trust those types of opinions and I would be skeptical if you're reading too many of those opinions from any particular individual because that might indicate that that individual is just saying things to get you hyped up or riled up. So, and I'm not, I'm not mentioning or calling anybody out specifically here. I'm just

• 46:18Scott Tolinski?

  saying in general, I think that's a good way that people like to put themselves out there is to hold these really strong opinions. But you'll, you might notice that some of those opinions are only held for a week or two, or a week or two before they're like, oh, no, wait, this actual thing is the actual thing. Oh, no, wait, this thing is the actual thing. It's like, all right, all right, which one? So yeah, no, you're right. Everything has trade offs. There's trade offs in everything. Make yourselves aware of the trade offs. Learn the intricacies there. Make informed decisions for yourself. But don't ever listen to something that X was good or bad, because it's not that black and white.

• 46:52Wes Bos?

  Everything depends on your situation and everything is good and could work for different situations. But unfortunately, that is not what people want to hear. Especially like when you're, when you're young and impressionable, or you are unsure of a specific area. People just want to be told with opinion that something is, and people love advice. I love advice myself, you know, and people have been asking us this while they're like, I wish you were a little bit more opinionated about some of your decisions. Because often, often our answers are, well, it depends, but here's kind of how you can can figure that that thing out, you know?

• 47:34Wes Bos?

  So yeah, I think that's just part of growing as a developer is the more, the more I get into my career and the better a developer I become, the more I realize, oh, there are a lot of people in different situations that have different needs and some things work great for other people and some things otherwise don't. I'll just end this by saying like, if you do find people who are doing that, because often they are not the biggest creators out there, then certainly send them a message and, and support them because that's the type of stuff we need to see.

• 48:08Scott Tolinski?

  Word. Yes.

• 48:10Wes Bos?

  Scott Boland says, "I have a friend who made a huge investment mistake by getting an app built. He spent years in the industry, identified a big gap and come up with a great idea, but not being technical at it. He's reached out to an agency to have it built. I'm a senior React dev who could have handled it, but he didn't want to be a pain in asking me, so he never reached out. The issue is, he's now spent $120,000 of his own money to have it built and it's nearly a year beyond when it was supposed to be launched and he still hasn't seen a fully working application. Finally, I got to see the current app and it's very bleak,

• 48:51Wes Bos?

  very poorly designed, no polish, most basic workflows, auth works half the time, the list goes on. I was able to look at the codebase and it's just bad, clearly built by someone very junior. Turns out they outsourced it and it's been built by one or two overseas dev, no in-house developers, just 1pm. How would you suggest breaking it to him that he's effectively being ripped off?" Yeah, man, this is so common. You actually see this quite a bit where people have these like dev agencies and they just get as much possible work as they possibly can. I get emails like this all the time. "We're looking for work, we're looking for work." And if you do any hint of research into it,

• 49:32Wes Bos?

  you realize these are all fake accounts and somebody is just farming out all of this work to other people. So That's part of it. And I think that the other thing is that having an idea for an app is such a small part of actually being successful in business. Because yeah, you have a really great idea in an industry, but you're not going to have any success unless you also have skills in terms of like, why did you give somebody $120,000 to build something when you haven't seen any part of it, right? Like, did you not have contracts in place? Do you not have project management? We're going to get to this point. I'm going to pay you this much.

• 50:13Wes Bos?

  And unfortunately, people get taken advantage of when they don't have somebody who can, that's why people get like technical co-founders, you know? You have an idea, but you also need somebody that knows how to navigate the ropes and figure out how all this stuff works. So I would certainly suggest telling him that like, you might have just got ripped off. See what they can do to get any of that money back. It depends on what your contracts look like. It's going to be a bit of a bummer, but I also probably would recommend not also offering to do it yourself.

• 50:50Wes Bos?

  I get friends all the time. Ask me if I will help them build stuff and I, I never say yes, because that seems like a great way to ruin a friendship. Because you look at these things a year and a half later and nothing ever panned out, you know?

• 51:04Scott Tolinski?

  Yeah, it's not only a great way to ruin a friendship, but it's also like a great way to burn all of your time. You know, so many of these things, especially like messes, messes take a lot longer to clean up than you might expect. So tough situation to be in, but I think you nailed the answer, Wes. So yeah, I don't, I don't have anything extra to add to that.

• 51:27Wes Bos?

  I will say that talking about AI, this is why regular people want AI.

• 51:32Scott Tolinski?

  Yes.

• 51:33Wes Bos?

  And this is why regular people use, use Wix and stuff now because they're, they're sick of having to wait two years and spend 120 grand just to get an idea out. And I think that these will soon be a thing of the past because you can get something up and running. That is a very basic proof of concept with very little coding things via AI generation, no code, low code platforms and whatnot. And certainly those are not the long-term solution for building a business, but. I would have hoped, and I see a lot of people now not going the route of finding a developer to build out their idea, but you can just go prompt your way to make a little

• 52:16Wes Bos?

  proof of concept app and try things out. And if you get a little bit of traction, you get a little bit of customers, then you can start going down the route of finding somebody you trust.

• 52:27Scott Tolinski?

  Cool. Well, that's it. Thank you so much for all of your questions. There were some really good ones. And honestly, a lot of really good ones, we couldn't get into in this episode. So if you want to leave your question, you think you have something really exciting for us to answer, or just something interesting, or maybe you just want to give us some feedback, leave a question in the form. And hopefully, we have that new form up by the time you do. So you don't have to go to that Google form and shake your head at us for us having that.

• 52:54Wes Bos?

  It's embedded. You don't even have to go to it. But yeah, it looks like.

• 52:57Scott Tolinski?

  How long have we had that form now? I mean, 2017?

• 52:59Wes Bos?

  Probably like five or six years. Yeah. Well, hold on, we can go. Let's check a look.

• 53:04Scott Tolinski?

  I mean, we created that like right away. So it feels like it's probably been here.

• 53:10Wes Bos?

  The first question.

• 53:11Scott Tolinski?

  Almost 10 years.

• 53:12Wes Bos?

  Ever submitted was January 24, 2018.

• 53:17Scott Tolinski?

  2018. Oh, wow. What was the question? Was it good?

• 53:21Wes Bos?

  Oh, yeah, that's a good question. What were some of the struggles you had early in your coding journey? And how did you overcome them?

• 53:29Scott Tolinski?

  Nice.

• 53:30Wes Bos?

  Thank you. Yeah, it's funny. We should go back to some of the very early lots of J W T questions in the early days. Lots of react questions. It's kind of funny to watch the trends of questions come and go over the years.

• 53:46Scott Tolinski?

  Yeah, I wonder when the first question with the word AI came in. So.

• 53:50Wes Bos?

  That's a good question. Let's see. 2019. Please do an episode on what's the deal with ML and AI? How is it going to help web development? Man, Avanish, you were way ahead of the game, brother. We didn't even answer that one.

• 54:10Scott Tolinski?

  Yeah, crazy. Cool. All right. Well, let's get into the part of the show where we talk about sick picks and shameless plugs. These are things that we both were liking right now, as well as things that we want to share with you. I have a sick pick for you, Wes. I don't know about you, but my wife and I talk all the time about how awful Pinterest is and how it's shocking that no one has come out with a better Pinterest yet. Like, come on, it's not good. And I gotta say, I found this app, saw some people chatting about it on Blue Sky, actually, but it's MyMind, and it's very good. There is a pricing, but don't let that scare you, because when you look at like what you actually get for the pricing,

• 54:50Scott Tolinski?

  it's like a bunch of extraneous stuff, like you're helping development and maybe like an extra AI tool or something here or there.

• 54:58Wes Bos?

  I tried this. Yeah, I had asked on, I asked on the podcast like a year ago, like what's, what do I use that's like Pinterest-like, but for everything? And this is what everybody recommended.

• 55:09Scott Tolinski?

  I have been using it and I really like it. The interface is great. The general flow and vibe of it is great. And yeah, I'm, I've never used anything like this. I'd never really got into Pinterest, but you know, it's like, I gotta have a place to, to log some things, to group some things, inspo boards and stuff. And you know what I'm doing right now? I'm taking screenshots and I'm throwing it into a folder on my desktop that I never look at. So it's just much better than that. So check it out. MyMind.com. I found it to be very nice.

• 55:44Wes Bos?

  Awesome. I'm going to sick pick what I got my daughter for Christmas, and it's a metal detector. This thing is so cool. I've always wanted a metal detector, because I think like, you see the people at the beach and they've got like, like chains and they find coins and whatnot. Yeah, that's just very exciting to me that you can just find stuff in the ground. So we got my daughter like a hundred dollar, hundred and twenty dollar metal detector. It's not the most amazing one in the world, but it works really well. I was surprised. So we took it twice now. To the playground, because the ground is frozen in Canada, so you can't dig the can't dig the ground.

• 56:27Wes Bos?

  But you you can dig the like wood chips at the playground. And every time we've done it, we found like a bunch of money and we found a couple of necklaces and some just like random paper clips and ski passes and stuff. And it's it's really fun. So if you want to have like a little adventure with your child, I would highly recommend grabbing a metal detector. I'll link up the one that I got.

• 56:50Scott Tolinski?

  Oh, I can dig that.

• 56:52Wes Bos?

  Oh, that's good.

• 56:55Scott Tolinski?

  I know, the silence. Oh, I'll take it. I'll take the silence. That's fun. Yeah, cool. Well, that's all we got. Shameless plugs. Check out Syntax on YouTube. Wes did a great video on package lock files. He did a great video on VS Code, Speed and Performance. CJ's got some stuff that will be out by the time you listen to this as well. And I'm working on some LocalFirst tutorials. I got a crazy story that I'm going to be telling. So we have a lot of, lot of cool stuff and it just keeps getting better. So check us out on YouTube at SyntaxFM, youtube.com, the good old YouTube site.

• 57:30Wes Bos?

  Peace.

• 57:31Scott Tolinski?

  Peace.