Potluck - Sass × Houdini × No JS? × Solid Project × First Dev Job Tips × Bartering × DRM × Dev Laptops × Databases × Frontity × More!

besides being a sponge for The things that your coworkers are talking about is just to be helpful at work. Somebody needs something, you know, step up and do it. Be the person that everybody's like, oh, Hey. I really like Aaron. He, he did this for me. He did x for me. He, helped me out here, did that. You know, I was, you know, just read. Doing kind things for people and being the type of coworker that you'd like other people to say, you know, that that that's a really good person right there. He's doing some good work. I'm really excited He's on this team. And and don't try to do too much arguing or keep in mind, this is, like, things that I've experienced before. Somebody new on the team. They're a junior developer. They wanna start critiquing things or or calling the shots or something like that. Not your role. You're there to rid to show up to be a sponge, to listen, to do what they ask of you, and be a good worker bee for a little bit. You know? And that doesn't mean You can't, like, assert some of your your stuff later on if you have things, but, like, man, there's nothing worse than having a project that's, like, 50% of the way through. Some new guy comes along, and they're just like, could be really great as x, y, and z technology in this thing. We should really add that. Like, no. We are beyond this point. It is not your your your work. Let's Let's keep going with how these things are, and, maybe later,

rid We're gonna do it ourselves because it was not easy. So I had not heard of this before. I am pretty excited about it. Do you think we can get Tim Berners Lee on the podcast? How cool would that be?

And that's great because, like, if someone can do the hard part of that and use the web developer and just use an API to access that, rid. If it's easy to use and it's easy to integrate, and it's not a pain in the butt because if that's the case, then So we bought this little silicone mat to go under the bowls, that WordPress gives you for free. You give up the commenting what our things would be, and then we just rid Took that off. So I did the website, and they took $4 off the the final bill. And that was nice and clean-cut Because there was no, like, oh, you did this for me, and and, like, what happens if 1 person doesn't deliver?

rid any website and go buy all you want. Like, how is this still

this is this is I don't know if that that ad transition worked, but Sentry is a error exception handling tool, And it's exceedingly modern, and it will tell you if your website is slow. And it's a little callback to that, that question about all that JavaScript loading. You got too much JavaScript loading. This will tell you if this website is slow because you got too much JavaScript, and it does that through this really great performance tracking metrics table that gives you a user misery score, tells you which rid Sites or which pages on your site and your application are being hit, which are the slowest, and which of them have the most opportunity for you to tweak that and figure out what you can do to Stop making your website so slow. So if you want to add that in addition to all of the error and exception handling tools that Sentry is known for, head on over to century dot rid I owe use the coupon code tasty treat, all lowercase, all one word, and you'll get 2 months for free. Thank you so much for Century for sponsoring.

that Square became a thing and, like, going to service providers or, like, you know, the AC guy comes out, fixes it. You just tap your phone on his little square thing attached rid to his phone. Bingo bango. That's it. Oh, I've never had that. Oh, yeah. I've had that a few times, and it's just every single time you're very thankful for it. You're not cutting out a check. You're not having to, you know, do any of that stuff. So Yeah. Yeah. I'm here for those modern tools.

in Colorado there. If you wanna do a brewery tour, that's one of the places to go. Rid Odell, shout out. I am about to start my 1st developer job. What practices can I start to really get off rid on the right foot and lay down a foundation it's been really great, Wes. It's a great potluck, and we will catch you After our vacay wraps up, and we're gonna be filling the fresh and recharged with a whole bunch of new new stuff here, and maybe

Fort Collins is pretty dope, by the way, Wes. They have a nice Little beer scene, it's like a small college town. I think it's Colorado State University is over there. Oh. Pretty cute little city,

One of those modern tools rid is going to be Sentry, which is a Have you seen the framework laptop? And if so, what are your thoughts on it for web development? I'm a lifelong Mac user, less put together, so to say.

you know, why why they made the choices they did about a specific Roger, either way, it all comes back to, don't be an old all. Just, come in. Be hungry to learn. Next question from Mark Froelich. Re You guys are awesome statement here. Thank you, Mark Froelich.

you can share us some of your your brilliant new things as a new developer. Rid Yeah. I I think Scott said it really well. Just be hungry to learn. Ask lots of questions. Respect the older developers that have been there for a little longer. Rid Like, no one likes that that new dev that comes in and tries to change everything. So just having an open mind and learning from what you have, I think, is the best way you can Start yourself up for a successful career. Maybe we'll do we just did an entire

for the propane or anything like that. And all the time, multifactor rid For all of your favorite frameworks so you're building a Node or Express App, React, Next. Js,

the customer's credit card number. This is like, what do you mean? How do you access the customer's credit card number? They're like, well, typically, we we would then write down their credit card number on this pad, and then we would type rid into our thing here, and then that was chart. I'm like, oh, no. No. No. No. No. No. I you don't want you you should not have their credit card number. Right? That is for someone else rid to not even have, but to keep an authorization, token for it. Like, you should have the customer ID, and that's that's pretty much it. If you want to charge them, it should be through the app or whatever, but, oh, boy. Yeah. I'm surprised, at least in Canada, how often that still happens. Oh, yeah. Like, We got no new doors for our house, or you need to pay a bill Oh, yeah. Is Jiffy Park where they parked where they couldn't find their car? I don't remember. Yeah. I think so. That was, like, awesome. Okay. Well, I love I love I love a good Seinfeld episode. So Widevine, I've never heard of this Widevine. I typed it into Google. It says the leading content protection for media enables secure content rid

for a successful career? I'd love an entire episode then I would do that. Again, I I largely

conversations that have happened before you're there or whatever. So many times people come in if they're they are suggesting new things or whatever. It might not just be because rid. The previous people haven't thought about them. It might be because you're missing some key context to why,

As we know, Tim Berners Lee made the web. Apparently, after seeing everyone's data get harvested by tech companies, he decided to create a project called rid [email protected].

how it works? It seems so silly.

authentication. So we've talked about We've done a a couple podcasts on roles and permissions,

to log in, and you can just integrate that with Auth0. They do all the hard stuff because I have a card has support for MongoDB, which is really exciting because Prisma is a framework

on Netflix when we go to

rid This is kind of a a new one. I kinda wanna do a podcast on this. Biometrics,

a0.t0forward/ and we always end up saying, this is very hard to do. And if you want a nice interface, nice service to manage all of your roles and permissions they think themselves.

has, like, the ability to download content, right, to watch offline.

the Paw Patrol

Yes. I do. They are a brand new sponsor, so shout out to Auth0 for coming on the podcast and sponsoring it. Rid. What they do is they provide the authentication and authorization more of a under the hood tool, and then you it already is in Gatsby and Next. Js. Right?

login page with them. They have SDKs Like, the the wine is, like, $12 a bottle here, You don't have to learn other things. I think that's what a lot of WordPress people want. It's like, just give me this thing that's wrapped up. I can learn a few new things here or there, but rid I still need, like, a little bit more batteries included than, like, a lower level Gatsby or Next, which is funny to think of them as lower level, but it is when you get into WordPress land. So Auth0, for sponsoring.

and we'll go on a trip. And then 2 weeks later, we'll go on another trip, and, well, the kids will open up the iPad in the car, and it'll say these things are expired.

being able to use face ID or touch ID or All these different sensors that are on your devices GPUs you can use. They have bare metal, Kubernetes, Next question from Tomek rid. Rosalski,

talk about Auth0? Rid 0. Wes, do you wanna talk about Auth0? I love,

and you name it. They've got re Integrations

because it's in WebKit now, a rid Click on different Yeah. Pieces, and that thing never took off. There there's a reason why these things are soldered together, and maybe it is because Apple wants to You did to pay for everything, but part of it is that if every little

do you wanna

for your application so you don't have to. So Some of the things that they do is they have log in with your favorite social provider. So if you ever have tried to implement log in with Twitter, Google, Discord, you can tell that's a big Pain in the butt to to do. They do it all for you. You can make a customizable then people say, alright. Well, screw this. We tried it, but we're gonna

Oh, yes. Download the content. I had it all downloaded. What are you talking about? We don't support YouTube TV in the country that you're in, I download the content. Let me access it, man. Just let me get in there. I'm not trying to watch live TV, so that was that was super obnoxious. But, yeah, that's my that's my take on DRM. Pretty long winded. Wes, right? The DRM should Context for utilizing a free standard based solutions for OTT and CAS services. I don't know what those are, but it sounds interesting.

So what happens is that we'll download all these these, slow to query in JavaScript or PHP and then loop over and do all that. So, Often, what you have to do is you have to send that query to for it. They have next level features, user management, including roles and permissions,

videos onto the iPad from Netflix, Really,

for the service and whatnot, and it gets in the way and makes the product worse. Totally. I had the same situation Very clearly a 0. Because of OAuth. Yeah. Re Otho just sounds so cool. Anyways Yeah. Auth0

rendering For for me to fix this bug for you. We get a 5 bottles of wine. I'll fix this bug. That'd be great.

I think it's a,

the DRM situation is really

required

Thank you. Oh, and by the way, All of my names are related to Seinfeld in some way. Stella is a reference to when Elaine gets high on pain medication. Oh. Stella.

How does one go about a d l re

Linux like that where things just I guess we're we're just gonna be waiting. And if you want rid. To give this a try, you know, I guess, just do it under the understanding that it's not going to be production ready anytime soon, considering Firefox is Under consideration. So is Houdini ready yet is a great place to at least keep an eye on it. I would love an update maybe from the Firefox team has to look what the plan is there. Like, where where are they actually considering it, or is that, you know, just like, throttled here or if it is that I have too much stuff going on, because that can certainly be a thing. Are you running too many processes, rid. Or are is your computer itself throttling itself? So Hot is the app. I will post a link to, this app in the show notes. It's free. It's free little utility here, so Check it out. I'm going to sick pick the

It sucks when

I'll give you an example. It's That allows people to own their data to control all permissions over it. So if a user logs into your rid. App with Solid, rather than storing the info on their server, you store it in their Solid pod. Do you think you could rid. This could save web developers' conscience and disk space in the cloud. I like this idea rid. We have it on Canadian Netflix, and then when you come to our cottage, we have American Internet because of some ways that I get Internet, and it's, like, gone.

weren't the same as they were on Mac and PC, which is one of the reasons why I don't write it as my full time. And that stinks that the this Widevine doesn't work on Linux given that however many of these services use it. It looks like just about everybody.

my stuff. Rid So This is way, way back, And they were a client. I was moving them to a Magento site. And,

an interesting conversation, and you often have people who are very polarized on this topic. They're saying, you know, DRM and it is running at 86%

content analytics it has something to do with the Widevine DRM they employ. I got outraged and eventually canceled my subscription.

And people who are you know, want want all content and media to be free, well, I understand your position. It's it's not realistic. It's never going to happen. Yeah. So we might as well just figure out how to live with DRM. Now that thing about Linux, Yeah. Right? That would be great. Yeah. Yeah. I I agree. I think anything that involves me not having to store more information is for the best, because I don't trust myself, but, you know, one loss of vector or anything is good. I had a a client one time.

is the devil. It's not digital rights management. I was trying to come up with another spelling of the acronym, devil I've done that before. Thank you for, Level Up Tutorials for, I guess, sponsoring this this podcast as well. Cool. Well, But it's like, wait. Why can't I just import a function?

evil, so to say, but, you know, evil in the sense that

a lot of people.

pretty crystal clear in my eyes. If you have major studios who own this IP, re Major content providers, they are not going to put their content somewhere where you can just take it. They will not do that. It costs too much money for them to produce this stuff. So digital rights management will always be here.

So the nature of Yeah. Totally. Cool. Well, next question here is from George Hart.

that was interesting. You know, I've had a lot of little experiences subscription syntax, he says, hey, guys. Been diving into Svelte a bit And recently and I had a question about using it with GraphQL. As I recall, Scott once deemed React TypeScript GraphQL Cogen as the promised land, And since then, I've tried it out and found it to be awesome. However,

not be invasive. I understand its need to exist, but when people are implementing this kind of stuff, They do have to look at it and say, is this ruining my product?

seeing such a thing, I can't seem to find any good docs on that. I personally can relate rid As to why it's there, but end up hating it anyways. I recently found out that Prime Video only allows SD

It's not something that is ever going to, be burnt at the stake,

rid to sort of write your own CSS, meaning that you get access you can write CSS,

Right up my alley in terms of something that I would love to be able to do. Love to write my own custom CSS like that, but Sass and SCSS way. Yeah. That was the whole thing is I have the PostCSS native nesting plug in in LevelUp tutorials

write some it'll like Canvas APIs.

They're called the Worklets, And I traded it. I think I did a

kind of hanging out in limbo. Yeah. I'm really glad to see that Safari is ahead of Firefox there because, Usually, that's the case. It's like, alright. We're done this thing, and Safari's like, wait. What? What? Wait. What thing? What what were you guys talking about? Yeah.

and a couple other, rid I think fonts and a couple other pieces of of CSS, and you'd be able to run JavaScript

Or you could pass a variable, number of Scotts, 6, in your CSS,

I bet Firefox will come out swinging with it at some point. Like, I I can't imagine them being like, you know what? We're not gonna do this thing that's part of the spec. You know? That's That's Firefox core. Yeah. I'm sure there's a very valid reason, but that then I still want it. I agree. So we'll we'll keep you updated on it. Next question is from Serenity Now. With all of this JS being transferred, have you ever tried to challenge yourself and build a project that doesn't allow any JavaScript rid. In the front end alone, I e, just HTML and CSS. I find it funny how I can pretty much use Amazon.com

Firefox, a lot of it is under consideration.

Oh, I don't know. I wouldn't hold your breath. I was really rid Hoping it was gonna be sooner. Yeah. And it's great that you can play around with it in Chrome, but knowing that it's it's not an even, like, in development in Firefox yet is pretty disheartening. And then when I saw that, I was like, oh, no. This is not but if this And then when I saw that, I was like, oh, no. This is not but if the spec isn't done, I can see why, but still,

Yeah. I would really love it if, if if if it came here because this is one of those things that I personally like.

a web API that is going to allow you I'm literally just standing there telling them every number on the card as well as my home address, and, like, I'm like, you could literally just go type this into the,

partial support and in development, which is good.

a junior developer, most of the sites I didn't have or wrote didn't use JavaScript at all Unless it was like a carousel, but, like, even then, you're gonna need, like, a JavaScript for some interactive things, whether that is like I know You can do this all with post requests or whatever, but it's a much better experience for your customer to use a little bit of JavaScript in that situation.

Yeah. That's rough to see. Yeah. There's nothing in in Firefox

is there any movement on it, or is it just, rid DRM

That has been done yet. So, like, not like, no code written. Safari is

Edge, Opera, Samsung

and then you, A zero dot t o forward slash syntax The spec is not even done yet. So, like, I don't know. What do you think, Scott? When is it coming?

with rid Yes. Disabled. I literally cannot view the Angular docs if I disable it. Love the show. Thank you for answering. Yeah. You know what? I I've written many, many sites without JavaScript. It was when I was Used by Disney, Warner Brothers, Netflix, Hulu, they they were like, okay. This is cool, but how do I access

to generate and paint rid things in CSS. So it's it's pretty exciting because once that's shipped, then we'll be able to we'll start seeing, like, people write their own CSS. You know? They they can ship it. So rid Where is it at? Scott found this really nice website. Is Houdini Ready Yet .com? which I have to Tell myself the 6th. I always always say auth o for some reason. But Me too. Yeah. Same. Clearly a 0.

has a lot of it shipped.

of Syntax in Micro Office of so I'm gonna be so sad. I don't know if you get this, Wes, but I get really sad to leave places like even, like, my apartments. When I leave an apartment and you move all your stuff out and you're just standing in your apartment, being like, oh, the great times I had in this apartment. You know? That that's me. I I get really teared up, so I'm gonna be very sad to leave this office. But looking forward to the future here.

exactly how much your CPU is being throttled along with the temperature.

rid It can crap out my audio. It can do all sorts of really bad stuff. Frame rate will just drop. I had to rerecord several of my tutorial videos because the,

Maybe we'll have some new bumpers for the show. I I'm laughing while I'm saying this because I think we've we've claimed that we'll have new bumpers or or new things they'll only serve out SD video because of something in Linux that you have no control over, and that's really what it comes down to at the end of the day. Digital

HTML,

All that good stuff. So you wanna host your next project. That's a very basic using their shared Linux servers. Linode's gonna give you a $100 rid

for a Full archive of all of our shows. And don't forget to subscribe in your podcast player or drop a review if you like this show.

Or sign up for your team and get everybody on board saving 25% there. So check it out level up tutorials.com.

You can use the coupon code syntax for $10 I swear I'm not a plant for Frontity,

Node, you name it. West boss .comforward/courses.

dedicated CPU, cloud firewalls,

cloud computing

That's my hook to get you to listen to this ad read. So Linode is like, I I know a lot of people went super heavy on Compass when it was built in Ruby and all the custom SaaS stuff, and I find, like, that kind of stuff

rid The CPU was being throttled so hard that the recording software wasn't functioning correctly. So I got an app. It's called Hot, h o t, the experience of working with Mongo a little bit more solid, we've gotten away from the rid. The Apollo cache side of things, which is somebody who recommended that approach to us on the the Svelte Discord, and I've been largely happy with it Because you can update the Svelte So I would love any tool that would make that better for MongoDB. We use Mongoose, but But it still doesn't necessarily

CSS,

silicone mat. This is something that I bought for our dog's bowl. So,

Also works for cats. Rid Not a ball bat. More cats. Cool. Well, shameless plugs here. The latest course on level up tutorials, by the time you are listening to this, is my new course on Web components. Now I did a deep dive in web components one zero one, and we talk about writing web components, and and this is straight up read. JavaScript and HTML, in fact, the only thing that we're using from NPM or anything like that So those things have config files. If you look right in config files, hey. Go to town on the Veeet's config file. Go go to town on it. Or he has built. There's rid. Tons of config there if you want.

web rid Components skills here. If you have no experience here with web components whatsoever,

actually

Rid.

So at any given point, They'll say your CPU is, you know, 170 degrees Fahrenheit right now, this is the course for you. We'll tell you everything you need to know, and by the end of it, You'll have a couple component a couple of components that are configurable, work really well, and should get you far enough where you can at least start tweaking and writing your own web components.

So Before we get into sick picks here, we have 1 more sponsor, and that is Linode. Wes, do you wanna talk about Linode?

free credit to try it off on your next project. So check it out. Linode, l I n o d e.comforward/ syntax. Thank you, Linode, re for sponsoring, and thanks for the $100 for everybody who's gonna use it. Yeah. Cool. Well, now is the part of the show where we talk about things that are sick, our sick picks, rid that we find to be sick, and I'm gonna I'm gonna start this up with a little bit of app that you might want, Wes. This is gonna be something that I've been utilizing for a couple weeks now. Read. My laptop, configuring Webpack, rid. Feeling like you need a degree to do it. Right? It's never been my style of tool. What do you think, Wes? Yeah. I think we'll we'll have to see what Things like Create React App and Next. Js

And it tells you

So if this sounds interesting to you, head on over to level up tutorials.comforward/pro.

thing to save your floor, so check it out. Silicone waterproof pet food and water bowl mat.

That way you know or I know visually that if it's getting dipping down there that I should be expecting, like, a major slowdown. It also helps me understand a little bit about, like, rid. Maybe, like, if Versus code isn't being as performant or my computer's just feeling sloggy or just not good, I couldn't see it if it is the CPU that is being

I was gonna say thanks to me for sponsoring, but that is my shameless plug.

Peace.

Head on over to syntax.fm and shipping JavaScript should be a progressive enhancement. Right? Sure. The site should and and could be able to work without JavaScript on the front end, but Many times, the experience is much better if you're shipping that JavaScript, and maybe it's being server side rendered and then hydrated. In that way, The load times are faster, things like that. But in my mind, the tools are not going to be to write it all in just a few times now, ready. And have comfort done it. So I'm just saying that is because I don't I don't necessarily have any plans to change them, but who knows? Maybe we will. Maybe we won't.

and for each one, count how many courses they have. And then for each course, sum up how much they have watched rich on each one. That would be extremely obviously, is a big one.

Word. I agree.

like, weird things, especially around graphics.

little snippet file of different aggregations that I often have to do. So rid I think the aggregation is like SQL. I don't think it's any better than that. You have all these inner joins and

replaceable,

Yeah. Prisma is shaping up To be really, really nice with all the the migrations they have built in, multiple database adapters.

Just things feel unfinished in a lot of ways. The rid Trackpad support was largely the trackpads all felt weird to me in terms of the the physics of them. Yeah. So there's, like, a lot of little things like that. If you're coming from Mac, It's not going to feel like a Mac. Just be prepared that it's going to feel a little bit

But the idea of a higher repairable laptop running Linux, If you don't want to, you can also use the tools with list config because it's really nice to not have to worry about that type of config if you don't want to. Rid So if it's a config thing you're worried about control, man, these tools all have lots of control. But if if Webpack So the import is just update user. You import update user from the generated code, and you just use it like a function.

all these queries to databases, episode on advice for new developers, So you can also go back to that one as well. There's lots of really good info there. You should also think about, like you know, a lot of the times, you won't have another annoying one is on the Netflix app. The videos expire.

like, migrations have been kind of a pain. As as our site has grown over the years, I mean, it's 20. We started it in 2015 with the current database we're in, and there has been several times that I'm like, you know what? I really not that I wish I would have done this in something other than Mongo

Understand that many of the the reasons why it's our ours has, you know, had some cruft to it added over the years is is a 100% my fault. But in the same regard, Yeah. I I think I would love to have the database

this never been you know, if we were listing out my top skills, it's never been at the top of that ladder. Right? So rid I think using something a bit more strict would have saved me from myself earlier on in the development of this thing, and I'd be a lot happier. Rid. We're we're making a lot of those changes now, but I think it it would have made our database a lot more reliable or stronger in terms of knowing that the data that we're asking for is always going to be there in the specific ways.

upgradeable, that type of deal. You have little components you can screw in. And whether or not it is ready. You know, SSD strip, you can you can upgrade it in a more easy, simple way than any other thing. And the top top case just kinda pops off and you can rid. Upgrade it and and change it out yourself.

all that. That stuff can get really, really tricky as well.

rid Chris from the start. Yeah. Because they force you to do migrations and things like that rather than just kind of willy nilly adding on to the DB. And, you know, I'm I'm not a database

much Easier. Yeah. So I don't necessarily know if this is a issue just with MongoDB, but if you want to make aggregations in MongoDB, so that is, like, rid Select and it's got a little lip on it. It wipes off ready. Easily, and they have a couple different sizes. And I was like, man, this is it's nice and neat. It just sort of stays in the corner under the bowls. And I was thinking, like, oh, what else could use this for? Like, if you were doing WordPress web's powered website So this looks pretty cool if you check it out at re and you get access to the Paint API and the Layout API and Animation API and it is very complicated to to implement yourself. So check it out at I'm like, come on. Like, now the kids can't watch a show in the car? You know? That sort of DRM is is frustrating to me rid Because I'm just trying to do the right thing and and pay the money for the website project, but, like, I remember once They said, hey. I'll give this to you for free if you can just fix this thing on my website, and it was like a tiny little 20 minute fix. I was like, absolutely. Let's do it. So I think small stuff can be good, but probably as it gets bigger,

people, to use a headless WordPress setup. I would love your thoughts if you have anything. So I have not checked this out, but this looks like what a lot of people have been waiting for to do because off 0 to 1, and they also do this

You know what? This thing looks great, but this kind of idea, especially with laptops, is gonna be really hard to I think. I know Yeah. In the past, we we were able to swap out RAM and and stuff like that, but computers have so much more solder to the board now, and and I know that's like an Apple rid problem that they largely created their selves. But you know what? I don't know if I'd trust this thing, especially if it's brand new here. I think there's gonna be a lot of bugs they gotta work out with the system. I wonder how long term this thing will last, and since it is a new company, a new laptop, You just never know. But, also, you know, I I personally ran Linux for a little bit, and if you're coming from Mac, it's not

makes it much faster.

Yeah. This is definitely one thing that, is using n p x rid. Serve just to serve up an HTML file. We write all the JavaScript in line in HTML, and we do so for to show you that this is a one zero one foundational

wire and piece of silicon that stuff needs to transfer through, that slows it down. Right? So having them soldered together and on the same even on the same chip

GraphQL,

MongoDB and do the query in the database, and then it will return to you the modified data. It's way faster, like rid Like, 50, a 100 times faster to do it on the database.

go for Prisma. I think so. Rid Keystone itself is now using Prisma as well, which is exciting. I have never ridden in any Prisma, and I I think I would really like it. I used Graph cool back in the day, but I have not used Prisma. Alright. Next question is from Ben Lammers. Ben,

get really messy, aren't they? Prisma now has support for MongoDB. What do you think? Will it make the requesting MongoDB There is a lot of work to do just yet. I think that the reason behind that is because in order for Houdini to a token,

For performance or whatever reasons, but there are times when I think, man, I feel like the database would be better organized right now if it were in post

easy to have it be as easy as Mac. Rid. There's still a lot of,

So I would definitely if I was building my thing from scratch, I would probably that. So I'm wondering if I should get one. There probably are I don't probably don't have to buy a dog mat for that to work. There's probably specific ones for soldering,

So that's 1. And the other is, like, I don't want to use Windows.

I've been debating moving a larger personal project from React to Svelte. I see that there is a plug in for a GraphQL codegen Svelte Apollo. But with my limited knowledge of Svelte, I find it harder to decipher and if the development experience would be as streamlined. I'm wondering If you could shed some light on the developer experience and working the GraphQL and Svelte in TypeScript.

layer be a little bit more solid for me, at least nowadays.

But writing those aggregations

So I don't know. This laptop looks looks neat, but I would I would give it some time personally before for diving in on this thing. Yeah. They tried this with a phone where you could, like, Why can't I just import and use a function? Yeah. Which is what what it does in SvelteKit. So, you know, personally, What what are my thoughts on it?

help with things like migration, so to say. Yeah. It can, you know, make your scheme and things like that. So if this Prisma rid can really at least make would you choose it over CSS or something else in a new project? So I use Sass in our level of tutorial site on SvelteKit just regular CSS in 2021,

Especially aggregations is hard to refactor out of. Rid. But if you're just using for nesting

does not appeal to me as a content creator.

So, Ben, this is what we do. We have our our whole thing being set up through Graph rid Cogent. We do use Apollo, although, you know, only using Apollo because that's what we used before, and I don't want to rewrite that aspect of things. Because I think The way that you'll see GraphQL being done in Svelte might be a little bit different with SvelteKit.

that you can just write read. Prisma queries, and then it will do the translation to MongoDB, which is really exciting.

you can do that and have the data available rid Client side via an observable, or if you wanted it a server side and you want that data server side, you can call it in a load function using the async one, which just returns a promise with the data. And you know what? To be honest, it's been very nice because if we have the data that's coming in from the server side of things, rid We're not needing to worry about loading screens or any of that stuff like we were in the React space where I mean, obviously, we weren't using Next. Js there, but, You know, we're not having to worry about calling a hook, waiting for that data, maybe showing a loading screen for that stuff. We're doing it all server side via the load So this is what we use. The the GraphQL codegen, Svelte, Apollo has been really nice for us. That's amazing that some of these problems just aren't problems,

stores yourself.

rid. And you don't need solutions for them in Svelte at all. I think the biggest problem for Svelte when we were first getting going was making problems where there were none Because we're so used to the React way of things where you kinda have to, like, do you kinda have to do a roundabout way to do just about everything. Right? And then so we'd say, what's the right way to do this? Oh, the right way to do this is to just update the variable. Oh oh, wait. Why was I trying to make this so hard? You know, there's, like, little things like that where it's almost like You have to simplify your brain a little bit because of how easier some things are. Great answer. Next question we have here is from Chris.

So it's one less step of having to write the hook that then creates the function for you. Yeah. And to me, it makes me realize just how obnoxious that is in React. You think, oh, that's just like a little thing, and hooks are really nice to be able to share that kind of functionality.

update user is equal to use rid. Update user. Right? Just that kind of, like, annoying flow where you're importing a thing and then calling another thing to use a thing. But in Svelte, you you just have a function.

And, personally, we've even moved away from using the Apollo cache, Not necessarily at all, but mostly in just doing the entire caching data layer in Svelte, and it has been very easy. Now in terms of the difference between how streamlined is the code gen experience in React versus Salt, believe it or not, the Salt version of it is actually way easier, way better, especially for SvelteKit for this type of thing because with the React version, what you're doing is it's spitting out a hook typically. And so what you do is, let's say, you have a hook that is update user. So it spits out a u or you have a a GraphQL query that's update user. Rid Spits you out of hook, use update user, then you in your code, you say const and, it seems like this people are starting to talk about it. No. I'm not. So what's what's the idea behind this? The idea behind it is it's a little bit more of a DIY high end laptop, and it looks a lot like, You know, the MacBook Pro type of thing, but there's there's the idea that everything is Yeah. You can have it all working, but I still think no matter what, at the end of the day, you're probably going to want some JavaScript on your on your site. Now there are tools that are coming out that are gonna be making a lot of this stuff easier to ship less JavaScript. I find myself shipping way less JavaScript with SvelteKit, But Aster.build is a new tool that is one of the things that is going to allow you to ship much less front end JavaScript code because it's sure you're writing JavaScript and I got on the airplane. And I opened up the YouTube app, and it's like, we noticed you're not in Denver, Colorado anymore. You can't open this app.

One neat thing too is that with this cogen, with this GraphQL cogen for Svelte, it rid Gives you the Apollo one that is. It gives you an why divine in any of your platform projects?

Rid. So that means if you wanted to in the back end, but shipping less to the front end is always good. And I think these are the tools that, you know, you'll probably

async version of the function if you want it, or it gives you one that returns in observable.

was not thinking about the fact that they're, you know, rid Going to be on the slow end of speed of all these new tools, they better start thinking about that because I I don't wanna work on anything with the webpack after working on something with Vite, rid Personally, and that's just my, you know, my personal experience with it. But that said, I was never I never bought into the Webpack train in the 1st place. I mean, it is fantastic, and it great things, but I always had a hard time

the problem with the webpack is that it is everywhere. Everybody everybody bought into the webpack train, rid. But now these new tools are so much faster, like,

with the nature of their their config files and sort of the nature of,

hundreds of times faster, and and people often talk about benchmarks. But let me tell you, rid I cannot go back to slow tools after using ESBuild, which is a 16 inch MacBook Pro, the throttling on the CPU is so bad that when the temperature gets hot, it it

I think Webpack might just move towards being

and Gatsby, you'll see what they do on the podcast for a couple years now. If you're not familiar, Houdini is No. It's it does sound like that. No. But it's,

in the last episode rid

rid. There's many options, and lots of them are very fast, and they're all competing with each other. And it's it's a good life now, and it used to be very, very tricky. So rid I'm very happy that we haven't written webpack configs in a while. Yeah. Me too. And no. Thank you. Cool. Well, that is the potluck I do. I'm gonna start off with saying, Linode's gonna give you $100.

with the tastiest potluck Ever. Today, we've got another potluck for you. This is one of our last episodes that Scott and I are prerecording

handles authentication and authorization in your application, so you don't have to. Talk about all of those sponsors partway through the Auth0, I'm going to Shamelessly plug all my courses. So I make web development courses to teach you JavaScript,

That's not what we were expecting at all, but, rid feeling really good about that. At least, you know, you I was so worried about the kids. So, like, to be able to hear that they were very comfortable with grandma and grandpa, you know, hanging for the week and whatever, That made me feel a lot more relaxed on the vacay. So, yeah, I'm ready to go. And next thing is up, a big move. We're moving to the level up lodge and new house, new Studio. So a lot of changes here. By the time you you check back in with Syntax, here, we'll be on a this will be the last episode ever recorded in my current house, so feels very weird. Oh, it's a little sad. Yeah.

Hey. I'm doing good. I actually just got back from the beach, which was great. We took a little mini vacation, almost like a 2nd honeymoon type of deal. The 1st time being away from the kids, and, we were, like, gone for for, like, yeah, gone for, like, 5 days. We didn't know how the kids would do. Right? We've never left them with the grandparents before. Yeah. And, mimic SCSS.

Kurt, I don't know how to tell you this, But the kids, they haven't really cared that you left, and we were just like, oh, man.

A lot of code was written, and a lot of words were spoken in that little blue office. Little is the right word. Wicked. Yeah. New one's gonna be great. Gonna get new styles, new furniture, new all that stuff. Cool. So trying to I YouTube TV tap into Svelte's Alright. Next question here is from Aaron from Fort Collins, Colorado. Hey.

How are you doing today, mister Talinski? straight to the DB and write your own aggregations.

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.

for the summer, and then we're gonna Go drink margaritas by the beach for the rest of the summer and just relax a little bit. Today, we've got 3 awesome sponsors. We got Linode, cloud computing, and

let's get into the potluck here. We have a bunch of great questions. I was, like, having a hard time even stopping with the questions.

Wow. Yeah. I love this office. Yeah. Yeah. It was a good one. A lot of, So, it might just do that. We'll see. I I don't really know. I'm not gonna predict any of these things, but I do know that I'm very happy that we are in a spot now where these money is a nice common denominator.

Welcome to Syntax, the podcast but I was very happy with it. I was like, this is a nice little,

So the first question is from Marciano s r. What Are the use cases for

And, it was, like, the 3rd day of our vacation, and Courtney's dad was like, Vite, or any of that stuff. It is that much better. It is one of the single best developer experience changes that I've had In a very long time.

you know, they know their grandparents, and they love their grandparents, but still, we never left them for an extended period of time or even, like, a day.

by doing the entire front end in another thing is that you give up so much

I think this is pretty cool. It's front of the it's also HTML rendered on the server, I don't know, a loaf of bread or something like that. And what would always end up happening

any more benefit? Like, maybe, sometimes, a rid Lower level stuff that needed to change in the browsers in order to implement it, but Chrome, like, display Scott, Hosting service, they give you you probably know them for hosting a Linux server, but they have so much more than that. They have storage for your images and your Your videos, they have, be shipped, there's a lot of, like, sort of under is pretty tricky because it's like It's a language that we're not familiar with, and I have a whole

niceties that they give you with classes and, And then our kids are like like, where is it? And I'm like, oh. Like, come on. You know? Like, you're getting in in and that's more, I guess, like, That's not really DRM. That's just more content licensing and things like that. But I'm just like, oh, now I that now I have to download it for my kids because I'm paying my money for this, but Because of whatever is going on or I can't,

all of the templating slate patio installed, over the the 1 year that I was in it, rid Everything's standardized

but sometimes not.

but it's for WordPress. And they're saying, like, Why not use something like Gatsby or Next. Js? And they say, Friendity is a 100% focused on WordPress. It means the number of concepts you need to learn are minimal. Rid Doesn't require complex configuration to get started. The API is what developers use to request content.

header and footer. You give that all up, and you have to rebuild all of that from scratch. And you also have to write all of your queries and and things like that. So I think that's been a reason why a lot of people have not gone for and automatic BEM thing isn't

the dom. The dom asks, I'll keep you on your toes. Alright. Peace.

call me weird. You are weird, the dom, But I kind of like fiddling around with the Webpack configs. I just like that level of control I have. Yeah, sicko.

rid But I stumbled upon it and trying to evaluate it versus other solutions like XJS

This is the type of thing I would love to see more. I'd I'd never heard of this, and honestly, I have a hard time saying it. Fron tity. Fron tity. I have a hard time saying that word for some reason, but rid That seems neat. I'll check it out. I'll I'll definitely give it a try. And, Chris, I do not believe that you are not a plant. I strongly believe your name is Chris Frentity, and you I've done this to get us to talk about Funnity on the show, but, no, I think it's really neat. Down for more stuff like this. Very neat. Alright. Next question here is from

Which is pretty exciting as well, so there's not a whole lot that will be done on the client. So I haven't checked it out myself, but it looks Very promising. I would love to hear from anybody who has built a website in it to see what they,

about doing Next question we have here is from Noah.

and You can use it on any of them. There's also a whole bunch rid. Free ones there if you wanna try it out and see if you like the way that I teach. There's a bunch of free ones on there on CSS Grid or Flexbox, or I even have 1 on markdown, so check it out.

in modern development more so than just handwriting it all in HTML and CSS,

gravitate

HTML and CSS and not use JavaScript rid it all, but more or less, you're taking a a tool like Gatsby or something that allows you to ship a static site HTML and then have it hydrated with JavaScript if needed Or even, like, these tools like Astro that are are shipping way more without JavaScript. Yeah. Yeah. I agree as well. Like, it's it I'm not, like, a purist where rid Say no JavaScript at all. There's certainly those types of people, but your your site should work without JavaScript. At least load so people can read the content on it and be able to click links and and whatnot. But past that, sometimes JavaScript makes a much nicer experience. Rid Not being able to view the Angular docs if you disable JavaScript seems a bit silly because melting temp. So I would imagine it would work well for putting a soldering iron down and not having to worry about

On the client side, instead of either prerendering it or server rendering it, so that that's probably why that should probably work, Especially for load times or whatever. If you're on a plane, you need that stuff to work. Word.

because the way I see

they're probably just templating it all out on the,

Do you go in there? Like, how do you get your haircuts if the I think that bartering can be A little bit frustrating, a $4,000 frontity.org, and it seems to be And then the spec.

BUDS groups on Facebook

Yeah. Totally. How many how many bottles of wine would this take rid that I could reference back to my 1st year. So we did just do kind of an episode about stuff for beginners, and I think that one will probably fit a lot of the things that you're looking for here. But let's say you're starting your 1st developer job. That means you got the job. That means you at least, are not a brand new developer here. What practices can I start to off on the right foot and lay down a foundation? You know, the one of the single best things you can do

where you could only trade stuff. Is that like a marijuana group, BUDS?

Anyway you give me money, and I go buy the wine over Exactly.

and somebody was selling, like, a fireplace mantle for $100.

when Craigslist was still a thing in Canada, Like, people would always, like, look up your email when or, like, I had westboss.com,

versus the money, but I have done it. Our backyard,

And what we did is we just we both quoted And the final thing for me is that, like, I open everything. I I I just opened up 2 of my iPhones and replaced batteries and screens, and rid I will crack anything open and try to fix literally anything I am. That, like, that is my personality, and there's one thing I will not crack open myself, and that is my work laptop. Rid Yeah. My moneymaker, I don't care that I have to go to Apple and talk to the geniuses and and whatnot because rid. My moneymaker needs to work. It needs to be fast as hell, and I don't necessarily care anything else other than that because I I can't be down on that. So, syntax. That is Wow. A a Two letter domain name? That's a cool cool domain. Impressive.

Next question is from Jiffy Park. Rid Jiffy Park says, what is your take on DRM? DRM stands for oh, what does that stand for, Wes? It stands for Digital rights management. Management. Okay. There we go. You implemented or integrated something like That being said, is Webpack going to die Now that better tools are out there, or do you think that we might see a Webpack 6 with ES build under the hood that makes it compete with Parcel Vite rid Snowpack in terms of speed. You know what? They're gonna have to do something because And if it is ruining my product and its product experience, maybe we should look at another way of doing it. Know video games is like a hot topic because there's some video games that need to always connect to the Internet, and I think that's a terrible terrible thing Yeah. Because I don't want, You know, my non Wi Fi connected game to require me to connect to the Internet so I can I can't play it on the airplane or something, you know, that that stinks? But at the same regard, you gotta have something. You can't make your product worse because of DRM, and that is often the case. Like,

Have you ever used your dev schools to trade for other goods or services? For instance, Helping out an auto mechanic with their website in exchange for a brake service on your car or creating a site for a barbershop for free haircuts

And you people would say, we'll trade for 4 bottles of wine. You know? Like, they're just like I'm like, that's what money is. We've standardized on this. This that's what money is.

Exactly. And then, like, you can switch exact models I want. Exactly. Rid Like, what are the chances that somebody has exactly what you're looking for? We've already solved this problem in society. Anyways,

basically, someone would be like, I have this off.

rid for a year. If so, how do you go about starting that conversation? So this is kinda interesting one. Do you barter your skills? And I always think this bartering is rid It's a little bit funny because I was I used to be part of these, hey, guys. I know you both like MongoDB, and so do I. But I sometimes

I was like, you you guys are just standardizing on a currency of wine.

done, so I would say stay away from it, but there certainly is, like, little good use cases for that. I've even I think the smaller stuff is probably better than a a massive it uses React, chair or this hoodie or

on bottles of wine or bottles of beer, and I was just sitting there laughing because it's mostly full of hippies who, like, love this idea of trading.

website, and they did, like, a $13,000 6,000 They have their own state manager, their own CSS and JS solution.

rid for, in terms of, like, using it because we have our dog's rid Water pull on a hardwood floor. Oh, yeah. And every now and then, it spills because you're bending over to give them the water, and it spills over the side. You have to go get rid cloth, and you don't want the hardwood to be ruined.

we got this really nice, to do a show on biometrics

That kind of stuff is is pretty good. I I wouldn't say Sass is

Next question we have here is from k oger.

CSS variables,

Rid. But I was having such a hard time converting our style components and Sass code into the native nesting, and it required so much work. I was just like, screw it. I don't wanna do this anymore, and I'm just gonna use SCSS because that's what I already have. Yeah. So for me, that's the use case. You know, if we're talking CSS variables,

Rid. With that said, we still use it just for the ease. Yeah. Sass is just, like, rock solid. You know? Like, it's Hell, yeah. It's not going anywhere. It's everybody knows it. So If you need something, like, it's I think it's still a good use case, and I think just don't go too heavy on people and count how many courses they have, then you'd probably still will have to go straight to

rid You're probably covered. And I I tried to get on board with the the the native nesting syntax. Wes, have you used it at all? Rid. No. I, we did a show on it, but it's not as nice as just the Sign up for the year and save 25%,

even though we just started that project, and that was a conscious choice because,

I'm using

247

generation, that was another really handy use case for for Sass.

for just about everything with the exception of media queries. So this is a small thing. You cannot use CSS variables in media queries, So this is a small use case for Sass variables or SCSS variables. We we have our our breakpoints all done in SCSS variables to make it Easier across the board for us. That way, we we have them definitively typed out rather than having to, use the pixel values and things like that, But there's really not a ton of use cases, especially if you're rocking with post CSS. There's a lot there that you can do to even

outdated or anything right now. It's just kind of it's like rid Just like the the WordPress, I would say, and I say that in a nice way, meaning that, like, it's it's old faithful. It's there. A lot of people know it, and it's well maintained, things like that. Yeah. It's a trusty workhorse.

What happened to CSS Houdini? It's true. We've been it feels like we've been talking about read. Houdini React and WordPress. Because read. The thing Prisma

Sass and SCSS in 2021, Yeah. I download the content to watch offline on my airplane, can't do Windows sounds like an amazing step for For consumers, Wes, have you seen this? Because I only it only recently came across my radar last week,

and Sass because SvelteKit has PostCSS.

Really, Sass is probably the lowest effort to get things like nesting ready to go. Now there's a lot of different angles you could take to this. You could say PostCSS would can just do it all. Between postCSS and capacity.