Skip to main content
View on YouTube to comment and like!

about 1 year ago Syntax Podcast

Fullstack Cloudflare with React and Vite (Redwood SDK)

Wes Bos

Wes Bos Host

Scott Tolinski

Scott Tolinski Host

Topic 0 08:42

Manual routing provides control but may require more typing

Guest 1

a Vercel, for instance.

Guest 1

but it will often lead you down a a rabbit hole. It'll be like, alright. You need a database. Here's NEON or here's PlanetScale or here's this other thing. And Yeah. Perhaps you don't know enough in order to make those decisions. So

Wes Bos

A little bit more setup?

Guest 1

to create, like, a you don't have to install that service locally. You don't have to figure out how the API works. You don't have to create an account. You don't have to create a give them your credit card. You don't have to figure out how to ship it in production.

Guest 1

Redwood SDK is probably gonna resonate with you. I, however, I think it just makes software development easier and better if the platform is right alongside the framework.

Guest 1

with Cloudflare, you just get that all you just get everything. Just use the Cloudflare solution. You don't have And that's if you're someone that resonates with that idea, you wanna build stuff, you wanna ship your ideas as quickly as possible and not have to worry about the infrastructure that's hosted on,

Guest 1

It feels really soon. I'm thinking, like, two weeks' time.

Guest 1

external services, using that method. It's so good.

Wes Bos

agnostic? HTTP things that are are not totally implemented. But as packages move towards more standards, Vercel made it

Wes Bos

why can't you make this just like Node. Js or or server JavaScript

Guest 1

We've also enabled that, via React Vercel components. So you can take like, say, for instance, you're chatting to AI. You could send off a request to an LLM. It can return a response, which is chunked by default. It's thinking. It's thinking. It's giving you Yeah. Bits of information over time. You can take that and just return it straight down the wire,

Wes Bos

It's really bad. Honestly, it's it's one of the reasons why I I I love Node so much or or or server JavaScript so much So it's nice to be able to to have the the full control over that.

Guest 1

a beautiful space and time in software development.

Guest 1

provider.

Guest 1

Yeah. Totally. I mean, we're not giving you sort of, like, return a redirect function, or we're saying, hey. Return new response with a redirect let people know because the GraphQL or the Redwood JS or the original framework, it was becoming a little bit quiet. So we let people know that we were working on something new.

Wes Bos

is that, like, Node used to have its own or it still has its own streaming, but then they implemented like, register just like the old express days, you can register in,

Guest 1

Yeah. And if you can make those easier, if you can facilitate that in a simple way, it just makes everything easier. So I think we've done that by just standardizing and request response.

Guest 1

Having been a web developer for the past twenty years, I feel like this is the golden age. We are hitting

Guest 1

web development is actually just trying to share memory from one computer to another in a safe way.

Guest 1

You just stream it directly from you you take a file a form data, attach a file to it, push it up to the web server. The web server catches the request and streams it directly into r two. Like, it's like three lines of code. I don't know if you've ever had to deal with chunks in a multipart form data thing. Sucks. Yeah.

Guest 1

because

Wes Bos

on Cloudflare? Like,

Guest 1

It's terrible.

Guest 1

request and response is that if you're interacting with third party services

Guest 1

directly back down to the browser.

Guest 1

software is And that's partly why we built Redwood, and really good tooling that is easy to follow and LLM can reason about, that follows web standards.

Guest 1

It's a hosting

Guest 1

And that feels so intuitive. It's just like, okay. There's nothing crazy going on here. It's the network. I'm dealing with the network and the browser APIs.

Guest 1

as where this isn't gonna work. But we haven't hit any issues where it has been a problem. There's little things that pop up every now and then. Like, really difficult to compete in right now. So So and that the document just Node describe how navigation works.

Wes Bos

regular streaming. And just being able to use the same They've sort of been on returning a response. So, I've talked a lot on the show about the,

Guest 1

and not having to worry about the infrastructure. To me, you're not building a product when you're dealing with that stuff.

Guest 1

I'm just sort of facilitating it in between.

Guest 1

It's world class. I I'm unashamedly

Guest 1

rather as AWS

Wes Bos

And people are probably saying right now, like, well, Cloudflare is a service, similar similar to Neon.

Topic 1 18:15

Can add client-side router but it's bare bones to start

Wes Bos

But you're saying that this

Guest 1

And once it matches a root handler, and then we'll call a request handler. But we have this concept that we call interrupters.

Guest 1

the l l l l m. So it ends up being cheaper. It understands what to do in a little bit it'll be a little bit faster. What What we wanna do is provide the React component.

Wes Bos

thirty seconds is gonna be amazing.

Guest 1

If you don't do that part, it will proceed to the next handler, and then it will show you the page. So you can kind of, like, take these functions. You can share them with your code base. You're like, this is how I check if people are logged in. It's a single function.

Guest 1

We kind of saw, I obviously wanted to spread like wildfire, and I think it has some great ideas.

Wes Bos

else that is that cheap and easy to deploy somewhere else. And it's it's not a problem of the software. It's it's a literally infrastructure

Guest 1

I use software to impress my friends. And I could do that because it was easy enough for me to understand, and I had,

Wes Bos

16 by 16 matrix, something like that. I need to finish it as well, but I was just looking for Right?

Guest 1

we just couldn't make Redwood GraphQL,

Guest 1

And Yeah. They didn't. They just didn't. And they had some

Wes Bos

the actual compute. You're not while you're waiting on IO, you're waiting for a fetch Wes. You're not paying for that. Right? I queried some data

Guest 1

really good tools to AI agents I know that there's people on the team that are gonna be like, Node, dude.

Wes Bos

React Vercel component data, but it's also

Guest 1

So that's a a not an explicit behavior, but it's one that you can opt into. So, like, React Vercel components, if they update state, the server is the state. All the clients that are connected to that server receive the updates for free.

Wes Bos

So I haven't Yeah. Roll up, whatever the new one is.

Guest 1

and and then you'd allow them to proceed to the page. So with an interrupter, and I would actually go fetch the pages from RSC. So I'd I'd have a RSC endpoint that I could hit. It returned

Wes Bos

Exactly. Oh, man. That's so if I were to if I were to have, like, a, like, a server component where I you you import them directly like you like you normally would. Right? Was was that a intentional decision?

Guest 1

Oh, man. It feels really nice. It kinda, like, the mentally, it makes sense. You're like, oh, yeah. Of course. Because that's how React actually works in the background. When you push up a server action, you get the full payload back, and then it diffs it. So we're just doing that exact same thing for everyone that's connected to the same channel.

Guest 1

define app can take multiple,

Guest 1

Perfect. Thank you. And if you've come across anything that doesn't work for you in the way that you expected or isn't described in a way that makes sense to you, please let us know. I create content around that, and that's what's gonna help me improve the framework for everyone. So Yeah.

Wes Bos

to use, Sanity kit in real time.

Guest 1

And you can do that for So we've renamed Redwood JS to Redwood GraphQL,

Guest 1

I'm cognizant of you know, that that was my that was my baby. That's the thing I'm super proud of. It's not every day that a you then just include ESLint side hydration, and then you have interactivity, on, we've kinda said that it's production ready. We have a whole bunch of apps in production.

Wes Bos

they're not running Node. Js. Right? They're running their own thing called called WorkerD. That's their own JavaScript runtime.

Wes Bos

So I'm I'm pretty excited about that. Like, the fact that you will be able to just

Guest 1

there are things I can solve with software really easily. I usually don't do it because it's too painful. But now I could just

Wes Bos

Cloudflare uses what's called, like, wall time. And and this idea is is starting to catch on with with other providers as Wes. But, Totally. So, like, one one problem we have, both my personal website and the Syntax website, is

Wes Bos

they used XML HTTP request.

Wes Bos

hit too many things where I I don't have to to sort of work around Redwood SDK has has, like, proper middleware, meaning that you can

Guest 1

limit. I think it was quite short as well, maybe ten seconds, which is pretty long. But a problem for us as well, because you'd fire up, like, tons of Lambdas.

Guest 1

you have full control over it. But it just facilitates what the browser,

Guest 1

with the with the with the advent of AI, are gonna see a whole bunch of people that previously couldn't build software come back to the come to that skill. And,

Guest 1

Super cool. Yeah.

Wes Bos

my build times went from, like, ten minutes down to

Guest 1

And what I mean by that is that when you render out some some JSX or you when you return a React page, see Cloudflare Yeah. Yeah. I mean, like Yeah. A CloudFlare or a Superbase

Guest 1

with enough terrible object and everything. Yeah.

Guest 1

So but I just ship to production. I just run it directly from production. Actually, our our website, RWSDK.com, and you're returning a response, you can just stream it just feels so good.

Wes Bos

for a response, and especially with all this AI streaming stuff Wes,

Guest 1

metrics and things like that. You just need a itch to scratch and a problem to solve for yourself, your friends, or your Sanity. And it feels like that's the dream of what software was meant to be. It wasn't necessarily Did that make sense? Cloudflare's Worker d, runtime.

Guest 1

Oh, man. Yeah. Please criticize me.

Guest 1

It doesn't feel nice.

Guest 1

limitations or issues you've hit with that? So I I haven't hit that issue myself.

Wes Bos

a fetch adapter, Another thing I noticed about it is that

Guest 1

I think that they're probably one of the teams that can pull it off.

Guest 1

what we're trying to achieve with the framework JS, like, I was born in the eighties, and I grew up in sort of, like, the personal computing like everything is possible. One of my favorite examples is actually uploading files to to r two, which is Cloudflare's on to s three.

Wes Bos

of Node. Js

Wes Bos

under the hood Like an iframe? Warp on.

Wes Bos

in Next. Js, they started with, like, a, like, a global middleware,

Wes Bos

where it's just standard

Guest 1

Every request was a new Lambda if it was occupied, which would be a new connection to the database.

Wes Bos

it's Wes can get around it, but it is it is kinda funky.

Guest 1

like, you can have a different document based on a route. Say for instance, you had a blog a section in your website that was just blogs.

Guest 1

and in Cloudflare.

Guest 1

So you really have the ability to ship, like, Such good tech.

Guest 1

just take Vite plug ins, take the ecosystem as it stands, and control their own destiny. Mhmm. But and will still maintain security patches and and bug fixes for the core of it so that the people who are still using it still have a good experience, but one that they can run and own themselves.

Guest 1

people, the Internet coming out. And there's a there was this sense of wonder and awe at this ability to create software.

Guest 1

We have this thing,

Wes Bos

to he'll give it a good run. He's really good at that. So, yeah, I'll I'll, I'll ping him about it as well. Anything else we haven't touched upon about about this stuff?

Wes Bos

no Wes. Just just throw Sentry on there, and then,

Guest 1

I love Century.

Wes Bos

like, literally Why should somebody choose this where it only runs on Like, limitations

Guest 1

actually plays along quite nicely with, rack server components. So Those are two layers of middlewares. The one is, like, global, and the other one is more per route.

Wes Bos

of Denver, Colorado. We got the folks from Vercel, the folks from Mux, folks from Century. We're all coming out, of course. We're gonna have Scott there. CJ JS gonna be there. I'm gonna be there. It's gonna be a really great time. If you wanna grab some tickets, they're free, but you gotta get tickets. Go to syntax.fm/meetup.

Guest 1

there doesn't necessarily have to be a profit motive. There doesn't have to be a brand. There doesn't have to be,

Guest 1

concept. It's like, we'll integrate with this. We'll integrate with that. We'll give you this auth provider. We had I think we have, like, 18 auth providers.

Guest 1

you then give it to a method called render. So you say, hey. Render this document for these routes.

Guest 1

competing for

Wes Bos

Shouldn't have said that yet.

Wes Bos

meaning that if you use it on CloudFlare, it will realize that there's no XML HTTP what

Guest 1

I need it, and I I want it. But I can see in my communities that

Wes Bos

and there's this thing called on JS. And they try to make, like, 98% Oh, that's that's interesting because

Guest 1

Then you had to go and search for another revolution, you know, Mac and PC,

Wes Bos

like, dropping everything and and coming on here to to talk about this. I'm pretty excited about it, and I'm excited to see what what people build on it. So next app I need to build, I'm certainly gonna use this as my base.

Wes Bos

like, I'm at, like, two minutes right Node. And then now Wow. V is about to get really fast even faster with roll

Guest 1

in my own philosophy, and I ship fixes to it constantly

Wes Bos

like, a big one was, like, Axios, for the longest time, didn't have a and to write the software, and it just it just works. And

Guest 1

support putting it in front of people, getting your idea from start to finish as quickly as possible through the gate, I still somehow can't believe that happened to me, but, I'm really proud of that work there, and I'm really proud to take on the legacy of of what we built and and, you know, try and make it spread in the world. We So we can just take that away. We just send HTML down the wire because we know if you're logged in or not. We handled it in the request. And then you click that button, and all of a Vercel, you get in all the JavaScript that you need. Oh.

Wes Bos

am constantly shocked that

Guest 1

we think that people when people build, you're But you can create those yourself. We just didn't feel that we that's the surface area that we need to provide things for you. You know, what's wonderful about Try them out.

Guest 1

this way to stream And you would feel that, like, when you were trying to integrate Storybook or, you know, like, one package and another, but it got really hard when you try to ship to production.

Wes Bos

Building applications and thinking, like, what if everything was real time? You know? Like, you you you could,

Guest 1

let's figure out and we're trying to give it the same treatment that we're

Guest 1

the flight data, and I just replaced the conference using, like, the inject stuff in in in React.

Guest 1

and you always see it would be like, log in, and then it flips. And it's like, nope. You aren't logged in. Click this button. Yeah.

Guest 1

had Scott ups around about the same time, and Mhmm. I kinda leaned on him a little bit for emotional support. And now I still do for So for us, Like, say, for instance, create a route that has a create a route called ping, and it will just make that for you using,

Wes Bos

on CloudFlare, so you'll they use fetch, which is is good at the end of the day.

Guest 1

TS morph instead of Yeah. So, you know, I actually think a little bit of the vibe of like a meg in size, and they are reducing that. They're they're taking that out, and they're just making it pure typescript. So at the end of the day, things are just gonna get better from that perspective. But we also have a starter where you can just use Drizzle with client side hydration, queue library. And, you know, that fatigue of trying to figure out what works best for the thing you're trying to build

Wes Bos

I'm I'm here to change that. Why do you think that was? Because I

Wes Bos

we have, like, a an open graph image page

Guest 1

And I think that's actually how we got into touch with one another because cold start times.

Guest 1

you're running a serverless, there are some problems with Prisma right now when it comes to migrations. So we've created scripts that work around that,

Guest 1

And a typical use case for that is, like, when you have a marketing site, and the marketing site has, like, this button that's meant to tell you whether you're logged in or not. And then you click that button, then you you have issues. And, you know, like, connection pools were really is Essentially, you would we created, like, a DSL so that they understand what the framework is trying to do. So we're trying to be a really good steward in the age of AI, Redwood SDK.

Guest 1

gets rendered hydrated as HTML. But if it Yep. If it has client side interactivity, then you'll get all that stuff, all the all the rest of the modules with it. No. I was gonna say, where are the downsides? I was gonna say there are none.

Wes Bos

as long as it's my opinions at the moment.

Guest 1

We are constantly fixing, but, you know, we'll hit one point o a React framework for Cloudflare.

Guest 1

not necessarily build an AI interface the request You get r two so you can store your files. You get queues.

Guest 1

on our website called personal software, generative AI by programming LLMs

Wes Bos

Yeah. They're it's it's really it's a great great product for figuring out what went wrong.

Guest 1

all the major packages that were shipped with it so that the users who are still using Redwood GraphQL can I I think that that in that market JS really hard, I see that, a durable object closer to the user and the worker closer to your database.

Guest 1

That's when things started to suck, and your hosting provider just could not help you.

Guest 1

No. It will be the the same app. So issues people have hid and the the pains they've had. Is is there anything around that that you've you've made? So, I mean, we implement pretty stock standard React Vercel components. Like, the default experience is the one that we are providing render methods.

Wes Bos

immediately be real time. Yeah. That's cool.

Guest 1

So is a React SDK website, the really interesting part about building

Guest 1

and,

Wes Bos

are that database needs to to live somewhere. Right? And and they will try to do their best at figuring out where it will will actually live. We did a whole show on on durable objects as well where we,

Guest 1

and then you're getting JavaScript and React and all the stuff with that. And Mhmm. Say, for instance, you wanted real time, like you had a dashboard that was that required something to update consistently or you wanted people to do multiplayer stuff, you switch out the client side hydration with our real time client side hydration.

Wes Bos

of, like, some of these, like, four minute build times go down to twenty seconds.

Guest 1

You can check the session to see if they are logged in. And if they aren't, you just return a response that says, hey. You don't have permission to do this. You've now interrupted the request flow.

Guest 1

just about money. Money's great.

Guest 1

And the week after that, we let them know on the Friday. The week after that was Cloudflare's developer week, Was that, with an ESP 32 or something? Yeah. Yeah. ESP 32 hooked up to, But it is possible.

Guest 1

I'll show you the light.

Guest 1

services.

Wes Bos

And another use case for that is you can, like, break out of layouts.

Wes Bos

It's like that that should say something. But, like, let let's talk about, like like, database as well. So if you're using d one, it's a

Guest 1

I do understand that it is something that can be a problem, and that's why we actually built Redwood SDK within WorkerD. We were like,

Guest 1

you control the ability to initialize the client side stuff, you can add one. Yeah. And, actually, Zeig, please hit me up.

Guest 1

Totally. Yeah. So the entry point for your app is a function called define app.

Guest 1

and build it on top of there. And I think it's rare that people can do that.

Wes Bos

And see how the

Wes Bos

for that page that's that's sent back. Am I you're able to do that?

Wes Bos

How does that work in relation to the,

Guest 1

Yeah. And those multiple render methods can describe different documents,

Wes Bos

Yeah. It was it was weird, but they I think with Axios seven, they rolled out, thing Wes these Yeah. These GoDaddy's and Bluehosts

Guest 1

and they have the things. It's just this little nugget that you attach to the request handler and makes it really easy to read and share that functionality.

Wes Bos

1 more thing real quick. May 29, Denver, Colorado. We're doing a syntax meetup. You gotta be there if you're anywhere within a horse ride

Guest 1

Yeah. Yeah. And that update is coming from the server, the source of truth? for emotional support, but just to cheerlead what we're doing, and he's so great. Yeah. He was like, dude, I need real time React. And I was like, okay. I'm gonna make it happen.

Wes Bos

Yeah.

Guest 1

Yeah. It was, Yeah. Like, Sunil is he works at Cloudflare Node, and he was actually the first person that I showed this to. We both might be a little controversial, Totally. And I see they're they're they're constantly trying to become more and more and more compatible.

Wes Bos

You mean, like, a platform, like like, a infrastructure platform?

Wes Bos

Yep. And they have

Guest 1

it feels that way. It feels like

Guest 1

many multiple apps within the same worker.

Wes Bos

I don't think that Next. Js would be as popular if you had to go and and host it yourself somewhere. You know? It's just not Definitely. It's and and it happened with with WordPress as Wes. JS the reason why people love WordPress is that like, somebody DM me the other night. They're like, I don't wanna use WordPress, but there's literally nothing

Guest 1

Yeah. Yeah. Totally.

Wes Bos

He'll he'll find some stuff,

Guest 1

we didn't actually take your decision fatigue away. We just kinda made it possible.

Wes Bos

you can step in and and stop things and set headers and all that stuff?

Guest 1

I have a early experiment where I took control of the browser's navigation events, and they are addressing it. And Prisma has some

Wes Bos

of Cloudflare how simple and good it actually is. Like, I I had this little LED grid, and I built a little app where you could draw in the browser. And then it immediately was just mirroring it right to the LED grid. And, that's cool. Wow. Yeah. It's it's really nifty.

Wes Bos

sorry. It's not wall time. It's compute time. Yeah. Wall time is is, like, ten seconds. Yeah. You're you're waiting

Guest 1

David Kramer was actually having a look at a whole bunch of JavaScript frameworks.

Guest 1

to Vibe hack or

Guest 1

But I that's my gut feeling JS that we solved so many things in the past three weeks. We rely on the web APIs. So But he hasn't responded yet. So if he listens to the show, You had to put a connection pool in front of it.

Guest 1

So I feel privileged to be able to bring this to people and say, hey. I've learned some things. Here they are.

Guest 1

Yeah. Oh, okay. Entirely possible. It'll either just be, the payload and then, Okay. There was a limitation on how much JavaScript you could actually put inside of them,

Wes Bos

Yeah. No kidding. And, like, where JS it at right now? Like, can somebody go and and start building their their next, Yeah. Yeah. We'll we'll have to see. I've I've built quite a few things with durable objects, and it's amazing I'm gonna need, like, a 10 stack router or or React routers. I'm gonna have to bring that in myself.

Wes Bos

offers you as an API. Okay. So Yeah. If I wanna build like, I'm thinking, like, if I wanna build, like, a full stack app, to deploy

Guest 1

Yep. And what's really nice about that is you when you read the code, when you parse the code,

Wes Bos

Are there any, like,

Guest 1

and where the where everything is linked together in Rails. And you started seeing that in in many JavaScript frameworks.

Wes Bos

make an edit to your website

Wes Bos

maybe even I don't doesn't take it further, but, like, this is the implementation maybe Redwood JS Wes.

Guest 1

but just this ability to solve problems using my skills. Yeah. So I'm excited for the future.

Wes Bos

where we wanna render out not the website, not the header, not the footer, you know, not the whole layout. And in order to, like, break out of the layout, we have to do this weird, like, folder based structure with, like, parentheses on it and whatnot

Guest 1

There isn't, but you can add one. Since you control the

Wes Bos

I forget what it Wes, but, basically, they didn't have, like, a fetch implementation where your database and your code are not in the same spot or if you have to do connection pooling and all that, those fun things that come along with.

Guest 1

I it's usually mounted in, like, a document, an HTML document that has, like, a head, a title, generate a lot of my code, and I can host it super easily. It's not gonna cost me any money. There's power in that. There's power in that, like,

Wes Bos

Wes

Wes Bos

I I've been playing with, like, Sanity Kit quite a bit as well, which is, like, a real time thing built on top of durable objects.

Guest 1

and you can modify the context or return a response in there.

Wes Bos

function in the cloud. What were what were those those limitations? deployed great great twos to server components, and that is also based on Vite because I'm I'm pretty big on Vite as well. But there's not aside from Wacko, there's not a whole lot of, like, Vite and React Vercel components out there.

Guest 1

And based off using their platform and I'm I'm gonna sound like an absolute fanboy here. Based off using their platform and seeing how solid their engineering is,

Guest 1

and we just got pulled into that, and things started rolling. So from then That was a

Wes Bos

shims and polyfills, compatible because at the end of the day, you sometimes just wanna grab a Node package and and use it.

Wes Bos

I think it's roll up. Anyways, whatever the new one is. So maybe it will even get faster. I've been Evan, you've been tweeting out all the stats rust based

Guest 1

we might provide one that gives you that SPA feeling. Yeah. But it will be very bare bones, kinda take the same principles that we currently have that,

Wes Bos

Will do. Alright. Thanks again for all your time. Appreciate it, and, I'll let you go to bed now.

Wes Bos

Well, you know what I do? I'll do a little, a little ad read for Sentry here right now JS,

Guest 1

when you're pushing up, like, a massive JavaScript file to the server So If I perform a server action that updates the UI We broadcast the whole thing. That's cool. That's has become the answer to those things. I mean, like you said, they don't like to call it serverless, but

Wes Bos

then it would be and then somebody else were to update that data, then it would just and then they moved it to, like, a, like, a per route middleware.

Guest 1

really, really big restrictions

Wes Bos

live? has really benefited from it.

Wes Bos

whether you like middleware or not, I'm a I'm a huge fan of it. And my applications, I'm coming I grew up on Express. You know? I have lots of of middleware.

Guest 1

There would be no JavaScript going over the wire. And then if you had, like, an app side to your website, but they're they are logically separated.

Guest 1

Totally. And, you know, I think we were the surface area of the framework itself is really not that many lines of code. There JS a lot of heavy lifting happening in the browser

Wes Bos

and I put that data in my

Wes Bos

bundler,

Guest 1

doing to Redwood SDK, which is to say that we're unbundling

Guest 1

instantiated.

Wes Bos

like, what what's been happening with React Vercel components over the last, what, like, three years or so

Guest 1

And it will scale. I mean, they say it scales infinitely, happen Redwood Wes happen. It just didn't it didn't find a solid footing in the market, by, something called the durable object.

Guest 1

like feels like I'm FTPing a PHP file onto a server. It's so good. Yeah. It's it's really quick. Like, I moved my when I moved to Waco, and me and you are on the same page or key, you will get that update automatically.

Wes Bos

And I I was never happy with with either of those. And then the the middleware also had a bunch of limitations as to what you could do with it. And

Guest 1

Throw an n v error in the front of it, it releases to staging. It's like it's

Wes Bos

Beautiful. Well, thank you so much for,

Wes Bos

Yeah. Which

Guest 1

was shamelessly plug in regular SDK

Wes Bos

client side router. Is that true? I don't know, you're waiting five seconds for a response to come back,

Wes Bos

whatnot. So, if you do wanna check out Sentry, it works on Cloud for great. Go to Sentry.i0/syntax.

Guest 1

So a good example is, that you can then use to interrupt the flow of the of the request. So a good example is, say, for instance, you wanted to do authentication.

Wes Bos

Yeah. Yeah. That's true. I I wanna touch upon, like, Node compat really quickly.

Guest 1

And then it gets handed off to the root handlers.

Wes Bos

nothing that is trying to be the Laravel or the Ruby on Rails of JavaScript has has caught on. And I I often Node, we're like, yeah. I wanna I want something that's opinionated

Guest 1

like, really cheap hosts, and I could just FTP it up and things like that. I think that we,

Wes Bos

how

Guest 1

a body, like a div, things like that, you know, the structure of your page. Redwood SDK gives you Sanity to define that as just another component, I have pulled it off. Yeah. I'm I'm actually in awe of CloudFlare. I'm I'm really impressed by the fact that an LLM or or or an AI agent will assist you in the decisions you need to make, whilst you're building software, Node. Yeah.

Guest 1

software using Vibe tools or generative AI,

Wes Bos

what errors are piling up, and I'll go fix those and, and

Guest 1

Netlify. They released these Lambdas that were based on AWS's infrastructure, edge network all over the world. You get a d one database.

Wes Bos

Like are are getting better.

Guest 1

so put it to the test.

Guest 1

in his in his in his timeline. And I was like, that thing that you just complained about, we fixed it.

Wes Bos

I guess, the Define app? You have, like, the server router where you can you set all of your middlewares and whatnot. Node now is there two separate things? Totally. And, quite honestly, that's that's why Next. Js is is so popular. Right? Like, Middleware. Let's let's talk about that. So, like, SDK. You're they've done a little pivot into something called Redwood SDK. And I'm I'm so excited about this that it's

Guest 1

I think a framework requires a platform. I know that objects. Then Cloudflare is the platform, so what you get from them is a

Guest 1

to sort of feed it, I guess, best practices and and whatnot. Or maybe this is just the the prompt. What is this? No. No. Yeah. It is. And we're actually building a MCP server as well that if you Oh, awesome. Ask an agent some stuff, it will understand how to do that in Redoute SDK. It'll exit the alignment as quickly as possible and just do it programmatically.

Guest 1

and we were excited about that. And we had this idea that those things would just continue improving over time.

Guest 1

And,

Wes Bos

Node. And and you'd still be able to set up, like let's say I'm moving from my blog to my about page. What I would hope would be that,

Wes Bos

down.

Guest 1

I think we could have been more opinionated. I think And, I mean, I I do that. I I know we shouldn't. I'm I know that I should go through CI and should have tests and things like that. I know that process.

Wes Bos

and

Guest 1

despite the fact that we have, like, this, any route can take an array of request handlers.

Guest 1

Essentially, that isn't performing as well as you should I think it should, or you have a slow connection to your database,

Wes Bos

No. So talking about Redding, though, one thing that I noticed that there's no

Wes Bos

Yeah. Yeah. Totally. Plus, like, you've been able to sort of sit and watch,

Guest 1

And at the top of that file, you can define as many pieces of middleware as you want. And the middleware is just a piece a function that gets the request and the context,

Wes Bos

have have made it so easy to deploy these things, and and the software a client component, I would assume,

Guest 1

And Cloudflare, I think,

Guest 1

I think the really hard part about building software is not actually writing Node. It's gluing together

Guest 1

a little bit too early with, Redwood. Js.

Guest 1

a boy from South Africa gets to build a framework with Tom Preston Warner.

Topic 2 02:03

Cloudflare has fast global edge network and affordable pricing

Wes Bos

So I was I was very excited about this when I saw it because

Wes Bos

on fire recently.

Wes Bos

the CloudFlare ESLint all of their products.

Guest 1

And, you know, Cloudflare JS a networking company, so they really, really know what they're doing when it comes to making things fast. So Yeah.

Guest 1

There are very few

Guest 1

providers out there or hosting platforms out there that have have servers in South Africa, and, Cloudflare has them everywhere. I think they have something like 230

Guest 1

$5 a month. When we were coming up with the idea of what for what Redwood SDK was, I'm from South Africa, so I live in a in a rural community in South Africa. There are 2,000 people where I live. And for me, it was really important that I could build Well, it's been out for about a month. We've been working on it for five months. Okay. But we publicly So the initial response will include the fact that you are logged in and set the cookies and all that other stuff, and then Bos subsequent requests will still go through the middleware, probably hit, like, a API route. It'll just work. I should I should Okay. Create an example because I I it's kind of vague in my in my words because it's vague in my head.

Topic 3 03:00

Cloudflare has great realtime capabilities with durable objects

Guest 1

And, I think we're the right product at the right time.

Wes Bos

like like, an Wes, I I dare I say, an SDK that works with the tech that you want. Meaning that it's not like So

Guest 1

a 400 lines of code when we replaced it. So the ecosystem is catching up to React and React Vercel components, that we didn't fully appreciate at the time warp didn't accept that they would stay that way.

Guest 1

So

Wes Bos

like, like, workers is really cool. The durable objects is really cool. Their queues is really neat.

Wes Bos

which maybe using, like, what, like Prisma or Drizzle or something like that. What's the database look like in and that I I go on to the dashboard and see

Wes Bos

which

Guest 1

specifically in beats in Beatland.

Wes Bos

I went to to move my own personal website, which is a React based website to Wow. CloudFlare.

Guest 1

we try to make sure that everything that we are giving you is CloudFront native, software that was good for people in my Sanity, and I mean good in terms of latency.

Wes Bos

So the fact that

Wes Bos

compared to lots of other options.

Guest 1

React Server components. It used to be a Webpack only thing, and we kind of, like,

Wes Bos

And then, of course, like you said, it's it's relatively affordable,

Wes Bos

And I first moved it to Next. Js with server components, and I tried to use OpenNext. Js. And it worked pretty good, but we're we're not it wasn't totally there at the time. So then I moved it to to Wacko,

Wes Bos

it's this is not like a framework built on top of these technologies,

Guest 1

Totally. And, you know, the thing is we

Guest 1

React

Guest 1

we first validated that Cloudflare was a was a good platform for us to target, and then we built the framework from scratch within Typically, you'd have a function that checks if a user is logged in or they have certain privileges,

Wes Bos

Releasing And on that, the

Guest 1

Vercel DOM Vite plug in, which is the thing that enables, you can create this function, is authenticated.

Wes Bos

But this is more of,

Topic 4 13:37

Peter is unashamedly in love with Cloudflare

Wes Bos

Yeah. Yeah. Honestly, people give me heck sometimes. They think I'm, like like, taking money from them or something like that. But, like, no. I'm I'm just an I'm enthusiastic You are simply

Guest 1

in love with Cloudflare.

Guest 1

So a durable object Elon Musk's SpaceX, Like, I mean, this is the wonderful thing about them being a network company. I always say that Cloudflare JS a network company first. They can do that. Like, who can do that? Very few people.

Guest 1

d one,

Wes Bos

like, serverless I'm using air quotes here. They don't like when you use that word, but

Guest 1

or any of the RMs that are your decision, or you can just directly connect to

Guest 1

I actually I don't think anyone really knows what a durable object is, but I'm gonna describe it as best as I understand it. A durable object is basically another compute instance that lives alongside your existing compute instance,

Wes Bos

they don't go away. Because that's that's always one of the the downsides to like, there's an React Vercel component payload

Guest 1

So we give you a standard starter. And for that standard starter, we give you Prisma. So we decided that that was probably the best DX that we could that that worked for us. But you're connecting through Prisma to d one, and you're just running standard migrations. Although, so to speak. Yep. But with the plugability of Vite. And Vite has just released or they're busy releasing the,

Guest 1

Wes you can place into an RC component and update Certainly, there is lock in there, and we have to own that. Cloudflare gives you a lot of things that a lot of other hosting providers can't, specifically durable objects and the tight integrations with all their with all their services.

Wes Bos

because CloudFlare is, extremely easy Redwood SDK. So we had Tom Preston Warner on, I don't know, maybe a year, year and a half ago, talk about Redwood JS.

Guest 1

Yeah. And I mean and then in that case, if you're just connecting to Postgres or MySQL at an external service, then Cloudflare can also help you make that super fast. They have these

Wes Bos

from everybody and except for Cloudflare. I pay my own way on Cloudflare.

Guest 1

The result is that it reduces latency overall, and they will figure that out automatically.

Wes Bos

Yeah. So if you're interacting with that, you're not using, like, the Cloudflare

Wes Bos

that can maintain state, streams and request response on the client and on the server

Wes Bos

as you wish. But you don't have to use d one. Raw SQL queries. Yeah. You don't you don't even have to use that. Right? You could connect anything.

Guest 1

So in case of Cloud Fair, they have this thing called smart placement You Node, the the thing is we had two stars from scratch to do this. We couldn't take what we had chunk responses from a server action. That's one thing that we brought to the table.

Wes Bos

kind of or built on top of SQLite.

Wes Bos

a relational

Wes Bos

Redwood SDK?

Wes Bos

we distilled it down to, like, durable objects are essentially database

Guest 1

issues with their large binary. They have this Wes that's almost, There are, like, these taxes that you pay when you use

Wes Bos

using serverless Redwood starter comes with some, like, cursor rules, which is I thought was really interesting as well them. It's it's become much less of an issue as packages get better and as the the shims

Wes Bos

it will

Wes Bos

Yes. I'm I'm a big fan of, of durable objects as well. And I Node there's several people working on, like like, a open source version of it, just kinda cloning the the API. So that's if anyone's worried about, like, lock in with that type of thing, I I don't think that would be too big of a issue. That's cool.

Wes Bos

JavaScript classes So what happens to

Wes Bos

what that does, it it

Wes Bos

Yeah. Yeah. Absolutely. They Okay. Figure out where to put it. Because, like, a durable object is backed by d one,

Wes Bos

user. You know? They don't they don't even I get free hosting accounts

Guest 1

I don't know what the I don't know what that product is called, but they have, like, a proxy or something that Yeah. It's called a hyper hyperdrive, I think. Let me check that. Cloudflare hyper hyperdrive. Yeah. And makes building software worse. And I think, you know, Redwood was built upon that We had these things I think they need a really good cloud or really good good platform to host on, You could remove the client side hydration from that document, and you would just serve HTML.

Wes Bos

when versus, like, a long running thing is that you don't have memory. You don't have have places to keep stuff in between requests because they they spin down.

Topic 5 00:00

Transcript

Guest 1

But, than I see it as most of the time, it just works. It's one command, it releases to production.

Wes Bos

And, You're paying for that. Whereas compute time, you're you're only actually paying for, like, the this gives us that was was pretty exciting.

Wes Bos

Yeah. So I I just spent the last probably hour and a half going through it. So, like, I've got I've got a million Wes, and my headspace is in it. So the idea you're not burying all access to all of these packages that we know and love, like like Prisma or any other ORM stuff or any of the Cloudflare stuff.

Wes Bos

middle of the night for for Peter, and I just DM'd him. I was like, you wanna record right now? And he said, yes. Let's do it. So I'm pretty excited about it. Welcome, Peter. Thanks so much for coming on. It's a super pleasure to be here. I'm also really excited by by you picking up with SDK.

Wes Bos

guest on to talk about

Guest 1

I want people to pick them up. You know? Let's chat about them. Figure out what's better.

Wes Bos

Welcome to Syntax. Today, we have a really interesting

Topic 6 00:53

Redwood SDK is a React framework for building apps on Cloudflare

Guest 1

Redwood SDK

Guest 1

that then gives you server side rendering, React server components and you don't need to do any of that. You just focus on the software you wanna write rather than the infrastructure that it runs on.

Guest 1

serve images to the right devices at the right resolutions,

Guest 1

or edge networks.

Guest 1

Yeah. Yeah. So,

Wes Bos

with with Redwood SDK is that it's an example of to there there's several

Guest 1

and, then also real time capabilities

Guest 1

You get really, really great, abilities to

Wes Bos

what what? A framework for building React apps on CloudFlare? Is that is that give us the pitch of what it is.

Guest 1

and you basically get that for $0 a month there isn't much traceability in Rails. It's also just like everything somehow works. Some other imports, I don't know how exactly they put things together, but it's incredibly difficult for a newcomer to understand

Guest 1

super fast you can see what's happening. You don't have to, like, dig into each request handler and say, okay. We're actually checking if they're authorized Yeah.

Wes Bos

a there's there's a couple things that I'm, like, bullish on right Node. And and one of them being

Guest 1

that are provided by Cloudflare's durable object

Guest 1

It starts off as a Vite

Guest 1

plug in, shimmed a whole bunch of stuff to make it work. And now it was we we, like, deleted

Topic 7 05:30

Redwood SDK provides visibility into imports instead of hiding magic

Wes Bos

to return, like, JSX components, which may be be pages.

Wes Bos

or being able to

Wes Bos

when you want to declare a new route, you simply just go to your worker dot TSX file, have a fat pipe to your actual where your database is. Because that's that's a big source of latency for a lot of people, we learned a lot there. It's just that and for anyone listening, and it to be live Yeah.

Guest 1

it made support much harder for us because people wanted the optionality, And a long, long time ago, I was a fan of saying this. Most, or something along those lines.

Wes Bos

like, the standardization is is such a a beautiful way to live. I'm a big fan of that.

Guest 1

where they have these iterations of the different kinds of rockets that they're building. Oh, yeah. Yeah.

Wes Bos

It feels so good to be able to just see where everything is. For example, anyone listening, the old Redwood or, like, what red what we used to know as Redwood JS? personal software or startup on this thing? Or, like, it just released it a couple days ago.

Guest 1

for interacting with our framework. You export a special thing named this special name, and it would do something special within our framework.

Guest 1

for me, I wanted to get down to sort of the bare bones of what makes sense from a request from a request slash response model

Wes Bos

of the web and and very two of the big ones are the request and the response. Right? That's what fetch is built upon, and and so much of the so much of the modern web is is built on the request and response. So being able to simply just return a response object

Wes Bos

a regular route that is simply

Guest 1

of, and there was execution run time, That actually Node me think of something that we do. So we follow the request response model. So if you're if you wanna log in a user, you create cookies, and that that user data is stored in something we call a session. That session is backed up in Redwood SDK say, for instance, me and you go to a page, and there's a server action on this page, and we have we have the real time functionality If I think about it So talking about full control, I like to say that we give you control over every byte that passes over the wire.

Wes Bos

and you can,

Guest 1

that were magic exports.

Guest 1

I think it's because people Yarn trying to emulate Rails.

Guest 1

JS well as what made sense from from a type TypeScript position. I didn't wanna generate types. I wanted there to be no magic. And I've been thinking about this quite deeply, about why we ended up having frameworks that look the way they look right Node, and I'm talking about Redwood JS.

Guest 1

is the ability to follow where an import is coming from and where it's being used. So I didn't wanna hide that from you. I wanted to make sure you could trace it. And I think the result is Like, our real time Yeah. Header.

Wes Bos

Mhmm.

Guest 1

Yes. Rails like, Ruby is a language that gives you the ability to define DSLs, like, off the bat. So

Wes Bos

So having, like, explicit access to that seems really nice. I I think it's probably a bit more typing. Is would that be fair to say?

Guest 1

So I wanted to take that away. One of the things I appreciate about JavaScript incredibly conscious decision. I don't know if you've seen this image And, actually, you know, Redwood SDK is a response to

Guest 1

So I was the cocreator of Redwood JS, and now I'm creating Redwood SDK. I don't think that there are many people that have the ability to actually or have had the opportunity to build a framework from scratch twice, and this is my second iteration. So I've learned a lot of lessons from building the first framework, trying to use it in my own startup, and then now approaching it for the second framework. One of the things that I really wanted to make sure that we did was that we didn't hide anything away from you. The moment we did that as a framework,

Guest 1

but it also made it super hard to understand.

Share

Empowering developers for over 286196712928 milliseconds!