Exploring Monorepos, Node.js Ecosystem, and Modern Development Practices

welcome to syntax today we got a potluck episode for you today keep the questions coming syntaxm um in the URL bar you can

submit your own question and we'll answer it on a future episode today we're talking about monor repos really

good explanation or really good question about a problem somebody has that a monor repo is going to solve it do you

really need a server for a react application or is a cloudflare worker enough for for when you need that a Java

developer thinks that the NodeJS ecosystem is a mess a good question about like how do you possibly use

Nex.js without Tanstack query so we're going to go into a lot of the new invalidation APIs on Nex.js someone

transitioning from uh a musician to an engineer and all kinds of new stuff let's get on into it i'm wearing a

different shirt right now because we forgot to record this intro so now we're going to cut to me and Scott awesome and

if you would like the best tools to make sure your application is running as smoothly as possible head on over to

centry.io in fact they just added uptime monitoring which is uh something that I use uptime monitoring all the time and

now I don't have to go somewhere else for it i can have it directly in my my Sentry settings to make sure my

applications are up as much as I think they are in fact uh I had an issue Wes with my habit path which was hosted on

Koolifi and something happened with my Koolifi or my server and it crashed and I didn't realize that it crashed but

what it didn't do is it didn't restart all of my services so here I I I know that my server is up and running but the

habit path was down and I didn't know because I mean I use I didn't know until I used somebody sent me a message or

whatever but that's exactly the type of issue you don't want with any application especially something if

other people are using it right so uptime monitoring is something that's important to have on just about any web

property that you care about people seeing because if you're not checking it 24/7 and it goes down you might not have

any clue so check it out centry.io/sintax sign up and get two months for free with the coupon code

tasty treat this podcast is presented by Sentry uh let's get into the pot questions Wes first question here from

Secret Agent hello Wes Scott and CJ been listening for a few years as I've transitioned from being a musician to

software engineer thanks for all of the help over the years and specifically Scott for showing me a music major can

be a developer that's me just got my first full-time job but I find myself wondering if we are shooting ourselves

in the foot we have a separate repo for each layer of our app the front end rest stopy layer what oh rest a rest API

resty hereby for a word a rest api is going to be called a resttopi it's a resttopy I I

just read that it's all one word here the rest api layer I was like what's a rest stopppy layer this is uh

fascinating so their their front end resty okay anyway carry on yeah let's carry on uh the front end the rest API

services layer the repo layer workflows and task layer Each time I make a change that spans more than one layer I have to

do more than one PR get something reviewed more than once and then make sure the merge and deploy happens at the

same time to make sure everything works together in prod as expected i get decoupling but for a small startup this

feels excessive is this an instance where a monor repo would help or do you have some other advice for me thanks for

answering to me when I read this question I'm smashing I'm smashing the monor repo button because I I like that

and I like that workflow and there's a lot of monor repo tools out there some of which are very heavy-handed and feel

like they can take over a whole lot i use PNPM with PNPM workspaces uh npm also has workspaces that are a little

bit more cumbersome they exist yarn has workspaces so workspaces are a great way to get monoro stuff going i'd also

recommend using turbo repo which is something I didn't think I needed for a long time but then I'm running like five

dev processes at once turbo Repo makes that so much easier and so much faster so I I highly recommend you know my my

workflow for this is PNPM workspaces in Turbo Repo and that's it and I I I think personally that's a a nice way to be for

something like this if you are hoping that deploying everything at the same time is your approach to making

everything work together it sounds like you need a monor repo if you are not then you need to start versioning your

APIs meaning that you leave the old version of whatever API running for a while until enough of your traffic has

has moved over um and you can do that either by different domain names um API key is a is another common way where you

you generate an API key that's attached to a specific version of an API um but like that's that's so incredibly complex

especially for a startup where a monor repo is a much better approach to this type of thing that like you see some of

these node modules that are published like for example Nex.js has has that but they have next.js JS image they have

like six or seven different versions and every single time they publish one version of something every other package

gets published as well right and that way all of the changes can go out as one especially if you're trying to update a

backend API as well as update like a UI layer and your resttopi API is also being updated it's all got to go out at

once and it's so much easier in a monor repo just casually throwing in the resty in there uh Paulo Ricardo says "Hello

I'm a Java developer condolences for professional reasons is taking his first steps in Node.js greetings from Portugal

i'm wondering if it's my impression if most Node.js libraries are generally poorly maintained coming from nearly 20

years of Java development i've noticed at least at least on the back end for things like OMS and caching the latest

release of many node libraries seems to be several years behind they often appear to be maintained as a hobby

rather than a structured approach i'm used to seeing this in Java what are your experiences in Node.js in this

regard do you feel like everything is abandoned or generally more well-maintained that's a good question i

I think like there are a whole slew of packages in the node ecosystem that are sort of I don't know

like like I'm thinking of express I'm thinking of of mongoose I'm thinking of some of the more established packages

that are maybe not the things that we reach for immediately and these are maybe the things that you're finding

when you Google like web server in in node or something like that and you kind of have to be in the know of what's

going on because if you were to look at the most popular packages in NodeJS those are maybe not the things that you

would grab right off the the bat but I don't know you're talking about OMS we have several really well-maintained OMS

several good approaches to caching i I don't think that this is necessarily the approach although the Node.js JS and

JavaScript ecosystem does tend to change what we like to use much more frequently than uh a more established something

like like the Java ecosystem especially it's much more corporate you know yeah it's interesting you know I I also you

know come across this in like the Rust ecosystem where I found a lot of abandoned Rust packages and people say

that they're done but then I'll find like stuff that just straight up doesn't work and then you're you're pawing

through it and there's like oh this hasn't been touched in like 2 years and so I think I find less of that with

JavaScript and you know it could just be ignorance on all parts on my part so yeah it really depends on I guess what

you're using how established it is there could be abandoned stuff or there could just be like you know it's been baked

into the the language now or you know there's no reason to use X Y and Z but for the most part I don't necessarily

feel like I've had this issue one thing I'll also say about that is because JavaScript is kind of bring your own for

everything you gotta like piece together the parts yourself for the most part it can be often very hard to figure out

what do I use for X Y and Z what do I use for an OM what I use for type validation all of those things and if

you simply are just googling for that it's it's really hard to find out what people are actually being used i like to

use socket.dev dev when searching my dependencies and that does give you a little bit of a better idea of of what's

being used but I would like even something further of like okay here's a package like what have people switched

to or like what are similar packages in this area you know you when you're shopping for something on like Amazon

and it's like well you might also like this one which comes with an Allen key you're like yeah okay I would like

All right next one here from Brett Perry Ush Brett uh he specifically says not Perry like Peri uh so Peri Perryi sorry

sorry Perry i called you Perry piri Brett uh hey Syntax Nation i have ideas for a new collaborationbased product

that will start as a micro app and add more micro apps over time to make a suite i'm wondering if I should do

straightup spelt kit or go local first with Power Sync Scott's new hotness which would you use my first question

for you all been following you from prey syntax days yeah I I've seen Brett uh online a lot so shout out to Brett

what's up so you know what I would use i don't know i'm using pretty much I'm pretty much using zero sync for

everything right now typically with spelt uh spelt kit specifically i wrote the library bindings for it i really

like it i have a few production apps working with it right now that said zeroync is not shaky super shaky ground

but things change you know there's been changes here and there to the permission system to the uh the schema definitions

and that stuff's kind of happening as it goes now I don't think it's going to massively change but it's not the most

absolute solid ground today that said if you're the type of person who doesn't mind that type of thing um and you want

to use something like that man zero is a great option i I I have such a good workflow going right now with zeroync

west because there's a great drizzle to zeroync schema translator where essentially you write your schema in

drizzle like typical um that way you can take advantage of the migrations all the drizzle stuff whenever you want to use

the drizzle stuff and then you essentially just take those schemas directly pipe it into this function and

it gets your zero sync schema automatically configured so that way it's not like you have to maintain two

schemas because uh you have your your your Postgress DB is super easy set up whatever run the migrations and then on

the other side you get zero sync to do all that stuff i also have my own like o system and stuff like that which I'm

working on um but you know I think for the most part I I think it's a really great platform and I I've really enjoyed

building on it in fact I just added some new features to my habit tracker uh that's built with zero sync and it was

just a joy right to be able to update the schema uh via migrations with Drizzle and then just have that those

changes be available to you on the front end you you're calling essentially what feels like an OM on the front end but

you're getting that local data saving you're getting that sync in the back end so hey if if that sounds like something

that fits the type of project you're building like that's the one thing you didn't really mention is that like Yeah

what do you like micro apps can can you take a stab at explaining what a micro app would be and multiple micro apps uh

I would imagine just like even like onepage utilities or something like that i honestly have zero clue what what

micro apps mean in this context nothing against you Brad i just don't know some sort of like suite of tools that

are used for I don't know we like for example in in syntax and the editing side right we

have so many little tools that we've built for helping us push the podcast out and I I would consider those micro

apps so the kind of nice thing about building micro apps is you could possibly try many things out and then

and then if they're small enough you can port them over they're micro right you can try a whole bunch of different

stacks especially if you're going to go this approach of what Scott said is use Drizzle for the OM and then that way

ducking out of Zero or or whatever if if you decide it's not for you it's a very easy thing to do yeah i think of this

like fuel so we we have a site fuel fue fuel yes yeah which is like a full of a bunch of different utilities command

pallet color generators lines and uh all kind like noise generators and all kinds of cool stuff i I think of this when I

think about micro apps but if if we're wrong about that Brett let us know because that that's kind of what I

envision sharing utilities across multiple apps right like you're like I need this thing again i need to convert

to SVG in six of these apps so I'm going to share the utility across all of them word chaff GPT says many people on

Twitter Reddit and YouTube are adamant that you don't need Tanstack query adamnant is that how you say it it's

adamant but uh I'm happy really i'm happy that I'm not the only one uh goofing up today you know I think my

whole life is a lie i always have to damn it cuz it's like well I'm damn near sure that it's this way yes oh my god I

love it actually I I prefer that i I How am I not damn near i'm damn near sure yeah that's a damn adamant adamant

sounds yeah that makes a lot of sense think about it man there's so many parts of my life no one has anyone has ever

corrected me oh my god you know speaking of Wes you know how I don't know if you know holidays but we all know I don't

know any holidays this is just a a part of our brains right i I I sat down with my wife the other night and she quizzed

me on every single holiday and it was just hilarious she's like "What month is this holiday in?" And I was just like

"What is the day what is Thanksgiving what is It's like all the holiday I only got two of them right i got Christmas

and Halloween right i'm I didn't get any of the other like I could you know I could obviously I know what either." Oh

it was brutal and And I think every single one she was just in tears because she couldn't believe I I didn't know

what day Easter was or what day anything was uh even Thanksgiving i Man I don't I don't think I could tell you when Easter

is like I know it's in April sometimes i think sometimes it's in March also in Canada half of our holidays are named

after like the queen so we have like Victoria Day and things like that and I I could tell you where Canada Day is

that's about it and I can tell you the Fourth of July is because Fourth of July Cinco de Mayo uh she she said one of

them and I and I was like that might as well be Boxing Day for me i have zero concept of of what day that holiday is

boxing Day i know when Boxing Boxing Day is the day after Christmas and Boxing Day is like Canada's Black Day unboxing

day and we we would like the morning of after Christmas we all we would just go wait outside the stores at like 5:00 a.m

which is a crazy thing to do the day after Christmas and you get all the deals but now we have Boxing Day as well

anyways he's adamant that you don't need Tanstack query with Nex.js i don't understand how you can manage caching

revalidation and optimistic UI without it um so my question is how does one manage a sync state without Tanacquery

in XJS i'm talking about instant updates to the UI followed by fresh data from the server without affecting the router

cache that's really important because currently when you you call revalidate path which is the Nex.js API for

invalidating a cache on a page so if you in XJS if you've got some like server actions you have some data loaded and

you want to anyone that's on that page you want to like reload part of that page right you just call revalidate path

and pass it the string to what path you're on and it will just refresh all of the the queries and data that is on

that p path so he says when you call revalidate path the entire router cache is purged on the client which is awful

UX which is is true like you're you're literally nuking the entire page and and starting again the docs say a future

version of Nex will stop this behavior the entire routercast is purged when you call router.refresh from the client to

pull fresh data on route am I missing something or is there really no way to make granular updates on the server that

are synced with the client yes you are missing that next.js XJS has a API that is coming it's it's been in dev for a

while and I bet we'll see it soon um it's the unstable cache API that looks a lot like Tanstack query in Nex.js

because in my opinion Tanstack query is is the best API in the world and we need that everywhere else so the way that

this works is you tag your queries and you you tag any action with you can tag them with paths as well as a a timeout

meaning that this data will be stale after however many time however many milliseconds and then you can refresh it

but then you can also tag them which is much more important to me because I much rather tag uh something as like podcast

episodes or shop items versus having to revalidate paths i don't know what page my items are going to be on i'm big on

component-based design i like when components can fetch their own data react Suspense makes that really nice

but if if you're telling me you I have to pass you a list of pages to revalidate I don't know i don't possibly

know which pages those are going to be on so I don't like that API but the tagging them is really nice because you

can tag it as like item six but then you can also just tag it as an item and in that case you can invalidate all items

or a specific item by its tag number so that API is coming you can you can use it already in X.js i've used it in

production several times already and I'm a big fan of that as well as Nex.js is also rolling out this idea of just

caching not just like fetching resources but Nex.js is also rolling out the idea of just caching a component's output um

so rather than like statically generating an entire page you can statically generate a component or you

can cache a component's output multiple times so for example I have like a Twitter feed in my footer of my website

or the syntax one i I might want to cach that for like five hours worth of tweets or or a full days worth of of podcast

and then um have that thing revalidated so that's so that's a nice way to uh cache stuff that is maybe shared between

users um and then finally uh React 19 all the React Suspense all the server component stuff also has ways to do

optimistic UI not to say you shouldn't use Tanacquery i'm a big fan of it but I think that that's why people are are

saying that yeah word sick thank you for that Wes all right next one here from Famous Potatoes when starting a project

I often wonder if I really need to use a server in my codebase i think it's much easier to build a spa but there are some

things you cannot do client side at least securely and need a server like email some databases or libraries that

are only built for servers but now that workers Cloudflare workers are more prevalent do you think it's reasonable

to build a clientside app that does not use a server but pushes all of the server side stuff to a worker the

benefit being that you could build a spa that benefits from simplicity in the codebase and the ability to host a

static site but still has the ability to do traditional serverside stuff using a cloud-based worker can you think of use

cases where this would fall apart uh yes i do this all the time and you know one of the reasons why I do this all the

time is because Spelkit makes it easy to have uh adapters for where you output you throw the Cloudflare adapter in

there you post it up and then you got your workers running as you know essentially functions for you uh for any

server side stuff you need and that way when you're using like uh server.ts or whatever as a route that that works on

the server where it needs to and then everything else can be spa if you want it to you could even have serverside

rendering that way too but I a lot of times I'm I'm building apps that have like dynamic bits in them that don't

need serverside rendering for the app piece server side functioning sending email all that stuff works great uh I've

been doing it also too now with AWS and SST so that's really uh pretty nice to be able to throw up on SST you use again

the same thing like an adapter for it and then uh AWS just runs those as lambdas instead of uh having to have a

traditional server so I would say nine times out of 10 like this is exactly how I'm deploying things these days what

Scott explained is the approach I would take as well and that's not a totally separate instance i I think like the

famous potatoes who asked this question is asking is like should I just like totally deploy my spa app somewhere and

then if I need to I can I can fire up some workers and and sort of communicate between the two that's a great way to

approach it but I would use something like spelt kit or next.js JS or tensac start or solidstar or something that is

just puts it all into one meaning that you can do your whole app client side but at that moment where you do need a

little sip of server you know you do need to do something server side it's so incredibly easy to do that on the server

because you simply just like like install kit you just name its sererver.js JS and all of a sudden that

will will be running on the server or you can throw a um like a server action in there and that code will run on the

server because that rusty back and forth of of hopping between them can be a bit of a pain unless you have a much more

mature application where you have a very clear API and a very clear front end and you you sort of talk back and forth

between those that's pretty common but if you're building from something from scratch and you're doing it all in

JavaScript I would certainly pick something that allows you to do both and you don't have to use the server side

stuff and unless until you actually need it and I in my opinion that's the the best approach because so many times I've

I've whipped up a quick little like vap only client side and then I I hit I need a sip of server side it needs

something to run on the server now I'm I'm opening up a new tab in my console you know I'm getting Hano fired up in

that and I'm like I should have I should have used something that I just have it all in one word totally yes max SC says

um you've discussed implementing zero with spelt and Scott has even created the zero spelt package how would you

load data in speltkit though would you use pluspage.js JS or stick with loading data in components and go directly and

page.spel files yes good question how would you do this Scott i Yeah I I pretty much skip the loaders entirely

the way that it works is like especially because the the way that that a uh the spelt zero package works is that it uses

it uses spelt stores to do everything in runes so it makes more sense to just toss it into a component i I have some I

recently published an AI chatbot uh that's done with zero in spelt as a part of the challenge that the zero team

issued um which was actually a lot of fun because the way that it worked Wes was that like when I send a message and

I type in it it's doing the zeroync stuff but then it's also firing off a message to the server the server goes

off and does all the AI stuff and as the response is coming back from OpenAI it's streaming into the database and zero is

watching the database and anytime the database updates it's updating the UI so the streaming is working by the AI

response is streaming into the database and the zeroync is just recognizing those changes and updating the UI and

patching the UI uh so it's insanely fast basically you're just tossing it in and if it needs to respond to parameters

like page parameters or something or even like other inputs you just throw it into a derived and yeah I I'll have more

docs on this but I'll link that repo up that has a lot of good examples on how to do this though um it's actually been

really really cool to see how many people are utilizing this zeros felt like like they issued this challenge for

anybody to build this AI chatbot and who who could do it and just to see like people using my library to to do all

that with has been it's been pretty great cuz I I use it myself for all kinds of stuff so I you know I feel the

pain when there is pain or I I know where to fix when things are breaking or whatever but to have so many other

people using it is is pretty dope so that's interesting to me that you said like you're doing all of the data

stuff like in the component right you're not doing it in a page at a page level or in a page loader is that right

correct yeah that's my like preferred way to do things as well and the reason why a lot of people say like don't fetch

in component but fetch at a page level um is because you can get waterfalls meaning that like uh you load a

component that fetches data comes back renders out some UI oh that UI now renders a different component realizes

that component needs some data goes off fetch it right that's how you get a waterfall but with local first you're

not so much worried about the network waterfall you're not worried about the network waterfall really at all right

that's why you can do that yeah and and also the uh the zero spelt package it saves every query that you do into a a t

or like um a map so if if I do a query once and it it hashes like what the the query actually is so uh if I do that

query once with one set of parameters it saves it into a map and then it doesn't have to redo that subscription or

anything like that that that will just exist so it's going to keep reusing that same that same data source every single

time so and and not to mention the data loading is incredibly fast anyway so it's it's pretty shocking yeah beautiful

i like it yeah next question from Ronnie do you think nowadays it makes makes sense to diversify to full stack

developer instead of being only front-end focus and learn something like PHP Laravel Python Flask or Java no it

says Flash i know it says Python probably meant to say Flask but don't learn yeah I think it meant to say Flask

uh and then Java Spring framework but I don't know if that's supposed to be it might have been auto spring yeah

probably so some autocorrect issues but Ronnie I do think that it's probably important to spend some time learning

these things i do also personally feel like front-end development is a deep enough well that you should like be able

to become a deep expert in some front-end development topics in a way that like you just can't if you're

spending all your time focusing on on full stack stuff so me personally I like the challenge of full stack stuff the

thing I like the most about it is that I can build full things myself without anybody else but I'm not a a part of a

small like a team where I'm doing one specific thing and I do feel like with the the advancements to CSS the

advancements to JavaScript all that kind of UI code stuff I think front-end focus is still very much a thing or at very

least UI focus like I'm building UIs with with this or that more so than just like just straight up client side code i

mean whether or not you're doing it server side or you know HTML stuff this is there's so much there's a deep well

here so I personally would pick up uh full stack stuff for fun to understand the process more to know how these

things work better uh but in the same regard if you're looking to become a an expert at one topic then by all means I

think front end is a deep enough well for that yeah that's that's interesting it's a UI focused developer um that's a

great way to put it because as much as people want to be like I only do the CSS yes that's that's not really a reality

unless you are extremely good at CSS and you work at like a very large company where you're absolutely killing it right

like you work at Stripe and like you're just focusing in on on CSS even then I think some of the the smart people that

work at on the next level stuff at Stripe are probably also very good at JavaScript so

I would say it makes sense to at least be comfortable with the full stack especially if you're trying to get a job

today as much as we would love to just sit in our little box and say I just want to focus on this thing because this

is what I love i don't think that those are where most of the jobs are most of the jobs are going to want you to be

able to jump in and work on whatever needs to be worked on and you can be part of a t a team where someone will

say "Give that to Scott or give that to Wes." Because they're going to do the best job at that they really know the

internals of X Y and Z but when something breaks you got to be able to jump in and and figure this type of

stuff out and as AI is getting better for you to be able to explain how things work and be able to reason about

different code bases I really think being a full stack dev with a focus on one of these areas

is is the way forward and I don't know that you would get a very good and a well-paying job otherwise yeah word

crispy codes what do you think is a better way to track backend changes besides websockets i have a scenario

where I upload a video that is supposed to undergo some processing stages so I need to keep track of whether the video

is pending completed or failed since I can upload multiple files i tried pulling mechanisms but it makes frequent

API calls which is costly i really need some help or advice thank you so what he's explaining here is that you upload

a video and on the server you you need to wait for it needs to process it right needs to maybe make captions and the

status of that uh job needs to constantly be sent back to the client side and there's several ways you can do

this right you can open up a websocket when you upload it and and just send back data as it's needed you can use

server sent events where you you ask for a request you open up or like a fetch request and then that stays open for

however long and then the server can just sort of send data back to you as it's needed or you can do polling which

is just like what's the update what's the update what's the update and in most cases for this type of work you're going

to be using polling um that's what I see most often um because if you need to open multiple tabs or if you close the

tab and reopen it it's much easier to simply just ask for the status of job 299 and get it back and update the UI

he's saying it's expensive here which it shouldn't be expensive because you're simply doing some sort of like database

query and then sending back a very small amount of text back if you're doing bazillions of them maybe but it

shouldn't be very expensive and he's probably using something where you pay based on the like the serverless

function that has been instantiated and every single time you run one of those you have to pay for it so if that's the

case maybe look at how you can I don't know make that make that a bit cheaper i don't think that there's any other way

around this and there are bazillions of apps out there that simply just use this simple polling technique yeah I know

polling always feels like the easiest for me for some reason even if it's not for some reason it just feels like the

easiest it it is it's because it's it's like stateless right um totally it's simply just what's the status and it

comes back with the status and you can recreate that at at any time so unless you actually need real time or like

streaming where like something is like like an AI response is simply streaming back the updates in real time and you

need to show that to the user but if it's simply every 10 seconds you're checking if it's done or not you can

also do things like you can decrease the polling in the first like if if you think ah it's going to take at least

five minutes maybe the first minute or two you only send a request once or if somebody has their tab not focused then

then don't send the request every two seconds you know or if if they haven't move their mouse there's a lot of things

you can do to decide how frequently you should send that request so maybe that's an avenue you should go down is how do I

how do I do this less or simply just put a refresh button on there for the user you know let the user click on and see

if they if they literally care you can click on the button and see if there's an update yeah yeah word there's been a

lot of talk about the zero sync stuff in this but that would work really well for something like this because again you're

just making changes to the database and it's listening on a websocket that sync process runs or whatever and that that

uses websockets so I have a lot of experience using websockets from Meteor days and now this and um as a technology

when it works and it's all just set up and whatever it just feels great to have that real timeness about everything it's

just something I like uh next one here from Anan this question is for Wes all right Wes you ready you have so many

course sites with different domains why don't you use subdomains for each course is this a security purpose or another

reason i've had this question many many times especially in the early days of doing courses people everybody was doing

it at like a forward slash so it would be like westboss.com/javascript instead of

instead of on its own domain name and my whole philosophy in life is make it a thing meaning that if you put your hard

effort into making something package it up and ship it out as a thing make it a thing give it a title you know give it

make make some graphics for it both because the the perceived value of it is is much higher there can be like SEO

aspects to it that's never been a play for me with my courses but a lot of people will do separate domain names

because they'll put a lot of specific content on that domain also people like to sell their things i did it myself

keycode.info was a little side project that I had and it's simply you press a code a key and it will tell you the key

code the location it say everything about the JavaScript event of a key up event and I put that on a separate

domain name rather than forward slashkeycode on westboss.com simply because I wanted it to be its own thing

and a nice benefit of that is toptal a couple years ago came along and they bought the whole thing from me i sold

them a website that shows you data on event on a JavaScript event which is a bit of a silly thing but they did it

right and and it was it was a significant amount of money that I made from it so I'm a big fan of putting

everything on its own domain name simply just from the perceived value and the ability to move things around should you

want to um there's no security issue in fact the security is a pain in the butt because uh I have a couple things where

I want to share data between domain names off is not cross domain name but there's several other things cross

domain name whether I show a banner or not uh if you've bought the course I don't show the banner that's a pain in

the butt to try to crossdomain share that info man I I have experience with this because of level up tutorials I did

kind of the opposite approach where every single one was part of a bigger thing right so instead of each course

being its own thing I did each one as part of level up tutorials and I got to say you know I feel like that was a

harder approach because it kind of devalued every single thing I did where like I have a new 24 video course coming

out every single month why did I do that there's so so much material and it all had like

less intention or weight uh given to it when in reality it's like I was putting in the work on those those projects i

was really like hustling on them and like grinding on it but like yeah it probably would have been better to make

them a thing instead and like make them bigger because I I think it was doing my content a disservice not not like even

like financial reasons but I think it was doing my content to make make it more feel like disposable or more

youtuby by releasing so much all under under one thing but hey it's out there and it's free now levelup.video if you

want to check that out it's all for free now next one from object object uh could you guys talk about the pros and cons of

a codebased routing versus filebased routing currently experimenting with Nex.js to tensac and looking for some

direction thanks so yeah the idea with with the codebased or config based routing versus file-based is um when you

want to create a new page in a file-based routing you simply just you make a folder called like about uh and

then inside of that you might have like an index.tsx or you might have a page.js or

whatever the whatever framework you're using that's a filebased routing and then there are also ways to do things

like optional params like if you want to do uh slashblog but then you also want to do for/blog slash one right and you

you want to optionally put in the page number into the params a config one would simply have you write out the

config for your router and and declare what all the routes are and say when somebody hits one of these render out

this component um whereas a file-based one is simply just putting folders and I've gone back and forth between them i

don't love file-based routing but it's all I've used in the last probably three years yeah same and I don't love it

because I find it hard to navigate through all of my pages there's there's ways in in VS Code to rename the tabs

and whatnot but I don't know that I've I have a a favorite of these i don't know what are your thoughts that's

just my approach here is I'm I'm not sure what I like the best yeah in in my mind it all comes down to like with like

programmic based routing it makes it way easier to do like conditional routing things um because you have the full

power of JavaScript or that front-end framework in your router where with file systembased routers I feel like they all

struggle when it comes to all right I have like this group of routes that has a different like subgroup now i have

this parameter-based route that needs to adhere to these uh guidelines like for instance this felt kit routing system is

very good but it's it's kind of its own thing you can like you have like rest routes you have routes where the

parameter is locked to a specific reax you have uh like grouped routes you have nested layouts in all these ways and uh

if you want to have a nested layout route system that's a part of a different tree or whatever it it just

makes it all more complex than it would if you were doing it in a in a in a codebased routing system but on the

other hand you gain things like code splitting uh and that stuff is way easier and less effortful if you're not

having to do it yourself and to tell your application where to split and what to load when to load dynamically

whatever the framework just takes care of it for you so for me at the end of the day I prefer the file-based routing

for the benefits you get automatically for it rather than uh having to deal with that stuff myself and then I will

learn the syntax for file-based routing i'll learn all that stuff i will deal with it even if it's not my favorite

thing middleear is is another kind of pain in the butt one where like I want middleares to apply to these three

routes and they're not like for/admin whatever then you got to do it but also like the syntax website like our open

graph images are sort of outside of this the syntax layout um and in order for us to do that we need to have like a

parenthesis blank and a parenthesis site sort of route inside of there but I think that's fine because I don't know

like once you understand it it's a little bit weird but once you understand what it's doing I think it's totally

fine i I didn't even think about the the code splitting route another one is you visit a page in a new codebase i want to

fix something that's on this page it's very easy to figure out where to edit that code because you simply just go to

the page the filebased route for that page and then you start clicking through the components until you find what

you're looking for whereas like how many times have you opened up a codebase before you're like I have no idea

where to even look for this thing that's like I I still have like a fairly big express app for my course platform and I

moved almost all of my routes into one file at one point and that was so nice because now I was able to just open up

the routes file and it's hundreds of lines long but it's very easy to see what the routes are and then I can click

through to the controllers of each of them uh and actually see the code that runs when people visit those URLs last

one here from Eddie i'm new to web development only going into my second year of learning webdev do you guys have

any advice for new developers that are new in this field new developers that are new in this field absolutely Eddie

this I feel like this is something we haven't even touched on in a while it is a question we've gotten a number of

times through potlucks but you know we've been on we've been on the air in the airwaves since 2017 so definitely

want to hit this one again you know what do we recommend for people who are newer to this stuff i I think the biggest and

best advice that I can give you Eddie is that your curiosity is your superpower it's your superpower towards being

focused it's your superpower towards gaining knowledge it's your superpower towards building things that you will

actually use enjoy and like advance your learning so let your curiosity drive you dive into things explore topics get deep

on some things get wide on other things but like for the most part find stuff that you enjoy making try to make it

struggle through it don't give up ask questions all of those things and you know be open-minded uh I think a a

struggle that maybe not a struggle but like a a problem that a lot of newer developers have is they might listen to

some influencer on YouTube or something and then build their entire not just personality but their entire developer

skill base based on what somebody else has said is the way to do it there are so many different paths that are all

valid and all work and if you like something and something feels nice to you and you're productive with it and uh

so and so influencer says that it's garbage don't you don't need to listen to them you know uh I think keeping a

very open mind staying curious and you know working hard to build things for both yourself for other people nailing

the job requirements whatever um is the way to go yeah having that open mind is is absolutely key so my advice here is

build lots of things build lots of little things um having that success after success will give you crazy

momentum in your career share what you've built share what you've learned those things uh simply just putting it

up on GitHub writing a blog post making a a video about what you've built is unbelievable i've had major major leaps

and bounds in my career simply by showing what people what I have built and that's led to conference talks and

paid freelancing jobs and job offers and stuff all over the place right and the last thing is like join the conversation

and like ask lots of questions so if you are part of this community right you're listening to this podcast you're finding

web developers wherever it is that you like to hang out that is going to be big for your career word absolutely yes yeah

we should do another we many years ago we did one like advice for new developers but let's we'll follow that

up as well especially as like the the job market has changed and everything has changed right last time we did that

a LLMs weren't a thing i mean there was just so much that's changed so I do think uh my advice will significantly

have changed there in many different ways so well that's it let's get into our next section which is sick picks

shameless plugs the stuff that we think is great and that uh you might maybe should be paying attention to wes I have

a sick pick that I've sickpicked before in the past um but hey it's a rep but I I'm coming at this from a whole another

year of experience so maybe about a yearish ago I sickpicked a financial like tracking app if you've ever used

Mint or something like that or Personal Capital there's so many of these now like Copilot Money blah blah blah i've

been using Monarch for over a year now and at first when I I started using it there was a lot of like "Wow this is

really great it all works super well it looks nice it feels nice i I can tell I'm going to like this." But now I've

been using it for over a year it's like really part of my general workflow where I'm approving transactions i'm

categorizing them i'm using like the San Key flowcharts for where my money is going and how how much of percentages is

going to all of the different things i'm using all of the budgeting tools the goals all of these uh things and I I use

it every single day so I can safely say from my perspective I've used a lot of these things uh this has been my

favorite one by far the biggest complaint you will see people have with Monarch is that accounts disconnect but

like I feel like web developers should know better that the way that works is that many of these are unofficial APIs

and uh like for instance our our mortgage lender is like the worst like 1990s website and the fact that Monarch

works at all with that mortgage provider is shocking to me so like if it disconnects every once in a while no big

deal yeah so behind all of these financial apps are is a company called Plaid and they provide APIs for all of

these banks and like I I think it's the wild west these there's probably developers working at Plaid that are

just like "Well today I wrote a SOAP API thing that will go around or I'm sure they have some crazy processes to to get

that data out of your bank." I have it with my Freshbooks it constantly constantly disconnects and it's such a

pain in the butt and they all they do is point the finger at Plaid which makes me really mad yeah but at the end of the

day you got to know that like some of they don't have real APIs there and there's so many there's no APIs for a

lot of these banks on their own stuff there's millions of bank we have four banks in Canada what do you got down

there like bazillion i don't even know i mean yeah i mean we're in a credit union that I've been at for a long time so on

top of that you have like All right now I'm at a credit union with its own software and who knows what so yeah um

either way I I like this a lot the reports are really great it feels nice to like go through this you know monthly

with my wife and uh look at where we're at at the budgets and see all the stuff and yeah it it's fun and it's a good UI

um so check it out beautiful i'm going to pick these like Pelican cases um or

whatever they're called this one's called a SKB case um and these things are awesome i have a couple bigger ones

i have one on wheels um I'm up up at my cottage right now and when I go to the cottage I bring all of my recording gear

not all of it i have I have doubles of everything but I bring the expensive camera i bring my laptop my wife brings

her her camera and her laptop and stuff like that and I'm always scared that things are going to get busted or if you

have to bring something on a plane so these cases besides looking like super badass like they have like nice foam

inside of them that you can like cut out to match whatever it is that you're working on they're like pressure

sealed if you ever need to get a nice Pelican case or what's the name for these that is like not the like trade

name pelican case is the name of it but many companies make these i have no clue case rugged yeah some kind of rugged uh

waterproof case are they waterproof yeah oh yeah certainly they uh don't buy one that isn't cuz that that's very

important i'm sure someday my kids are going to take this out of the car because it's in their way and leave it

in the snow or something like that you know it's happened many times so big fan of these all right that's all we got for

today uh shameless plugs let's check out the Syntax YouTube channel we just posted a banger of a video with uh the

folks behind the TypeScript rewrite to go that was a lot of fun today's the day we released it so we're kind of all

hopped up on that release so check it out yeah also you know it's so funny somebody commented about the skateboard

that was in the background of CJ's set if you don't know about it we have a store of all this kind of stuff so if

you head to century.shop sen t r y.shop shop we'll have the link in the show we have so

much cool stuff there and there's like Century swag obviously but we have a syntax skateboard we have miniature

skateboards we have all kinds of sick pick t-shirts and hats and we got some cool new stuff coming that like uh Wes

has had access to for way too long that I have not had access i've been testing i'm a I'm a I'm the official tester for

the merch so you probably have seen it in a couple videos but they're coming yeah there's a lot of cool stuff coming

so check it out at century.shop as well but yeah that's all I got that's it thanks for tuning in peace