Potluck - Working on a Team × Dealing with Imposter Syndrome × Animating on the Web × Icon Libraries × Demanding Clients

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, the podcast with the tastiest web development treats out there. We've got another potluck For you today, 2 potlucks in a row. What could possibly be going on? Well, when we have 2 potlucks in a row, it means life It's bonkers right now. So, I, we bought a new house. My wife and I bought a new house, and then we had to sell ours immediately after. So rid. That was a bit of chaos. And then immediately after that got very sick or during that got very sick and rid. And everybody's on meds, so, excuse the

the raspy voice right now, but, we're on the mend. We're getting better. So, we got another pollock for you today. And, also, we've got some awesome questions. So pretty stoked about that. Yeah. And in addition, I had a death in the family. So I had to travel Oh my gosh. And go to a funeral. And and by the time yeah. I was like, you get back Sunday, and then there's Monday. And I was just like, yeah, Yeah. I don't think I can record today. Like, I am I am cook. Yeah. And you said you had jury duty too? Oh, yeah. I had jury duty on that Monday, And I got so close to being selected. They I would they weren't gonna, like, let anybody go, and then they let 1 person go. Then they called me up to the box. And then immediately after calling me up to the box, they say, alright. Everybody who's in the the back can go home now. And I was I was like, I'm the one only person rid called up from the audience or whatever they call it, and I did not ended up getting selected at the end of the day. Thank goodness. So, that's good. Have to go in. But, yeah, of those guys. Yeah. Yeah. I always I always wonder about that with, like, people who are self employed.

Oh, yeah. Do they do they take that into account We're like, you could just you can complain about it. There was one of the people someone's business? Yeah? Yeah. One of the people in the box was complaining about it.

They were like, I need to be at my business. So yeah. No. They let her home. They let her go home. So who knows? Maybe I could have pulled that in. I Like, I'd be I'd be into that when I'm, like, older.

Like, I'd sit through, like, a, like, a trial, you know, like a like a really good one, like, Something that I, like, I can make a podcast about later. You know? Like Yeah. Honestly The, like, the mustard bandit or something like that where, like, he Like, every time you killed somebody, like, wipe mustard on them or something like

that, and Yeah. It would be like, I could do that. A good podcast. Yeah? Okay. Yeah. The thing the mine mine was like a like a civil lawsuit for something frivolous, and it was just like, I don't wanna I don't wanna be here for this. You know? Yeah. Yeah. Rid

Cool. Alright. Well, we are sponsored by 3 awesome companies today, Century error exception tracking, sanity structure, content, CMS, and FreshBooks Cloud accounting. We'll talk about all of them partway through the episode.

Let's get on into the questions then, Scott. Yeah. Let's get into these questions. 1st Question

comes from someone anonymous.

They say, how can developers work with designers and project managers seamlessly? And we kinda had an episode about being a part of a team of called maybe, like, a month or 2 ago. And I think that, will encompass most of my thoughts for many of these things. But if you take a look at just in general your team's shared goals and have that in mind when you're communicating with people across different Parts of your organization, you need to, like, recognize what these share goals are.

Like, what What is the end result of this project? What are the things that you all have in common that you're trying to do here? And it's most likely getting this thing out the door in a way that everyone is happy with. And And project managers or or designers, they can they can gain a reputation in some workplaces as being Not difficult to work with, but developers themselves might be the ones who are difficult to work with. And the the bashing heads of communication there can become a problem where People are not aware of the status of the project or what things are going wrong or where everything is currently. So my tips for you would be to always make sure that you have your shared goals in mind when having communication with other people in your team like this. Be honest about your communication styles. If you have a project manager that's bugging you every single day about something, and that's not working for you, you can say, listen.

I will get you this early, but let's, let's let's change it up. I I don't, work well with with that kind of constant Check-in constant communication. So how about maybe, we have we set up specific times to check-in? That way, we're all on the same page, And I can just do my work and knock it out.

You'll wanna be honest. You'll want to communicate well. Express where you're at in a given project if you're gonna hit deadlines or not. And I think the the biggest thing, that you can do To have every project manager and every designer that you work with love you as a developer is just to deliver.

Deliver the goods. Deliver a site that is perfect flawless to whatever they gave you and deliver it in ahead of time. And let rid. Everybody know that it's no. Don't be like, I'm so fast. I'm the best. But be like, alright. Here it is. Everything's ready. It's fine. That way, if we wanna make any changes, any updates, whatever, rid. We can have extra time for that, and people will love you if you get things done early on time or just consistently to a degree where everyone's happy. Yeah. I think it's really important

to sort of all be on the same page and just understand where everybody's coming from. Like Developers love to hate on project managers, but, like, honestly, at the end of the day, they're trying to figure out, like, what's going on and whatnot. If you can anticipate rid. Questions that they might have.

Like, okay. I know you're gonna come and ask me about these freaking this border on here, or rid. I know that you're gonna check-in and say how much longer.

Then, like, when you have a sec, just pop in and say, hey.

This is where I'm at right now. That's the whole idea behind the stand up, right? You don't have to always be checking in and bugging each other.

And also just, like, be clear with everything. I think that rid. When designers and project managers are constantly, like, trying to babysit you, it's because they feel like there's a poor communication break in there as well. So Yeah. Totally. Like, rid. It's on everybody to to do that. And, honestly, that's a huge superpower of being able to produce good work is being able to work properly together. Yeah. Having those clear lines of communications and expectations set will go a long way to keeping everyone happy. Next question from Zach Zbanak.

What what was that right, Scott? What it would you say that last name is?

I would merge the z and b to be like zban rid.

Zebank. Zebank.

Hey, Wes and Scott. I'm submitting a few questions, so I apologize if the intro is a bit repetitive.

That's rid Thank you for submitting your questions.

I'm a full stack full time developer coming up on 2 years in my job, and I've worked, my way up from a junior dev rid. Out of a boot camp to a senior dev. However, I feel like I'm constantly battling impostor syndrome, especially having come for boot camp without a CS degree.

I continue to advance. I feel like I have this looming fear that I will get into a situation where I have no clue what people are talking about. Mhmm. What Is your advice to anyone struggling with impostor syndrome? And in your opinion, is it worth to pursue some sort of CS degree or certificate to keep advancing. So first, I don't think if you have a CS degree, you're going to lose that feeling.

That's just an anxious feeling that a lot of people have rid. In that you this world of web development is endless, and there is you can't even see the horizon. It's endless. There are no edges rid to it, and you are constantly getting into it. I think where people start to lose their imposter syndrome is not when they get good at what they are doing. Rid. Obviously, that's part of it. Like, you get better and you say, like, okay, I could I could figure out whatever whatever is coming my way.

Rid. But I think it's just being okay with not knowing stuff, and knowing, like, okay. Look at me. I freaking rid Came from a junior dev to a senior dev with nothing but a boot camp.

I figured out this on my own, a lot of it, and I know that I can figure out rid. Probably anything that comes my way, I can figure it out. Or I I'm I'm also okay with saying I don't know that or I'm I'm oh, like, you hear Scott rid. And I say that all the time. Wow. We've been devs for, what, like, 15 years. I've never come across that before or, rid. Man, I can't tell you any time in my career I've ever had to use that, or why would you need to use that? I'm I'm literally not sure. Like, please enlighten me. And Just being okay with not knowing how to do something is is like a huge, I don't know. You look at Senior developers, and they often could say, hey. I don't know how to do that. I'm sure I could figure it out, but please enlighten me with that type of stuff. So just being comfortable In that space of not knowing is very important. I think that will help you get a long way. So, yeah, I also agree with everything you said, basically.

You know that you're gonna be in that situation quite a bit in your career where things are mysterious and you're gonna have to figure them out. And it's gonna feel like You shouldn't be here because of that. But, I mean, everybody gets there. And, honestly, I would as a as a somebody who really Has grown a lot through any job they've had. I, at this point, would be very much more excited to be in a role Where I feel over my head than one where I feel like I'm I have I have to figure out same thing over and over again. Yeah. I got it all figured out. I'm in my comfort zone. It's easy. I'm collecting a paycheck. And to me, that's not where I get maybe, like, personal growth and excitement from. I like Learning new things are growing, and everyone's different. But I do think being put in a a position where you are being forced To be moving out of your comfort zone into things that feel scary is a good thing. So you just keep on keep on going with this, and I think you're gonna like, A couple months from now, you're gonna be like, oh, yeah. Everything was everything that I was worried about now is now, like, second nature, easy, Whatever. Because even I think, like, some of the ways that I've been thrown into the deep end in some of my development jobs, Ultimately, that deep end, like, sinking kind of feeling went away pretty quickly after you get used to whatever you're doing or you've been trained or worked with the other, people who are, you know, experienced in whatever it is that you're doing. So just keep on going on.

Also, Zach also asked about some Coffee shops in Denver. Like, what's a good coffee in Denver? I didn't wanna post that question because, I could just answer it here.

Basically, there's a a couple of places that I've I've been that are really good. Corvus is one of them that's well known.

Blue sparrow is another one that's well known. Huckleberry is another one that's really good. I also posted a link to a 52 80 blog post about the 17 best coffee shops in Denver. I haven't been To a coffee shop in quite some time now, and I'm I'm excited to start maybe getting into trying some coffee shops Oh, man. A little bit more here. Yeah. There's a there's a yeah. Coffee seen in Denver, just like the beer scene, is is pretty pretty great. There's a lot of options, a lot of good coffee. And for those those of you who like cold brew, you can still get some very fragrant, lovely coke cold brews as well.

Okay.

Next question is from Shabaz.

Says, do you use the table element for displaying tabular data, Or do you end up using CSS Grid? Is it bad practice to use CSS Grid for tabular data? I use tables for tab tabular data for table data. I always have it feels like a lot of extra work, but now that we have Grid, I'm sure the CSSing of a grid based table is easier.

But tables, I mean, they exist for a reason, and they're the semantic element for that data. That said, I don't really know what the semantic implications are of just doing it straight out of divs. But me personally, I I you know, tables are tables, but I I haven't really hit that many limitations in my personal usage of tables where I'm like, I gotta Just do all this by,

divs now. So that's my answer. Tables. You know? That's that's what tables are for. Tables are for tabular data. Rid. CSS Grid is for layout, and I don't think that you should put data into CSS Grid unless it's like a couple of bullet points of like a house and its its prices, the bedrooms, you know, like a couple of things under like some bullet points of data. Absolutely. But, rid. Yeah. Tables are for tabular data. It's the semantic element that's better for SEO. Like, you know, you Google something really quickly and Google shows you the little, rid. Like a quick little snapshot of a table. That's because a person used a table in there. So, if you have to have, like, a fancy layout, You can throw divs inside of table cells and then grid those if if you need to. But now don't don't be using CSS grid. That's rid That's that's a bit of a nightmare, to try to have to recreate it. Next question we have here is, from Ben. How do you manage animations? I know frameworks such as Felt and React, they're a dedicated library. I also know Scott uses them on level up tots.

But What would you recommend for someone on Eleventy or another static site generator that doesn't use a framework Or just HTML CSS by yourself. Are there vanilla alternatives? Thanks. Love the show. So, yeah, Scott's got some some good points in here. I think rid The thing I will say, I'll let Scott go into the actual recommendations, is that at the end of the day, these, like, frameworks rid are just JavaScript and CSS at at the end of the day. So there's nothing that you can't do rid. In one of these frames, sometimes these frameworks have little handy things where they'll duplicate DOM elements to do flip animations or whatever. But rid. At the end of the day, it is just JavaScript and CSS, so not a big deal. You can just use whatever is using it. And more than likely, if you look at some of these libraries and look at their dependencies, you'll see what they're using under the hood.

Yeah. And my answer is largely similar. I think the biggest issues you're going to hit when trying to do animations without a library that's tied To or just the library in general. Is that flip animations? They do become a bit of a pain. Flip is basically where you, rid. You have the end result of the animation.

You have the beginning result of the animation. You reverse it, and then you reverse that or whatever. So that way the ending state of the animation is essentially where the element lives. So it makes the animation more performant, and you can do all that by hand. There's a lot of blog posts on how to implement flip animations.

But they those end up being kind of a PIA if you are rolling it by hand as opposed to just dropping in a Use flip or whatever it is on Svelte. I forgot what it I think it's just transition flipper. I have no idea. But, it's it's way easier if you're using a library because, typically, that's kind of a pain. Another thing that you'll hit is animating things when adding and removing them from the DOM. Now the way that many libraries handle this is they 1st, start off with like if something's not in the DOM, they'll start with whatever the out state of the animation is. Let's just use opacity 0. Okay? So things not in the DOM. It gets put in the DOM with opacity 0.

Then they add a class to say animation, like, start Animation start, end, or whatever. You'll see this often with, like, React transition library or anything, basically, where you have a class that's being added or removed via a time out, And then there's a delay before the thing is added or removed to the DOM. It's added to the DOM. It starts with the initial state. It adds a class. It transitions.

It removes that class. It exists in the DOM. Then on the exit of the DOM, you add a class. It starts that animation, then you remove it from the DOM after a time out. That kind of stuff is a pain in the butt. If you're not using a framework because like I said, in is is felt specifically your Framer Motion, It couldn't be any more simple than to just drop that in and have it manage all that stuff for you. So for me, that's the stuff by hand that's gonna feel like the most pain in the butt.

Rid. But if you're looking for a framework agnostic library, GreenSock is, you know, one of the most performant, well, documented and highly used animation libraries out there and is not dependent on any framework.

So, maybe even learning GreenSock.

GreenSock would be a great tool for you in your repertoire.

Perhaps something that would look really good on your resume in addition to being something that's not tied to any frameworks. And that's if you need If you want, I should say something a little bit more high powered to do things like flip animations without having to do it all by hand. But okay. Rid. Actually, let's take a quick break to talk about one of our favorite companies, which is Sentry at Sentry dot I o. Perfect place to see all of your errors and exceptions. Maybe you're coding the animations by hand, and you have some JavaScript You're toggling some stuff and maybe, you forgot a case where you need to check to see if an element was there or not, throw in some JavaScript errors. Well, Sentry is gonna catch all of that. It's gonna catch all of that and all the other mischievous little bugs that you wrote into your code, and it's going to even check your performance of your websites. It's going to make sure That these things are an experience that people are going to want to be at bug free and super fast, just like every website we've ever visited in modern web. Right, Russ? Rid. Bug free and super fast. Yeah. Yep. At least the websites I make. Yep. The websites I make bug free and super fast, so you can make websites just like, Wes and I, by having a tool like Sentry on your side. So check it out at century.i0.

Use the coupon code tasty treat, all lowercase, all one word. You get 2 months for free. And, honestly, one of those services that saved my bacon just about every single week, because, yeah, bugs be happening. That's how it works.

Next question here is from Geordi.

He says, what do you use for icon libraries? I've always used the Font Awesome, and I was wondering if there is if that's still the current hotness or it makes me look dated.

I think Font Awesome kinda hit an inflection point where, like, inflection point? I don't know if that's the right word. It hit a point where Every website ever was using Font Awesome, and you could see it from a mile away. So that to me, I wouldn't pick Font Awesome just for that. It's not gonna, You know, there's some icons in Font Awesome that just feel almost amateurish at this point because they're so widely used. But in the same regard, it's easy. Right? It's Easy to drop in Font Awesome and just use those classes. But I think we've kind of moved away overall from web fonts themselves. Because if you think about it, fun awesome is not a web font

anymore. If you're no. Well, like, you you can still, but, like, that's not It was for a long time. Rid. Yeah. It definitely was. But, like, don't don't just associate Font Awesome as being a web font because you can use it in And any there's SVG or you can import them as you want. So that's not a I don't think that's a slight against it, though. Yeah. And actually, even looking at this right now, it the I haven't been to Font Awesome in a long time, apparently.

It looks it looks much better, than it used to, and there's variance of all these things. So maybe who knows? Maybe just use Font Awesome. So maybe I'm totally wrong on this.

Rid. Just after looking at the website, yeah, it doesn't it doesn't feel necessarily like the same old font awesome of the past. Either way, like Wes mentioned, don't, rid. Don't use it as a well, I was mentioning, but Wes clarified that it's not only a web font. Don't use it as a web font. Use Straight up SVGs in my opinion web fonts if you are using them they're heavy they're much heavier than pulling out the individual SVGs that you want rid. And so, personally, I I do use an SVG system myself. I would just curate all of the different Icons I want. Download them as SVGs.

Drop them into, either their components themselves or just the straight up SVGs And use those in my code. The way we do it was with a giant switch statement. Well, I guess there's a giant if else because it's a Svelte template Where you just pass in a string that string is one of the available icons and that completes the if statement to output the correct SVG.

So that's how we do it And I you can you can take so many different approaches to this.

But again, I now that I I totally rescind anything anything negative I said about Font Awesome. It's Kind of nice here. Yeah. It's the reason why I've stopped using Font Awesome is just like,

I don't need they have, like, the 17,000 icons, but it's like $99 rid Like, I don't want to pay for Oh, an aid product. Some of it is. You get 1700 for free, and then they have, like, duotone and light and whatever. And, rid. So what I do is, like so, like, it's not that I don't like Fon Awesome. I just, I've been starting to use React icons. And what React icons does Is it provides you a single API for using, I don't know, 15 different Heroicons, Ionicons, Devicons, Boxicons, Bootstrapicons, Typeicons.

There's like tons of them. And what I do is I'll just pick and choose the ones that I like. Now you have to be rid. Kind of careful that you you pick ones that are weighted the same. Otherwise, some are very thin and some are very bold.

Rid. But I I really like that because the hardest thing for me with it's like, oh, I just need a a quick icon. And then before you know it, rid. Like, oh, my gosh. I've converted this thing, and, now I have to have a, like, a icon file and, like so I just rid Really love how quick and easy React icons is. And then they also just they only import the ones that you want, so you're not importing the entire library. It just does a one rid 1 on 1. So if you it's also just a great website if you don't want to use if you don't use React.

It's just a great website to see rid. Literally every single good icon pack out there.

And you can just search rid. All of them at once. And you can, like, alright, who has the best play icon? I just searched play. Probably a 100 came back, You know? And you can just kinda, like, search through all of those to see,

which one which one's the best. So I've I've been loving that in a lot of my projects because it's just so so simple. Yeah. This is nice. I wonder what the behind the scenes this looks like if it is just SVGs as like a If statement or if you're oh, I guess you're bringing in an individual one as a component, maybe icon name. I don't know. Yeah. I wonder what behind the scenes this looks like. It's This would be, like you said, a nice place to really get a good feel for all these icons. This this website really makes The table of icons pop in a way where, like, you can see them all where it's not holding them back, and they're all cohesive. Feels really Nice. I added a couple more links to our show notes. 1 is icons8. 1 is flat icon.com.

Those are also both great places to find web fonts. Now or web icons, SVG icons. Now the big problem with some of these, like, you can get in trouble exactly like what you said where you're grabbing Multiple icons that don't really fit since they're not coming from a pack. So I would maybe recommend finding all of the specific icons that you want within 1 pack if you're going that route.

Rid. But yeah. Yep. The icons, man. It's a it's a whole world. Right? And and they can greatly, like, change the vibe of your site in general, with whatever style you're going for. So make sure that you pick an icon set that fits your your brand's identity. You know, rid. I think why people moved away from Font Awesome and into other ones is because

screen resolutions got much higher, And people were able to use higher detailed icons.

Mhmm. And those are, like, simple on iPhone apps. Rid. And and, like, the Font Awesome was very simple because when it was made, we had the iPhone, like, 3, you know, rid and they had to be very, very small and simple. But as we have these huge four k screens and high DPI devices, You can add a lot more detail to your icons, and it's still made out at a very, very small thing. So I bet that's why. There's also a lot of, like, Dynamic icons that can add or remove detail the larger or smaller they get. Oh, yeah. Those are really cool. Like an SVG that has that kind of detail in it. Rid. I think that's that's neat. I had to do that with my logo.

I had to remove the, like, West Boss lettering and just do a simple, like thing because as at a certain point, it's way too small, and you lose all the detail of the lettering.

I'm gonna have to do a deep dive on this myself. So We're doing a big redesign right now, and we have not essentially chosen an icon an icon system yet. So, I will be diving into the wide Rolled off icons and maybe you've just kick started this, so thank you. There you go. Next question from Sasha.

I see lots of websites that are broken or don't render properly, where I have to unregister the service worker and clear the site data to show normal. How could this happen? Rid.

This is, like, one of the biggest pain in the butts of service worker.

So a lot of times in service workers, what will happen is people will, rid. You visit a website, a service worker will download, and the service worker will attempt to, cache maybe the page, Maybe the JavaScript, maybe the CSS, maybe images. And then when you visit that page again, instead of going to the network, it just serves it up from the local cache In the service worker.

And all too often, you can goof that up because service workers are tricky, and that will end up breaking your website.

Rid. So, that's usually what happens is there's something going on there where the logic has and like having to test Those states of service workers is really tricky. Like, I'll give you an example of, my keycode.info website, which I sold, by the way. Yay.

Rid. So no longer mine.

But I rolled out a new version a couple weeks ago.

And the Keycode website, rid. The old version had a service worker that would cache the application and just serve it up. There was no logic in the service worker to ever delete itself.

So I deployed the new version of the website, but anyone who had visited the web the website previous to that Would forever get the older version of the website. Right? Yeah. So and I only I luckily, I had it happening in my browser, But I couldn't delete the service worker manually because then I had no way to test, to test the Actually, unregistering it. Oh my god. So I had to figure out where the service worker was on the old website, And then I wrote a service worker on the new website, and it has to be the same exact file.

And what will happen is every time you visit a service worker website, rid. The browser will attempt to check if there's a new service worker. It will download it and run it.

And then rid Even even if there's no, like, code to to try to do it. If the service worker is registered, it'd always try to check if there's a new version. And then in that rid At service worker, I had to terminate the service worker and and remove all of the cache there and then finally re reload the actual page rid on that. So you can get into this this kind of scary situation where, the site is cached not forever, but you you can always get out of it by Figuring out where the service worker was and serving up a new one. So I I have, like, a GitHub gist I wrote of just called nuke all service workers. Mhmm. And anytime you Visit the website.

It will just nuke it away and and you could start again if you want again. Yeah.

That's interesting to me. You know what? I would love Wes. I would love maybe even, like, a hasty treat where it's just Wes talking 1 0 1 service workers. Rid.

That that's what I would I think we did 1 many moons ago. Maybe we should do it again. But maybe even, like, get into some actual

Practical code stuff rather than conceptual stuff, maybe. Sure. Yeah. Yeah. I'm into that. I did a, oh, maybe maybe rid. 3 or 4 years ago in in Dayton, Ohio, I did, like, a private workshop on service workers and some of the stuff that surrounds, rid. That Yeah. And, it's it's an interesting world, man. It's it's not something I use a whole lot, partially because I'm rid. Care to goof it up and partially because, like, I don't know. I'd like but I would I would love to to do offline viewing for my videos, and I think that's That's my next step. Service workers can do a lot more, but that sort of like caching and offline is is the main use case that you see out there. I it freaks me out. I I actually don't do much with service workers just because,

I haven't had that experience yet. I haven't gotten the deep dive there. So Oh, yeah? Yeah. There you go.

Yeah. Cool. Alright. Well, next actually, let's actually take a quick break to talk about one of our sponsors today, which is Sanity. Yeah. Let's if you're dealing with service workers, You might lose your sanity.

So

Sanity.

Io is the unified content platform that powers better digital experiences.

Rid. What does that mean, you say? So Sanity is is a whole bunch of stuff that people love, you as the developer. To you, it's a CMS. You you you fire up Sanity.

You create all your schemas. You relate your data. You create all your inputs.

And then Sanity is also, they have a thing called Sanity Studio. It's a whole CMS that you can like a whole UI That you can use to edit your data, and it's built in React, so you can make your own React components if you need to.

But then there's a whole layer of, like, real timeness on there. Rid. There's a whole layer of, hooks where you can do approvals and and workflows to get data and content on your actual web rid site and preview it and all that stuff. So, like, like, all the way from, like, the the the the basement where us Developers live all the way through to, like, marketing and legal who needs to actually use the product at the end of the day.

Your data needs to go rid. All the way across that. Insanity powers all of that for you, and you can pipe that data into Literally anything, an app into your website, into, like a poster board at a restaurant.

You name it. Right? Wherever data can be, it can go. So check it out. Sanity.i0forward/ syntax. That will give you double the free usage here. Thank you, Sanity, for sponsoring.

Next question is from Jared Gentry. He says, since Next. Js has API routes, could you build a full stack application using just Next. J s, what would be the pros and cons of doing this? Yes. You can. Next question. No.

Next j s question. No. Yeah. So okay. Yes. You absolutely can. And, the pros would be that you're keeping everything colocated in 1 project. You're not having to worry about multiple, processes. You're not having to worry about dealing with multiple domain situations. Like, we have a separate domain for our API, It does cause more inconvenience than it does if you're creating an image. Problems, and cookies are all of them. Yeah. Right. Cookies Cores and cookies. Of these cores and cookies. Those are 2 things that you will avoid.

So that's a pro.

Pros all your code lives in one spot. It's a pro.

A pro is that there's a convention that works specifically with the UI of Next. Js, so that's a that's a pro.

Cons would be that, rid what would a con be? A con would be that you don't have separate control of it in the same way, for instance. Like, we have With our API, we can push an update to just our API without having to worry about rebuilding or redeploying the UI in any sort of way. So that's nice.

Rid. We can keep them separated at a different level like our dependencies for our server. We can have them all be just whatever they are for the API. But then, again, a pro would that you're not managing 2 separate sets of dependencies, which is also a problem. So you can absolutely do it. West, you Speak a little bit more on what they're doing actually with their serverless functions and stuff like that. But for me, personally, there I I I think it's it's a great idea to have it all unless you're planning on having, I don't know, a really intense API that you wanna scale in different ways. But rid. Maybe you can even do that still with Next. Js functions. There's nothing

special or proprietary about Next. Js's API functions.

They're just like Amazon Lambda serverless functions. There's a couple they have a couple little, like, handy things, but that's nothing you couldn't replicate yourself. So rid in in terms of like being locked in, that's great because you could move that to like literally any other platform that supports The Lambda signature for serverless, which is most of them. Mhmm.

And rid I'll say, like, most of your application's logic for your your back end should be factored out into separate functions. So rid. Send an email, save a customer, mark as paid. And those functions are very movable, right? Because it's it's there's nothing specific about Next. Js in that. So rid. You totally could. Cons.

I don't like I just love having a separate, window open for my back end in Versus Code. You know, I got my front end. I got my back end. Like Scott says, your dependencies are a little bit easier to manage. You do have a little bit of duplication between the 2.

But yeah, there's certainly that.

I tend to rid. Use Next. Js, serverless functions as just needing like a couple sips here and there rid of of back end. I built my entire listen to the selling t shirts with TypeScript episode. I built the entire e commerce platform on Next. Js rid Functions. And it's funny because I built them in I built them in something else before I moved it to Next. Js, and it was very easy to move it over because at the end of the day, it's just rid Node.

Js. So yeah. Yeah, there's that. And and like, I also don't like that it's just like forward slash API or like I don't like having them in the same editor. Again, I just like if I want to search for something, I'd like to know that I'm on the back end. Nice nice and cut and dry.

So even though I I'd have them as separate processes, I open up my whole thing as a monorepo.

So I I have Oh, dear? Then both open at all times. And it doesn't it's not too bad to search between them. Sometimes Versus Code can be a little bit of a iffy words like Config files per project or you're restarting your TypeScript server stuff.

But, you know, I I've gone both ways, and I'm I'm kind of not necessarily Like, I I don't necessarily have a a strong answer here because I have had a project with my meteor site where the API and the UI are tightly integrated. They're one project. They're one everything, and then I've had them both the separate processes and separate URLs.

And it does feel like a a more of a pain in the butt now that they're separated.

And so it's you you've gained control, but you've lost a little bit of that ease of use. So, yeah, it's definitely a trade off, But it's very possible you could do it. You could do it either way.

Next question from Thomas. This is a great question. Do you keep your landing pages and home Pages of your application separate, for example, forward slash dashboard.

Absolutely.

This is a a big pet peeve of mine is when you log in to an application and you cannot go to the website's home page. Rid. Like, sometimes you want to, like, look at the pricing, or you want to look at some features that they may have, and you have to log out or open the incognito tab rid just to see what their website looks like.

And then also just from a marketing standpoint, it's Often that your marketing website is totally separate from your app. Mhmm.

And most people We'll run their actual application on, like, app dot their domain name or or like a forward slash dashboard, something like that. So, Yeah. Keep them separate. I I really don't like that. The thing I have seen, I think Prisma does this, is that when you hit The home page, it will do a quick call to the back end. Mhmm. And it will change the sign in to your actual, like, avatar rid. Just a split second after the page loads, and that's a nice way just to show, okay, I I went to the website.

Now how do I get to the dashboard? Because that's another problem. It's like, I'm visiting the marketing site. I just wanna rid site. I just wanna freaking get to the login page, and you don't have a link anywhere for it. You know? I actually have, like, changed several times whether or not I'm, like, Doing a redirect if you're landing on the marketing page or not. At the end of the day, one of the things that we have is, like, after you are logged in, clicking on the logo on the site no matter what will always take you to the your dashboard. But we're I think we're gonna evolve some of this after we get done with the redesign that we're working on right now. So, yeah, just a that's the whole thing. But, yeah, I I definitely, I definitely would keep them separate just for your own personal headaches.

Okay. Next question is from rid

let me do this one. I have a bit of a French.

What say it again? Sorry.

La huit de I it's either la huit de hut. So you don't pronounce the e s e? Rid No. No. That's in French.

Okay. Yeah. I I knew this is funny. Early on in West West and I, we were chatting about, just I think it was we're chatting about something Toronto or, just in Canada based, and I I mentioned a marmot. And you were like, what's a marmot?

Rid. Like, I is that a marmal? It's just like, marmal. Oh, okay. Yeah. You you got the fancy

fancy pronunciation

of a marmal. What do you What do you call the when you come into a house, what do you call that? Foyer. Yeah. That's good. Yeah. Some people call it I always, like, watch HGTV, and these Couples from Texas are like, that's a nice foyer. That's foyer.

Yeah.

No. I I we my my parents always said foyer. So, Alright. What does the say? Says, I'm a budding web developer who codes for a hobby.

I create a lot of side projects, and for most of them, I use a thing like Replit, an online tool to host and build and develop sites, but It's not exactly a production environment. Where's the line for moving something hosted on a developer server like Replit or a Raspberry Pi to moving it to production like Netlify? Rid So for me, I'm almost always starting locally rather than in, like, a repllet. Like, I'll I'll pop open a project locally and and get that running on a local server before I will in cloud server, and that's fine.

You know, I think the tools nowadays are getting a little bit better.

We've we've had a We've done a little bit of a roundup on these in the past. I've been using Stackblitz a lot for creating new projects and trying things out, especially if Someone is, like, wanting a reproduction for their bug tracker. Like, if they if you wanna file a bug, it's really easy to reproduce your bug if you're creating, like, a Stackblitz and something like an online editor. So I'm almost always keeping keeping my stuff local And then moving it up to a server like Netlify or render or any of these, Vercel, any of these, whenever I wanted to be online.

So so if I'm doing a hobby project, I'm never having it be available publicly or rid to the greater Internet or to whatever outside of my local machine until I'm I'm ready for it to exist in that sort of world.

For you, like you said, it it might be different. But again, once it needs to be public, that's when you wanna move it somewhere. I would if you're planning on using this thing As, like, an actual tool to use or an actual process, I would not keep it on one of these replit like tools.

Just my My personal opinion. Yeah. I think

as long as it's a toy, it's fine.

Or it's a a toy or, like, a, like, a tool. Rid.

It's fine to throw it on, like, Replit or CodePen or CodeSandbox.

It's Kinda interesting to hear that new developers aren't doing it locally, but they immediately just go for a online rid.

Code code place to to do it. What do you call that? Like, online environment. Right? Online ID. A cloud ID. Talked about. Right? We're talking about the iPad kids starting to learn to code, right? The iPad immediately go for that type of thing. And it's also nice because it's like, say you're learning to code and you're doing a little at school and a little on your rid. Home computer, and they wanna do a little on your iPad. So, like, when do you need to move it? Like, when it crashes, you know, like, when you hit those things. Rid. But, also, like, there's there's something to be said for just throw it up on its like, when you are ready for the public to view it, like Scott says, rid. Put it on something else and put a domain name on it. You never know if if those types of things will get really popular. Like, I've created many of those little websites, rid.

Over the years, and some of them get popular and some of them don't. It's kind of kind of fun to have. Yeah, it is. The next question from CD, obsessive coding disorder.

Nice one there. That's hilarious.

What do you How sorry. I was just thinking area.

How do you deal with ignorant or demanding clients? Rid. When's the point where you say, I can't make this modification without extending the deadline or increasing price? This client doesn't understand exactly what they're asking for, rid. And it isn't interest and isn't interested in anything but the result, and thinks that anything can be done quickly. I'd love to hear your opinion. So As part of being a freelancer, it is your job to manage that client's expectations rid from the start. Otherwise, like, they don't they don't know how to run a project. They are they have a bricklaying business or something that you're helping them out with. Right? So, rid. Actually, if it was a trade, they probably would also be very familiar with the world of change orders. Mhmm.

So from the very rid Start. You need to have very clear expectations of how these things work.

And then also You need to remember that you're on your client side. You're trying to help out your client. Right? So you need to have a little bit of leeway here and there to make sure that, like, rid. You're they're getting the best thing. Like, if if you're just like, oh, no. I hate my clients. They're they're always asking for more stuff, and I told them Three times they can tell me and, like, that nobody wants to work with that person. Right? So there's got to be a little give and take there. You need to be very clear, and then you need to implement some sort of change order process. So let them know, hey. You wanna change something about the website? We need to write that up And be clear about if this is going to take more money and or time.

And and at the end of the day, that's good. Also, as you get better paying jobs. We've said this many times. As you get better paying jobs, as you get better at this, the bad clients Seemed to go away. People at the higher paying levels are more experienced, and are much better clients at the end of the day. So, How do you deal with them? Just get better at coding, and you will get better clients. Yeah. And that's a it's a funny thing because, like, if you're

rid If you're if if you have, like, a lot of open space in your schedule and you're really needing work, You can really do go through some great lengths to justify taking on one of these bad clients. The the bad clients are, like, just way that much more, rid.

Enticing when when you need the work because, you know, you you can't be as picky, but you gotta you do have to add some Some respect in your career. Like, have this radar for who's going to be a terrible client from the get go. I can I can Look back on so many projects that I worked on in my freelance career that didn't go as well as I would like them to? And almost all of them, I could say there were red flags immediately in that client meeting. Like, there were red flags that I should have said, I'm not a good fit for you. And, I could have gotten out of that rather than having to deal with some of the egos or just nonsensical ideas or like, I I you know, in, like, the year 2000,