The New Syntax Site × Ingest, Stack, AI and more

how to do that just yet, but I think we can do it with OpenAI because

and Deepgram did that. And then I also realized, like, it's cheap as hell. It's worry that it is in like are going to sit there and read through an hour's worth of transcription. I think the real benefit is now that we have between those two things, What I use what I do is I take the syntax MP 3. I download it from the website.

Talinsky. It was calling it like

It was very good,

Transcript all on the free credit. And then I scrapped it,

But it doesn't do what something that Otter dotai did, which is it doesn't re realize who Scott and me are.

like you have with your Alright. Tech Stack. Tech Stack, stacking it up, stacking that tech stack.

a sentence. Or every time I take a break,

is inside of an index dot HTML file, and you can't write to that body Get familiar with the patterns and everything rather than just pigeonholing myself into straight up dark mode.

server side code as you're compiling this stuff. There's no access to the DOM.

both

some other weird Polish name, which was hilarious.

if you take the the Deepgram transcript For me to handle. So PlanetScale does that. It's called connection pooling. It does that for you. It does

I tried a bunch of different ones out there. I tried Amazon Transcribe, deploy previews branching a bunch of stats around it, which is My perfect So I ended up, lot of people on Twitter are like, hey, check out Deepgram. So Deepgram is an API. You just send it your data.

they want it in the same systems, but It's just kind of inflexible, and it wasn't amazing at the end of the day. The next one I tried is Whisper.

If you wanted to do it, the data attribute route, which is another thing you often see people do. You often see people use data attributes

is one that you can run both locally and on as it's part of OpenAI.

Involved in this, it either

what we do essentially is we have a theme wrapper

Yeah. So I asked OpenAI the 1st stack that we did, so I'm very looking forward to being able to add in my pieces. So I've been I've been building all of my hunks sort of outside of this Just because I've been doing a lot more experimentation, Quite a big player in the space. I didn't know because something like PlanetScale And that was you can upload audio, and at the other end, it will give you

To add a data attribute to the root element, and then you can override your variables based on the data attribute for root.

experience was optional It's on. Alright. Next 1 we have is, the transcription, And

Statement. I it was I asked purple stinky cheese or something.

Extremely useful for the website, of course, because we can we have been kind of been splitting

And then I tried, okay, well, if Scott's there, then All right, copy paste this export. You know, like, as soon as there's a human process So there's another project called WhisperX, So Whisper meaning that if you need to connect

being able to show what the person is saying. Then there are The transcription.

me wrong and I had to change my string to just a regex of

on the moon. It just said the moon on one of them. So I just I did a regex where on

If we're setting a background image or background color, it's not going to be on the body necessarily. It's going to be on the theme wrapper. That theme wrapper Has a minimum width of 100 VH so that it always takes up the entire viewport. Right? So because of that, So there is definitely I'm still getting used to it, but I do think it is maybe just a little bit easier to read. What what is it about this website that makes you wanna go light mode? Like, why this website? Nothing specifically about this website. But when I was working on the theme engine, which we'll talk about,

gets missed or Chat GVT. I said, what's the clearest sentence Give me different vibes. That's good. I I honestly I agree a lot. A lot of times websites have, like, white text on black, and I find I find that hard to read. I much prefer the opposite. So I think I'm a big dark mode user myself, but I never have it on system. I almost always have it on. I choose because if it's if it's not a good dark mode, it's hard to read, and I honestly think dark mode is a bit overrated. Yeah. Yeah. I don't know. I'd I'd It's still dark mode big dark mode fan, but, you know, also, So love it. I've got a bunch coming your way. And also the other thing I was going to ask, and I think I know the answer to this, is Once you have it set up, like, let's say you have a show it's funny because I would always watch start to finish. I don't want to have to enter join or deal with primary keys and whatnot. And Especially, like, what we're building is not However, there there's some downsides there. It does do diatirization,

As a buffer, that was really important. It was as a buffer. I don't have to, like, read files, save to file, read file. Right. It's all done in memory.

The start and the finish of that word. Like, it gives you things called utterances, which is like

Otter AI does it, but I want to be I want to use an API so we can automate this thing to finish. Right. I don't want to have to, like, One of them 60% of the thing was, like, very rural,

it's 0.4¢

the first thing in all of the stuff I've been doing is basically I need to get The MP 3 turned into text, right? Text to speech. I thought it can't be too hard. And I actually went down this rabbit hole a couple

and it detects the guest's name per minute,

Meaning that every single podcast, like an hour long podcast we do, is going to be,

know, if if we have the guest stored in the database or in the markdown as who the guest is, And we know that a guest is talking. You could just do a string replace for guest with their name. Now I don't know if that's practical. I think that will cover I'm sure all of our reservoirs, all of our rivers, all that stuff are very happy. But It's it's been wild because it's almost like every other neighbor that we had was having You know, mature enough of a technology, I can get real answers about things that I want to know. And it's giving me good good advice here and there. I'm using it To, help I had one for themes at some point, but I've revised the theme system to be databaseless.

having that available for server side rendering.

syntax

We can do a lot of other things with that data

And it calls me West Boss

And likewise,

and you, like, marked alright. This is Scott saying this. This is Scott. This is me. If you did enough, it starts to learn.

And then anybody else that is not

pretty much perfect for everything. I was gonna say. So, you I just by the simple fact of turning on light mode to Give it a try and check it out. I was like,

Their SDK is like TypeScript,

that you didn't say. Mhmm. And it it wasn't a 100%, and I wasn't, like, really happy with that. So, My gosh. Pretty unreal to build, and they give you $200 in credit. So I I did I think I did the entire

Deepgram doesn't do that. And as far as I I cannot find any API that does that. I know Descript does it. I know

And pass that into OpenAI and say fix this. It actually gives you a really good working with somebody's API in so long,

dynamically

so I had to redo it. So I did end up paying for it. But it was I was just very happy with So Deepgram is definitely the winner there.

but also has all the JS doc types and examples and, like,

So what I ended up doing is I wrote this, like, massive

I have a theme property that's just accepting a string on the database.

at 8 PM. You know? So and it also seems like that company is going

and then read from local storage and then set the theme. The problem with that is local storage is not available on the server side. The HTML gets Sent with the light theme or the dark theme, then reads it from the, the client side local storage. Bingo. Bango. You got a flash of unthemed content.

I have not had such a nice

with Dino because it's like, oh, I might have thought this one was Dino. Let me replace it.

to create a theme, all you have to do is create a new CSS file inside of the themes folder.

And then I said, my dog eats Like, you have an array primitive if I wanna pass it 7, 8, 9, whatever those values are. I don't have to, like, first create those primitives And then pass that into Prisma. Prisma will allow you to pass it nested content, and as long as it matches the relationships, it'll it'll update both of those tables. Yeah. For the best part and there are some times where you don't want to do that. For instance, like, to make it work with the syntax website. But I really don't I'm not gonna And I was so frustrated with trying to get Python running. I finally got it running. But every now and then I would get these such bizarre Like it was it was spelling it d I n o. Sure. Yeah. So it has an option to pass it keywords.

But then so I gave it Dino and a list of words that we commonly say. It was also calling you like people interviewing doctors, talking to patients, things like that, and you can transcribe those and get data out of it.

So I passed it. Scott Dalinski, West Boss, Dino.

is going to be the guest. Right? Then when there's 2 guests, we don't have that very often, but then it pops up. Then it gets a little bit weird, and we can simply just fix that by putting the guest's name in order of which they talk.

it actually gives us a list of guests

Talk about another fish to fry. Let's talk about this theming system, which is something that I've been working on. This thing is pretty neat. You know, theming systems are fun. A lot of times, people just opt for the the dark mode, light mode. But there's a number of challenges that go with on with a a theming system. 1, No. You don't want a flash of unthemed content, which,

Super well.

every single word we have ever said, This is a new utterance. Right? But then it will also give you every single word, which allow us to if we ever wanna, like, make one of those clips where you highlight the currently spoken word,

We've solved server side rendering. We have themes automatically being submitted, which means that

So what I came what I came up with was my name Please buy some

You have that data being able to save. It's unreal how much data it gives you. One thing about Deepgram is that it like, you can give it things like Dino.

your transcription. You can download it however you However, they don't have an API. And it seems like since then, they've also I reverse engineered the API what, 15¢ I've been feeding it through OpenAI,

And that worked

where it spelled it d I n o, but then it also

Otter dotai is out. Amazon's out. Whisper X and Whisper are out, and then I tried Google Cloud Transcribe.

broke a whole bunch of other stuff. So That's not ideal just yet. There's some weird things. But I again, I've also found

Or offer, like, a transcript if somebody wants to read it. But I don't know that that many people We already talked about this before. High school DJ.

and it takes classes that are named Theme hyphen whatever the theme name is. Mhmm. That said,

they will listen to hours and hours of Then I use FFmpeg which is You you want like, you read an MP 3 into memory.

from

things that I say, and then things that, like, are I call them the growler, like, the the intro guy. The growler.

In the next stuff I'll talk about,

At a 100 minutes of a paragraph dumped into the thing, you need to be able to say, alright, 6 minutes in, Scott said this thing.

That I guess that that's a radio word, the growler, like, oh, little grouper.

So you can pass it. You can run it on your computer. That one worked pretty good as well. The downside to that is it doesn't do diatarization,

it's, again, that's another fish to fry. I'm not gonna go that deep into it just yet. That's another fish to fry.

That a human can say for transcription. You know, like, what's the, like, bang on? This will always get transcribed perfectly.

brutal thing. Like it didn't allow you to pass it a buffer, Anything that I would consistently

it will say speaker 1, speaker 2. So I went down that rabbit hole for probably a whole day

that wraps the whole site,

Otter dotai would if you did a couple Same thing. Doesn't do diatritization.

And at that time, I landed on a service called Otter AI.

There's actually quite a bit that goes into it. And or something like that? it's crazy. So

which is essentially taking the m p 3 that we have and turning it into text.

got

the other one is B, who the speakers are.

So good. Like, such a beautiful

That's it. Right? So because the user information is available for server side rendering, that means the current theme that they want is also available for Server side rendering as well. The big problem is is that with many of these things like, It's way not as mature, and the idea is is that you get to write MySQL Hey hey, Wes. What was your high school DJ's name? It's nice and easy if you wanna run a local version of MySQL only secure cookie They give us all the special sauce on top. All the special sauce on top, and Prisma makes it easy. You just pass them in the URL. You tell it to MySQL database, To do that, I'm using a post CSS globbing plug in to import every single CSS file inside of that. That said, that's going to That's going to increase the global CSS. So I'm thinking about doing it dynamically via JavaScript instead. So that's probably something I'll I'll work on today just so we're not loading CSS for All of the themes, if using random UUID.

Scott is saying this at this point, right? They can't just give somebody Years ago when I initially started working on transcription for the Syntax website.

can happen because typically the way people are doing their their theme systems, if you read blog posts and stuff like that, they're just like, oh, just Hosted in local storage

Bullet point everything for you.

another

All kinds of really neat stuff. So Luckily, you at the end of every show, it says thanks for listening. Like the show and leave a review. So you said that at the end of every show so I could get you.

So in the past, List array of things that Scott says, say

All I had to do is 1 out of 500 episodes or 600 episodes.

Now that we have the transcript, like, what do you do with that, right? Like, obviously, we have transcripts on the website And basically, that's a Python package from, I think, PyTorch Way more in the direction of

are Python based, right? They're not JavaScript based.

It's stored as a buffer. Right? Mhmm. And then you pass that buffer to an SDK. Alright. Here's my MP 3. I didn't allow you to do that. You had a and then you it didn't allow you to give it a URL. So you had to, like, pass it. You had to upload it to s 3

90% of our other use cases, which is if there are 4 people talking on the podcast, the Growlr, Scott, me, And then somebody else. Obviously, somebody else is tell somebody.

So I was like, you know what? This is not very good. And I kinda looked into it, and the guy building it is obviously very smart, but it's like a research project for his it does a lot of medical records, so

is labeled as a guest. I haven't figured out

And

I'm not gonna be fixing that on

Monday night

and it worked great. Now it can 100% detect Scott and me in every single episode

So if it fixed stateless 50 serverless functions to it, generally, you can't do that With most databases unless they're

And that's pretty cool because

Body, for instance, in SvelteKit. The body

perfectly. So we could also So just take the list the guest name in order that you feed it the transcription and then apply it based on that. So we'll figure that out, but it's not a big deal. This is wild. Yeah. We were we were talking about doing this kind of stuff 6 months ago. Yeah. It's that will actually detect

a lot. Mhmm.

paste is wrong or, like, there's all kinds of issues that come in place. Right? Like, I want to have this stuff as automated as possible.

because, like, I was able to get a transcription

For the ORM, the basically, the connector from the data to the database, allowing us to work with the databases

Oh, man. We had great school and high school. I just saw the word stack, and it, like, came into my brain, stacks of wax. That was ours. He had stacks of wax.

Movies

A glance at it, see what's going on, see what we're talking about, see how we're thinking about things, and see where those processes are before maybe Trying to,

it's just definitely but you could do it local if you if you really wanted to. That should be no problem Because it's just straight up MySQL. Yeah. We should say that, like, the benefits of using in node with the crypto package that comes with node via the random UUID So, you wanna kick it off with the tech stack that we chose? Yeah. And and, Actually, even before we do that, Wes, I'm gonna tell you something. This building

They were a lot of fun. I remember that very vividly. Alright. Tech Stack. Stack to wax. In this tech stack, we've kinda gone

But it was and then I send it off So that I tried that one. It's just working with the Amazon Python errors. And that's kind of the thing about this AI space is a lot of these tools

as we're working on it. You can follow along if that's something you're into.

I think it's in my best interest to experience

We have a link in the show notes here. We'll have our all of our GitHub issues and their milestones and all of that will be public as well. The only thing that's not public so far is the projects And maybe these strings could come from an INA. Maybe they don't.

chime in too much, but either way, we are gonna be building in public. And if you wanna see how we're organizing this thing, The types of things we're doing for project management, the way that we're working on issues and things like that, those are all going to be public available for you to check out. And, You know, honestly, I we're still We're using a MySQL database

light and dark modes, all the modes possible. Like, really

middle school and football and high school. Oh, yeah. You you would see what all these things look like, and, like, Ours look nothing like that at all.

I don't think we had a a DJ. Like, you you have a DJ at your middle school? And they don't have dances in Canada.

dances every now and then.

But what? You just have a DJ at your school all the time? No. For we we did, like, monthly school dances in middle school. Oh. They were called,

usually just somebody's older brother who's Like, you always thought they were so cool, but then you realize, like, what what a degenerate of, like, this like, guy that's, like, 10 years older than us coming to play. Oh, yeah. There's, like, CDs, whatever. But My middle school party. Yeah. I went to a high school where, like, probably

you know, maybe, take but the linting in Prisma is so good But if I try to do anything like that, it gives me a red underline and a good error and a link to the documentation that tells where about it. That's great. And because of that, I'm learning quite a bit and able to, you know, go with it. But, you know, it is all a learning experience because when we did the giveaway site, The the modeling was not that intense. Well, we had claims, and we had, people who made the claims, whatever. We or you had a a Coupon code, and you had a user that submitted that coupon code, and that was really it. Within this process, I've already created a table for Users,

Easier.

So this site is open sourced. It's available So What I had to do was wrap the whole site in a div. So it goes body, then you have your theme wrapper. That theme wrapper contains everything.

growing up, and you would see what American

if I'm building a site and building sites and using interfaces, having to create tables for So many things that I'm not used to creating tables for, you know, not not being able to do a an array of primitives.

to be seen

is it appropriate Get to chime in and give my 2¢ on this and that and whatever here. And I think at some points, it might be maybe after you're using the thing And the things up, that might be a more appropriate time to do that. For right now, Hits GitHub. But before it hits GitHub, it creates a UUID

Very similar to what we did in the claim or the, the coupon voucher, the giveaway site that we did. Yeah. Where we're using Prisma

people that went to it. So, like, usually, the high school dances were just, like,

oh, where I went to pop pizza pop candy fun. Maltby dances are number 1. Well, that's wild. We Would have

that will probably be public at some point. I I didn't have it public because we were, like, moving the repo around and stuff. So there was a little bit of,

Ours definitely looked like that. We had a so in our activity nights, You could dance with the girls if you were cool.

growing in in elaborating on it all the time, so limitations,

Do you have to

anything that would need raw straight performance like that. Yeah. And let me tell you. You know who's been a big help in all of this? then what happens is we redirect to a specific GitHub URL with our auth URL, with our you know, give and play there. Either way so we'll have a link to the the branch. The branch is named v two. And, also, we we'll be updates to the Discord. If you're not a member of the Syntax Discord, I'll have a link for that in the show notes. You can also get updates. That way, you can follow along and see what we're working on. Now some people have have been wondering about when we're working public and we have these GitHub issues, this token to be an HTTP

via PlanetScale overall a work in progress.

ah, shoot.

Yeah. And I'm using an import glob plug in as well to glob CSS imports for the theme engine. We'll talk about that. But the site is built in SvelteKit

What you can't do But even actually, before we get in the tech stack, West, let's take a, like, a a second to talk about, like, the project management stack and, like, working in public and some of those aspects.

We both have experienced how nice and and, honestly, the the migrations aspect is one of those things that I just really migrations are painful for me. So being able to do I have a guest, and I want to Upsert that guest. Right? If the guest exists already, I want to. So for some of those processes, I have taken it out of the flow to say, Alright. Do the guest. Check to see if the guest is there. Upsert it. Then then use that guest inside of the next object. So I have separated some of it, But the real benefit, I think, comes from querying the data because you'll be able to query data effortlessly blindingly for the site.

a very long time since I've written

PNPM DB push and have a a you know, migration go up is super easy for me, and it tells me if there's anything I need to think about or worry about or whatever. And I I I just been really, really fan of this stack. Let's get into the auth. I've already built in the auth for this. Oh, I I think you forgot a major part of the stack, which is Oh, yeah. I did. Yes. You're right. What? Oh, so wild. Okay. So, actually,

roles, shows, guests.

and then you want to pass it a list of it wasn't working very well. So what I did is I said, hey, Scott, Can you record yourself saying,

its string of an array like you would. And, like, you would be able to do according to the documentation in Postgres.

kind of technology is 100% standard.

Figuring out MySQL stuff or Prisma stuff or being able to ask questions is chat g p t. You know, I ask you questions, and since MySQL's, a user's only using 1 theme. Right? Might as well save some little space there. So we've solved flash of unthemed content.

to pull in the stuff. You know, I'm so used to Mongo where it's like, Oh, now I gotta either do an aggregation some bit of House emergency.

It's like, And it handles all the stuff that, we didn't wanna handle. You know, people

around the time that we were picking this ORM was around the time that people were just starting to talk about things like Drizzle,

In MySQL Any user interface on the entire site, whether that be the header, whether that be,

For instance, It's easy to store in the database. Makes sense to just put in the database.

type queries server side rendered, so it's gonna be a server side based site.

In an ORM rather than using ORM syntax to do, like, create many, delete all, whatever. Now you know,

None of our code has anything to do with PlanetScale. However,

And because it's a MySQL database, that then puts in certain limitations.

for it and have that be its own table rather than have is do that, and and Prisma will say,

MySQL under the hood? Because I like, Prisma adapts to a number of different databases out Right? Like, you could use what are what are the ones that you could also use? Postgres.

my sequel straight up. So for me, if the if the, selling point is, oh, it's just like Prisma, but you have to do more and you get to write,

because you need to create a database connection that stays open.

they come back and forth. And if you have too many connections to a database, then it will say, yeah, that's too many Who the speakers are. And

For me, that's not a huge selling point because I'm not a MySQL wizard or anything like that. I I've been primarily working in MongoDB since Meteor came out, which was 2011. So it has been

Postgres or SQLite or You could use Mongo with it. Yeah. There's a Mongo. So, like, when you're When you're making the schema

The benefits of that is it's just MySQL. So if, like, we wanted to Pick it up and move it or something like that. It's not gonna be that hard to do that. It's MySQL. But at the same time, it worked really well for the giveaway site.

I have

hey. We noticed you're in a MySQL context, and you're trying to do an array of primitives.

And then when you send queries and mutations to it, SDK was just such a to Deepgram

and connect via that way. You could do that as well. I'm running my development version just straight off of the the net, But, honestly, I didn't wanna lose all of the migration stuff that you get with Prisma. There is a migration

Rob MySQL, that to me is not, like, really that a huge sell for me. Yeah. No way, man. Just me personally. Yeah. I I just wanna be able to

or I have to model my data in a way where everything is nested. And normally, I went the aggregation route, which is Heavier on the CPU and a little bit slower, but more freedom. And at that point, you're just like, why aren't you using a relational database anyways? You know, and I haven't been here in a little while, and it's kinda novel and interesting. So Yeah. It's So that access code can then be used You play video games if you really wanted to ostracize yourself from the school at a school dance. You could just play video games the whole time, or you could just hang out, whatever.

Array of strings.

a roles property. This roles property is going to be I forgot some other things too because we're using post CSS as well. So post CSS That's the preset ENV for CSS.

as being like an alternative to Prisma.

You can't do that here.

So, you know, there there's so many different little little things here that I'm I'm picking up as I go. But for the most part, Prisma makes all that stuff really easy.

like doing a field that's an array of primitives. So if I wanted to say,

a Okay. The session token is then used to create a session in our database.

you can use middleware to then look up the user from the session every single time. And on every request, eventually, we'll cache that in a better way, maybe in, like, a or something. Who knows? But either way,

a unique identifier

yada yada yada.

to any sort of bumps along the way, but, you know, that's been a learning experience for me as well, moving off of MongoDB,

then get what's called an access token.

comes back with that same session token This is a topic of a video that I wanna do. You don't need a dependency for UUID.

If you if you don't know about this, you can create a UUID You could play basketball if you were sporty.

Function.

The user doesn't exist. Don't. Right? Or or create the user.

Load that user's information.

K? So the session is being stored in our database Before we've even talked to GitHub, So the big deal is making sure that if a user has a theme set, that that theme set is available for the server. That means you Either needed in a cookie or in the database.

the user that is

So we get an access token from GitHub.

A step by step inside of our code that says, here's what we're doing. Pull the code from that. Use the code. Use the access token. Use the data. Create sessions, set the access token, redirect to home page. Done. Okay? So if you wanna follow step by step, I did write a a little step by step exactly what's going on. And that's one thing I've been trying to do as I go in this code because I I realized that if we are building in public and we're an educational podcast that perhaps people would like to read the code, and perhaps I'd like to read and learn from the code. So I've been reading a lot of helpful comments to specifically teach people what's going on while we're doing it in case you wanted to follow along. So either way,

we're able to then update the session with the access token as well as the,

And that gives you a random UUID. So that's our session token. So first and foremost, we hit this thing. We create our session token.

Then we find the session. We find the session that uses the session token that we created in the initial part. It's been sent to GitHub. It comes back to us. After we have that session,

With that access token, you can get That way, the cookie with the access token is never stored or Accessed or available on the client side, and that way we can validate that access token with a session. That session be can be connected to a specific user on the site, And that user is effectively logged in. Sounds simple.

server side to prevent access to things,

and then with the state query parameter as the session token. The reason why we do that is to prevent any sort of attacks here because we're sending a session token to GitHub to say, hey. This is the specific session we're trying to validate right now.

all of the user's information

really easily, aspect of this, but

from the server side

that they're able to or that we ask for from GitHub, such as their username, their photo, those types of things. So the way that the thing works is when we redirect GitHub, that's where you get the the user interface that allows you click accept. You click to accept. That sends back to the callback. In that callback, we use the code coming from GitHub to get the access token. We then use that access token to get all of the user information from GitHub that we need, Their username, blah blah blah. And then from there, we find or create the user. The user exists.

Ex explanation on how to do it for yourself, by all means, go ahead. You don't need to bring in an auth package all the time. Here's here's how we do it. So the very first thing we do is send a post request to our own endpoint.

as well as a code, an access code.

therefore, we're able to pass that user information along to

Public ID being involved in this session. And then from there, we set the cookie

That endpoint

It well, we we have I'm just joking. We we did an entire Episode on that. If you go back to episode 5,599,

when we have that access token,

GitHub then

OAuth APIs explained. But, yeah, there's quite a big dance of going back and forth and creating tokens. And Alright. I have my token. Here's the other one. Yeah. It's it's pretty wild. And if if you wanna get, like, a nonrambly version of this thing, I I actually wrote in the code but then time stamps for every single word or utterance. This is really cool because the transcript will give us PhD or something like that. So like I was like, I don't really feel like using a Thomet's PhD project as that's a no go for us because we need to be able to say is that You can deploy it serverless, People drinking beer in the woods, like, they would just sneak away. So it wasn't as

or None of those things are available to us because that just does not work with, So you have to create another model for whatever you're going to be doing. So I had to create a roles model and then make a seeding

That access token is what actually allows us to be authenticated.

let me tell you.

it's a joy. I love working in SvelteKit. Me too. I've very much enjoyed It It'll automatically populate the UI that allows you to have a button to select the theme, and it will automatically bring in that CSS.

but I'm almost at a point now where it makes sense to bring it in. Yeah. And and the data is in here in a way that it's Ready to be brought in.

And it's

So let's get into some of the stuff that's done, that's been worked on, that's, interesting here. So one thing that we've been doing Is I I wrote the auth for this already, and we went with just OAuth via GitHub being your developers. Right? This is a developer first thing. So I felt like instead of building out a whole auth system with emails and all this stuff, it's like, let's just move the auth to GitHub. Let's keep it that way. Let's do it OAuth. And instead of bringing any sort of auth package, which many of the auth packages that I found to just be really heavy handed,

But we're gonna deploy it Probably on Vercel. I I think that's the, the current status of it, which we can then run serverless with our database and everything like that. So a SvelteKit site, what was it? Let me find it. Peter picked a pickle pepper. Like, who it was, like, some

Building a basic OAuth setup for GitHub Lockin is really not that tough. And if you wanna use our code for, you know, currently.

some bit of flooding,

Like, in their pajamas, but adds in his underwear, and the neighbor comes over at, like, 3 AM and starts helping bail out.

All of the content that is in both the older episodes as well as anything new that comes.

part of the website, which is Getting all the bits and pieces in place. And then I've been sort of researching a lot of the And that's that's really not what Syntax is, the podcast. Right? So I'm not moving away from Otter dotai.

organizational 3 minutes of being able to sign up and and have a demo. Their onboarding experience was fantastic.

We're not at the transcript, so we might do that. I don't know how to do that and keep the word markings, but well as And then pass it only an S3 URL, right? Like it's saying, oh, I only am doing S3, which makes sense because which is it doesn't detect

We have a hilarious story of which uses Whisper as

Big old, Some people will just play basketball the whole time.

as well as, like,

Anything like it in the entire time I've been living here, but, kind of beta tool in Drizzle right now, maybe further than that by the time you hear this, but probably not.

a lot of the automation stuff, a lot of the AI show notes being being able to figure out how do we efficiently surface add Otter dotai to your Zoom meetings, and we will listen and transcribe and

what stack for the syntax website, are you actively saying, okay. I'm doing this to MySQL wait? Like, you're saying, oh, I'm building tables. Doesn't Prisma take care of that for you? You have to tell Prisma that it is a MySQL database.

nasty wet spot in the ceiling that we're gonna have to take care of. Already got the roof people on the line, but, man, it's been just nonstop rain. We've never seen just a roof is from the nineties, and we knew it needed to be replaced. And we were just holding out for, like, a hailstorm

Our work here and there, Scott's been taking on

Oh, no. Yeah. No. Oh,

So we were on duty. Everybody was kind of helping together. There's no no major floods or anything, but, yeah, definitely concern.

and didn't get that hailstorm, ended up getting several days full of rain. Next thing you know, we have a leak in the roof and in the ceiling.

Just how you tackle building a website like this because there's a lot of moving parts we're going to talk about.

rains here in Colorado the past few days, and, like, Man, it's been kinda iffy. We we had our our

more of the I think that this is going to be

Oh, hey. I'm doing I'm doing pretty decent. You know, we had, like, record setting

CSS stage just yet, but we're more at the, like, infrastructure lower level types of things. And we're going to discuss Okay. This voice is Scott, and this voice is Wes, and it it does a really good job at at doing that. However, But then it starts replacing words that aren't Dino My name is Wes Bos. I'm a developer from Canada with me as always, mister Scott Talinski. How are you doing today, Scott? Hey.

foundational

like nice

our house leaking when I was a kid, and my, like, parents were out there,

Yeah. We didn't get that far. Let's get on into it. The new syntax website, to Tack those 2 pieces of audio onto the end, Run a method and pass all my stuff and have the whole thing typed And that worked pretty good, but I couldn't find in order to surface topics and bullet points and

bright websites everywhere.

Really opened my eyes to

using light mode for things. I've changed my light dark mode over to system so that it auto toggles night. And And I gotta say there's something really refreshing about having big,

an aspect of this site

I was building in, like, the system toggle so that it, You know, by default, we'll give you light or dark mode based on your system settings.

And

has, like,

Hey, everybody. Welcome to Syntax, the podcast with the tastiest web development treats out there today.

You're listening to Syntax, the podcast with the tastiest web development treats out there. Strap yourself in and get ready. Here is Scott Silinski and Wes Bosch.

Scott and I are going to be going through sort of work in progress on the new syntax website, some pretty fun stuff, our thing. I rather like a like a proper package. An established yeah. Yeah. You're you're building on shaky ground or Exactly. Yeah. Like this is it's it's more research than it is an actual product. So