Svelte and the Sveltekit framework with Brittney Postma
Coding Design Systems
Going through the Svelte Ecosystem, the Sveltekit project, and a Backlight made Design System.
We discuss about the compiler and the logics behind Svelte Components. We also do styling improvements, to finally use the simple components coming from the Design System in a live Sveltekit app.
The show is also the occasion to cover the support of MDX in Svelte with the mdsvex project, and to introduce the Svelte Sirens community!
Resources
Transcript
Brittney: Hello. I’m doing great. I’m so happy to be here. Thank you for having me.
So the Svelte Sirens is a new Svelte society. New-ish. We started in September. We announced at the Svelte summit in New York. Uh, three of the co-founders came to New York to announce it, and one was still in London. So we did it virtually with her.
It’s a Svelte society for women and non-binary people. And what our focus is is to help support those people in our community and spotlight any projects that they’re working on, but also to produce more content for those people. So we’ve started a Sirens’ stream that we run every two weeks and we just integrate a new project with Sveltekit.
And then we have a monthly talk that we do where we try to highlight women and non-binary people, but it’s… There’s not a ton of that in the community right now. So we’re trying to invite as many on as we can, but there’s also going to be others that are in there and we call those allies. So as long as you’re an ally to the community, we allow you to come on to talk, to be a part of the talks and a part of the stream.
So that’s where we’re at right now. And we’re just hoping to grow and become even better. I feel like I’m not… responsible for doing it. Swyx did, like, come up with the idea. And he asked me to, like, kind of start the initiative. And at first I turned them down. I was like, I don’t have time to add this project on, but you’re so right. How we just need to have that space for people to be able to express themselves, to communicate with like-minded people. So I totally agree. And I’m glad that I’m being able to spearheaded, I guess.
Yeah, that’s an interesting question. So, um, it kind of was two things that were like here’s Design Systems and then here’s Svelte and I kind of wanted to bring them together.
So I did the first Svelte Sirens talk that we had, and I did that on building Design Systems with Sveltekit because Sveltekit provides you with this package command. So you can essentially build a part of your Design System, which is component libraries with Sveltekit and then package it and ship it to NPM to then publish it and share with the world, this wistful kit.
So I was kind of bringing those two worlds together and like you’re building your Design System and you may have that in some other tools. But then you build your component library with Sveltekit and you’re able to package and ship that out.
So Svelte itself is a compiler. It’s just the language like React or Vue. Um, Sveltekit is a framework that’s built on top of that. And they started, I want to say at the beginning of 2020, or end of 2019 with building this. And this is Rich Harris, he’s the creator of Svelte, and he also started creating Sveltekit as a framework to kind of replace what was Sapper. Sapper was the server side rendered static generation framework before Sveltekit.
So, um, Rich was hired by Vercel at the end of last year, I think around November. And he was hired to continue work on Svelte and Sveltekit. So he’s going to be maintaining that through Vercel and building up the project. So it’s still in beta right now to address your other point. I think the hope is that it will be out of beta soon and that we will have a 1.0 of Sveltekit.
I think the adoption is starting to pick up. There are quite a few sites that are using it. I was actually hired by Grainger Incorporated to work on Sveltekit back in September of last year. So we were producing production code with Sveltekit on a huge eCommerce site. So it’s definitely production ready.
Georges: And actually, um, Sveltekit being, uh, a bigger framework for Svelte, you… you can… for a Design System, you can probably just use Svelte, right?
Brittney: Yeah, absolutely. I… especially with something like Backlight, which allows you to do it from code first, I think that… you almost don’t even need these other like design tools. If you’re working with developers, it’s easy for you to use Svelte to build your Design System with Backlight and have that visual connection.
Georges: That’s what we like about Backlight, but I don’t want to plug too much of a Backlight into the stream, but, but thank you!
People can definitely, um, can definitely, um, create components, libraries with Svelte today and then import it into as Sveltekit project. Or, um, um, a Svelte, a pure Svelte app, uh, in the same way.
And this is, uh, and they can do that right… right now. And which, uh, and this is where, uh, um, uh, I have a couple of questions. Um, uh, if, if you, uh, if you’re ok, mads.
In, uh, we have, uh, in the Backlight website, we have a DS Mastery, which is the kind of, uh, it’s a, it’s a documentation to master, uh, how to create Design Systems.
And so we talk about a few things of the Design System, like Design Tokens and Design Kits, component libraries, and documentation sites. And in component library, I recently updated, uh, um, some of this Svelte libraries that you can use to actually start a Design System as a base. Uh, and so I listed the Svelte Headless UI, which is actually an, a non-official port of Headless UI from, uh, Tailwind Labs, um, that are doing that in React and Vue. And there is abstractions and the Carbon components in svelte, obviously that is a big one. And, uh, and Svelte Material UI. And I was wondering if you had the other, other component library base, uh, that you would recommend for people to actually build a, uh, a Svelte components library.
Brittney: So carbon UI is… You have that down there. Okay. Carbon is one of the ones that I use a lot from IBM, um, Svelte Material. Yeah. Trying to think if there’s any other ones out there that I know of.
Georges: I also had a Svelterial that will soon be replaced by Svelte Materialify and I have Smelte, but Smelte unfortunately for what I tried at least, um, last week or two weeks ago, um, the keyboard accessibility was not, uh, was not working, so I couldn’t mention it to prompt here.
Brittney: I know that Swyx just redid a popular, um, it’s a template it’s kind of a Starter. It’s not a component library in of itself, but it’s a Starter Kit with Tailwind and, um, it’s called Swyxkit.
Georges: Um, and so, yes, so I know, I know actually this Starter Kit, I saw it, which is, um, and I think this is based on… It’s actually inspired by, uh…
Brittney: And actually that’s one that Lee Robinson created for Vercel.
Georges: Exactly. And so, and this contains a Design System built in or a little one.
Brittney: It’s a small one. There’s a few components that are in there, but like I said, it’s not a traditional component library. Like you’re looking for buttons and things like that. It’s just kind of a Starter Kit to get started with Sveltekit and it’s got Tailwind for the CSS.
Georges: Um, this has been said, so this is one thing. So, um, if you ever come across. Um, another one, uh, uh, please share it with me. I love those things and then put in that list. And in the same, uh, in the same area, um, uh, when it comes to styling Svelte, what would you say, um, is, is a good option to the, uh, for styling Svelte components?
Brittney: I would say whatever you enjoy styling in. I like good old vanilla CSS, because I think it is just super powerful and especially all the things that were getting in it recently, it’s just becoming the go-to for me. I actually enjoy writing Tailwind and I think it speeds up my development process a little bit if I don’t need my code to be more modular, but if I’m building a Design System, I want it to be modular and… I don’t like having the duplicity of Tailwind. So if you have a UL with a bunch of list items, you have to copy all of your list, item classes onto each one, or create a variable to use for the class name and that part I don’t like about Tailwind, but it’s whatever you want to use. Honestly, I think in everything works with Sveltekit, it provides Sass.
Um, there’s Svelte add is a command that you can use to add Tailwind, to add Sass. And I think there might be another one in there, but like CSS modules is kind of just baked in where you have that scoping by default. So you don’t really need CSS module. So that’s one that I might not
Georges: In the Svelte files directly, right? When you have a style, uh, elements in the Svelte.
Brittney: Yes, and it is…
Georges: We can actually use something like this for… This for, uh…
And so here, if we wanted to, I dunno how come the button is already styled, but if we want to style in svelte, right, we just do this right
Brittney: with style tag, and then you can plot just vanilla CSS in there. And…
Georges: And you, like, if we do the button like this, we actually are scoped for this component automatically.
Brittney: Only going to effect the button in that component. So any other button on your site, isn’t going to be touched by it. And it does that by hashing the class name and adding the hash to the end of the class name in the compiled version.
Georges: And if we look just for what you just explain, and then we can look the button and as we can see the classes, uh, the class is created. So exactly like a CSS module, and then we can have each here. So this is scoped very well. And if we don’t want it scope just all my, um, refreshing my Svelte, uh, abilities, You can still do that by adding global here or something?
Brittney: You can add global in the style tag, or you can do a :global to only add it to the element or a selector that you’re using,
Georges: How do you do that, like this?
Brittney: If you did it to button, then you would do button:global. The other way. Global instead of button.
Georges: Oh, sorry.
Brittney: That’s ok.
Georges: It’s late for me, you know?
Brittney: Oh yeah! Time-zones are crazy. Middle of the afternoon for me.
Georges: Uh, OK, let me check it out again.
And now we have…
Brittney: Now it should affect your button on… every button that’s on your site.
Georges: It looks like it’s a global, uh, scope, but, um,
Brittney: You have a, um, uh, parentheses next to global, I think, I don’t think you need that.
Georges: Uh, but it failed if… I must have a selector.
Brittney: Global must contains a selector. Oh, you know, I’m, I’m wrong. So you do :global and then button goes in the parentheses. I’m so sorry.
Georges: Yeah. So it’s, it’s, it’s kind of, uh, it’s probably Astro pick it up from here. No. Oh yeah. And now, boom. You’re right.
Brittney: Okay, great. I was just backwards. I don’t use global very often because most of the time you want to have your code scoped.
Georges: Okay. That… that’s very good. And if you want to use Sass. You mentioned Sass, I think the same way Vue here, you can say the language is Sass, something like that?
Brittney: lang=“scss”. And is that installed in this project?
Georges: Yes, automatically in Backlight.
Brittney: And that should work. And then you could do like your Sass nesting or any Sass code in there?
Georges: Yeah. I don’t know what I’m gonna do, for the sake of the demo.
Brittney: That’s my favorite one to use. I’m ready for CSS to get nesting.
Georges: Okay. I do… Can I do…
Brittney: Oh, for sure! It didn’t write in…
Georges: Something’s wrong. Uh, is that it? It is SCSS.
Brittney: It looks like your syntax highlighting is saying something’s wrong in the style tag. But that looks correct to me. I’m going to pull up the Svelte Sirens, right? Cause we use Sass on the Sirens site.
Georges: Let me see
Brittney: style lang=“scss” and then. You can use &:hover,
Georges: Yeah that’s what I did, but it’s maybe something that we should check it out, then it should check out this, maybe something on our end. So…
Brittney: If it’s installed behind the scenes, then yeah, it might be something just in Backlight.
Georges: Yep. We need to check that. Let’s fix that. That’s a good, that’s a good one. Uh, okay. Superb. And so, so this is what you would recommend is just a simple, uh, CSS in Svelte files. And actually it makes a lot of sense. And I like to ask those questions because. Um, when you don’t have a compiler likes Svelte, and you do like React, or we had actually solid last time, uh, Ryan, uh, that, uh, creator of Solid.
And so when you are in JS like this, you are more in JS. You tend to use more frameworks and CSS in JS. Uh, kind of things, but here, since you have the scope built-in with the component, it makes perfect sense to just go in and, and have the styles baked in this, uh, this Svelte files. And that’s it.
Brittney: Yeah, I completely agree with that too.
When you’re working in React or more JavaScript, heavy framework, your mindset for me, at least shifts to JavaScript. And so it’s easier to kind of stay in that JavaScript mindset then to flip back and forth. But this. And one of the things I love about Svelte is the simplicity and how it feels like a vanilla HTML file.
You’re creating your script tag for your JavaScript, your style tag for your CSS, and then you have your markup. So it kind of separates them, but keeps them together in a file.
I guess that’s a question for me. Is this backlight version using just Svelte the compiler or is this using Sveltekit?
Georges: Yeah, It’s using Svelte the compiler, only. So when the Svelte, uh, the Svelte, uh, dot, uh, I mean the dot Svelte here is compiled into, uh, using this Svelte compiler. And then this can be used and, and published.
And I don’t know if mads published it. Did you publish it? No, not on NPM, but we could. Or did you, uh, So we could actually use this Design Systems in, in an app. That’s what you are you all I want you to do maybe.
Brittney: Okay. So bringing Sveltekit into like a local environment and then trying to install.
Georges: But maybe we can do like a Svelte. I think I saw this Sveltekit, uh, Sveltekit dot new, have you tried that? I saw that last night.
Brittney: Yeah, with Stackbllitz?
Georges: Let’s do this. There we go.
Brittney: Isn’t that so awesome. I love Stackblitz and I also love Gitpod. Gitpod also allows you to do this with more. I feel like Gitpod allows you to do more. Like if you have Github repos already that you want to use, but this is more for just spinning up fast, new apps.
Georges: There we go. Look at that. We have to, uh, step up our counter, ah.
For your information, Brittney we actually, um, actually did. Uh, so we do WebComponents.Dev as well. And, uh, we have one, uh, very popular, um, uh, blog post, where we actually, uh, written these, um, these, uh, Web Component of this counter. In a, today in a 59 different frameworks for Web Components. So you have them all here with different codes. And so this is why I was saying we need to step up our component because this one is really simple, but the Sveltekit one is really nice.
Brittney: It kind of showcases one of the most powerful things about Svelte, which is those built-in animations that you have out of the box because it compiles your code away. You just have access to so much more stuff, because if you don’t use it, it just goes away.
Georges: That’s cool. Let’s see. Um, so let’s see if we can import our button here. Um, so where is my, uh, so this is Sveltekit, so now I’m discovering as well as Sveltekit, but I, I understand that there is some sort of a file routing system. Um, so this is a…
Brittney: So there is. In the routes directory, every page in the routes directory gets a new route on your site. So it is named after the file.
Georges: And so to those home. And so home, I guess, it’s index.
Brittney: This is the index, that Svelte file. And that is the slash.
Georges: Yeah. And so here we can say hello, and we should have our Hello. Ok, is enough. This is cool. So this is where we’re going to maybe try to input our button. So what we gonna do is that we go on our Design System here, we have our button. Uh, you don’t mind if we merge this a new green button, right? Mads, you don’t care? So let’s go.
Um, new green button. There we go. And I just check that, uh, branch. New green button. Go, let’s merge. Everybody’s happy.
mads: This is one of the best simple reviews that you, you can do
Georges: Self-review is always…
mads: I reviewed myself, and I merged myself.
Georges: Here we go. And now we’re going to release it. So we’re going to release into the free Backlight scope, easy peasy release. We’re going to make that a 1.0.
Brittney: Semver.
Georges: Released. Now let’s see…
mads: This is one of my…
Georges: So this, this is a bug just fixed today by Misha. Thank you, Misha.
Let’s wait a little bit. Here we go. And so now we should have the NPM package. NPM. Here we go. So this is what we want. Let’s go to Sveltekit. So if I’m not too bad, uh, is this no, no, no. How do you, uh, add a dependencies now?
Brittney: Um, I would control C in the terminal if you would like to. And I’ll try to install it there
Georges: Npm install. Okay, cool. And now, um, I can import. I’m here, but it’s not that simple, right. Because we need to go and fetch the button. Yeah. I should have worked this out a little bit before. Uh, Oh, we export the button right there.
mads: But I’m not sure that, um, the import will work out of the box without directly, um, specifying we import the button Svelte element.
Georges: Yeah. That’s for sure. Uh, Sveltekit. Sorry. And so, so it’s a named export now. So we probably want to do this. And now we can do a button. Oh, sorry. And now I need to run this stuff again.
Brittney: Oh yep. NPM run dev should run the server for you.
Not using input statement instead of a module. So this is a thing where we have ESM in Sveltekit and it’s use is neat. So is this using common JS?
Georges: No, not that I know. Um…
mads: It should have exported, um, a compiled version of the Svelte component, but I’m pretty sure we could access, um, the button in the src folder as well.
Georges: Uh, you think so? Yeah. But then, um, yeah, then in that case, I need to make another release. Let’s make it patch, but this time I’m going to include the source. Yeah. It’s probably the right way of doing it with Svelte. It’s probably not transpile this Svelte files and import them from NPM directly. I don’t know, what you’re saying, Brittney?
Brittney: I’m not sure. Um, so it’s compiling all of the code and pushing that to NPM. And then we’re trying to import that package with the compiled code.
Georges: Yeah.
Brittney: Yeah. It almost should just be the straight Svelte component that you’re getting. And then you should be able to just import, like if you had as Svelte component in your components directory.
Georges: Let’s do this.
mads: When you’re building a library, a collection of components using Sveltekit, um, how it is distributed when you publish the package is just a collection of Svelte files or, uh, is it pre-compiled by, by, um, by the tool behind it?
Brittney: That’s a great question. Let me see if I can find my… package that I created for.
Georges: Hey.
mads: Awesome.
Brittney: I wanted to say that it was…
Georges: That’s the style is not. Yeah. I know why you had it in some global styles.
mads: We need to improve the global stylesheet from the package itself
Georges: Oh where are those styles coming from?
mads: Let’s have a look at the quick tutorials that I wrote. Um, I can’t remind that it’s something probably coming from um, the theme package. I guess so.
Georges: Uh,
mads: It’s coming from the switch theme. No, from the theme. I’m pretty sure it’s coming from the theme package.
Georges: Oh yeah this is a…
mads: Need to revamp it a bit.
Georges: Yes, yes, you have to revamp it a little bit. Let me fix it. So we’re going to try to avoid any styling. So to do this, we go on and just remove that. I don’t know if it’s boring, but I want to see this button nice and clean in…
mads: And you’re right. You’re totally right.
It’s interesting. Um, this is Svelte, um, starter kit, um, started a few months ago and we didn’t touch it in any, um, really in, in the meantime, I just tried to improve it a bit, but, um, finally we with so many changes, um, in our very implementation in the way we are dealing with tokens and components and so on.
So it’s a good exercise because we could extract all of the theme related stuff into Design Token, hosted in CSS, custom properties. And finally just refer to this custom properties, in the styling of their different components, um, in, in their specific styles and not at the global level.
Georges: No, no, no. There you go. You guys like it?
mads: Perfect.
Georges: Okay, so now we don’t have any global styles. We are good to go. Um, and now gonna uh, push this.
mads: I would probably take some inspiration from the, the open props project. Yeah. From Adam, because there was a lot of nice things in it. The way he is exporting the different tokens in different custom properties, relying on them and the components after that.
Brittney: So it does both. It looks like when you run the package, command it, transpiles them into single directories for each component.
And then there’s a components directory that has the original component.
mads: That’s interesting.
Brittney: Yeah.
mads: Maybe we could have a look to see if we could support Sveltekit in Backlight? George what’d you think about it? Would it be interesting?
Georges: For Design System Sveltekit is a framework the way, the way Saper was and the way Next is or Nuxt is. When you build a library, a I guess Svelte is a, is a better choice. Um, so now I updated the Design System. I run again… and what I want my nice button. No. Oh, I didn’t say…
Brittney: Did you update the version that Stackblitz is using?
Georges: I tried, let’s see if it really happened. Oh no, it’s still on the old version. There we go. Now it’s on the new version.
Brittney: Yeah. Yeah. The package.json and the package-lock files always get a little wonky.
Georges: Yes, that’s cool. Um, okay, cool. So we did it, we build a Design System. I mean, we built a little component in Svelte and we, um, imported it into a Sveltekit project. I’m very proud of myself tonight.
mads: You can, definitely. That’s great.
Georges: So we are running out of time. Um, is there anything, um, you want to, um, you want to tell us or anything we should know.
Brittney: Not really. I, I agree with like using Svelte in Backlight. I think that that makes more sense. Where Sveltekit just kind of allows you to use that package command to easily push things to NPM, backlight, is doing the same thing for you. So I don’t think you need that power of Sveltekit there. Um, you might be able to look at what Sveltekit is doing. Cause I think all it’s doing is creating those transpiled files and the copy of the component to. So it might be doing a similar thing there that you might want to look at.
Georges: Yeah. We need to look at the transpiled form fo important stuff. Um, and the documentation about it. Let me take some notes.
Brittney: I really loved what Backlight is doing though. Cause it’s just, it’s taking a lot of the setup work out of building component libraries and allowing you to just start with a code where most of us front end developers wanting to be anyways and making it so much easier.
Georges: Yes, that’s, that’s exactly what we trying to do is like you can really focus into building your, your components and, uh, collaboratively with everybody and, um, And just all the infrastructure and build and the release and the visual review, it’s all managed, uh, by, by the, the platform.
Um, one thing that I wanted to ask and, um, and actually we, we don’t support it yet for Svelte. You know, we have a doc, uh, we support the documentation of the Design System. And so what we like to do is to have. Uh, usually have some sort of MDX or a Markdown and then have the components that you build for your Design System in the documentation, because it’s so nice to have the documentation and the living components inside it. And so we haven’t implemented yet, but I know Svelte has…
Brittney: mdsvex.
Georges: Exactly. I’m going to there. And…
Brittney: I think this is like the mdsvex site, but if you visit like the actual mdsvex that’s… this is supported in Svelte. The Sveltekit implementation of it is still being worked on. So there are still some bugs and it’s still an out, um, beta, just like Sveltekit is. So penguin is working on getting that set up, but this would be your alternative to MDX for Svelte.
Georges: Superb. And would Sveltekit has so mdsvex, uh built-in or it would be an, a new Markdown processor, for Sveltekit.
Brittney: I think, um, he uses Remark under the hood. So, um, this Svelte add command I was talking about earlier. We’ll probably have a way to you’ll spin up a new Sveltekit project, and then you would run, svelte add mdsvex, and that will add that and configure it to your project. That’s one of the nice things about the Svelte add command is it’s one command you run and it configures everything.
You don’t have to make like five config files and make sure they’re all connected.
Georges: Uh, I was not familiar with this, but this sounds interesting. And because we’ve seen those CLIs where you can say, okay, uh, create anything. And then you have a list of templates that you select. But what you’re telling here, it’s a bit different . It’s like: you can start with a template and then say, oh, I’m going to add Tailwind or I’m going to add, this and that, and so it’s a little bit more, um, uh, it’s a bit more interesting in, in certain ways you don’t need to have like 20,000 templates and then pick the one, the precise one. You can maybe build it easily in the one you want.
Brittney: Exactly. And there was even conversation about having the Sveltekit CLI ask you if you wanted a starter in the CLI, so like asking you what you wanted added to it. Like right now, I asked you about TypeScript, ESlint and prettier, but maybe in the future, it might ask you if you want tailwind or sass or like what things you want to add to it and just kind of give it to you out of the box without having to have all those starters, which I think is really nice.
Georges: Yeah. I don’t know who’s working on this, but the help to those guys must be exploding because I’m pretty sure that changing those configuration files with the different things must be quite a challenge.
Brittney: Yeah, it’s definitely interesting. And they have a different kind of brain power. I think in my opinion, like Rich Harris, just his brain works differently than the rest of it. There’s a few of those people out there that can do that stuff
Georges: Well, superb!. So, uh, yeah, we, I think we’re gonna integrate with, uh, mdsvex. Um, very soon so that we can also write a documentation of a Svelte Design System, uh, with, uh, some sort of Markdown with enrichment of, uh, components. Um, but, uh, yeah, but this being said, we just added the supports for Astro and Astro has Svelte support. So this is also an option now.
Brittney: Yeah. If you support Astro then it should support the markdown the Astro uses. Which is… Is that a different flavor? Don’t they use a different flavor of Markdown?
Georges: Yes. Yes. Absolutely. You… you still put the components in it, but the way you import it is with the, um, it’s with, um, a front matter.
Brittney: And they have like some Astro specific syntax you have to use in there, like the Astro files.
Georges: Exactly. Uh, so they have here the Markdown. So this… this is the parser. Uh, and then, yeah, this is how you do this, so, uh, for example, how to import stuff. There we go. So this is how you import things. And then, I mean, you input the markdown component and then you can put markdown inside it, but then. Um, that’s on the right page here building component. Where is it?
mads: Maybe it… maybe above I guess
Georges: Oh yeah?,
mads: I’m pretty sure, I saw it
Georges: Oh, Astro Markdown Component
Brittney: Oh, it’s like a Component and then the children are in Markdown.
Georges: They have it now. So I don’t know.
Uh, maybe it’s not documented yet, but they do. Did you have, uh, this now recently since version 0.21? Um, there’s something also to try.
mads: Yeah. It could be interesting to have both finally having this, you brought of mdsvex, or the ability to write Astro files for the documentation by the component in them. Really nice.
Brittney: That is, that gives you a couple options there. Look forward to when it’s all up there, writing the documentation with the components in it is just really powerful. So…
mads: Yeah. An interesting thing of that. If you’re write them with Astro, you could finally power a mini website dedicated to the documentation of your Design System, because you’d just have to compile the Astro files into the final website at the end. That’s all just extracting the documentation from. Yes, exactly. That’s um, that’s really really nice.
Brittney: It is. Yeah, I think that is one of the best things. Like a huge component library can make it in several different languages and show the documentation, how it’s used in each language and makes it a really powerful tool.
mads: Yes, for sure. Awesome. So I guess we are, um, We are running out of time. So, um, so it’s probably time to close the stream. Um, thank you. Thank you very much for being here with us today. It was really nice to, to have you, um, it gave me a lot of new ideas to improve the, these Svelte Starter kit into Backlight. So, um, so yeah, that’s really cool.
Brittney: I’m so happy. Yeah. The only thing I wanted to add to is I co-host purrfect.dev. And we just had Mads on to record an episode. So that should be coming out within the next month. We had a bit of a backlog, so you’re going to be able to check out backlight.dev on purrfect.dev, the podcast. And then we have Mads coming on this Friday for the Sirens’ stream to show off integrating that Sveltekit project that we just did on this stream.
Georges: Ah, thank you. That’s awesome. And we make sure we have all the links to the podcast and to the Svelte Sirens, also, uh, every… everything we mentioned, uh, in the description of the video.
Brittney: Absolutely.
mads: Yeah, for sure.
Brittney: Thank you so much for having me. This was great.
Georges: No, thank you for coming. You, you, you come whenever you want again.
Brittney: Okay.
mads: Yeah we’ll continue to improve this Svelte project. That’s really nice.
Georges: Yes. Next time you come it’s going to be perfect
mads: For sure. On my shoulders.
Thank you very much for today. Thank you. Both of you and, um, see you next week, folks for a new episode. Um, with Kaelig this time for a custom design. So, um, see you later. Bye-bye .