Speaker is going to show Jim the new browser without installing it and send them some traveling music.

Speaker deployed a new feature to a project that they want to test out in Brazil. They had to make some changes to it. Speaker is going to have other people check it out in Brazil and see if it works for them. They will post a link to the article about the radio show and a blog post next to the recorded video.

Speaker uses WordPress to build in browser WordPress experiences with WordPress playground and webassembly. They stopped using Wordpress because they found a plug-in that allowed them to use the WordPress installation as a headless CMS. They want to use all Google products on their website. Speaker explains how the nodejs project works. They have created a website with the entire WordPress Tech stack including PHP and a database running in the browser.

Speaker is preparing WordPress on their Chromebook. It's slowing down their computer. They haven't touched WordPress in a minute. Speaker explains how to use web assembly PHP even without WordPress. They are going to tell Jim that there is one assembly PHP SQL translator in an in browser server on their Chromebook. Speaker explains how a link to a blog can be accessed via the browser. They explain to them how WordPress works.

Speaker found out from Wikipedia that since WordPress can now run on webassembly, they can also run node. Js directly in the browser.

Speaker is amazed. They are going to show gymnast how to set up interactive and collaborative WordPress apps. Speaker is going to tell Jim about the cool stuff going to PHP. They are going to show their website to the gym and see if their mind explodes like-minded.

There is a new way to structure pages in the browser. It reminds Speaker of the old way of editing web pages. Speaker's computer is not liking this. Speaker is going to close the website. Their browser doesn't like what they were doing there. Adam is the lead developer on WordPress playground. Thomas is the product manager V8. Speaker is afraid to open the post.

Speaker has created a website that runs entirely in a browser. There is no Cloud infrastructure and support to pay for because the site lives entirely in their browser. They can create a plug-in and try it out without setting up a whole WordPress instance. Speaker explains to Speaker how the WordPress playground works. They explain how to embed WordPress playground in an iframe. Speaker's things are back up. Speaker is impressed.

Speaker explains to Speaker how to get started with the iframe, the playground JavaScript client, the Library npm package and the interactive tutorial.

• chat room
• content management system
• blog posts
• google products
• firebases stuffs
• node js
• web containers
• angular project
• full wordpress
• cloud infrastructure
• pendant theme
• web assembly php
• wordpress plug playground
• service worker
• stack lives
• hosting services

Welcome back your dreams were, you're welcome back.

Same old place that you like, but those dreams have repaid, and they turned around What's going on, y'all?

Welcome back.

All right, give it a stretch.

Oh yeah.

Oh yeah.

Okay.

All right.

So I went to bed at last work session.

I actually deployed that like that's new feature that I added to a project that I want to test out in Brazil.

And, so I made a couple of changes I had to like, rethink the whole feature because the way I kind of built it.

It was meant for like a certain thing or way of doing it with new feature, kind of add something on top of it.

So I had to rethink it, and so I got it to work and I deployed I made a branch and that's why I made my changes right.

Kind of want to do it right back to the main one, because if I mess up something, then I am out of luck.

So then I added an added, the branch, and then I deployed it.

And, so I got deployed and everything look like it works.

So I am gonna have some other people check it out and hopefully it works for them and then I will be able to try it out in Brazil and see cuz may turn into something else something, so I don't know.

We will see.

But yeah so is it's worked before and but now the way we want to do it I need the extra feature to kind of like be like oh kind of cool things.

So yeah, all right, neither here nor there.

All right.

Let us talk about this other thing that I just found out, and it's kind of cool.

So, every once in a while, either check out this website.

I spoken about them a lot on the show before.

Let me see.

Sure my screen.

I do not think I already promised her the audio just in case I thought this was a pretty cool because it's amazing what the like the web and like browsers are capable of.

I guess I am just blown away every time about it, right?

So over on web dev which is a place I frequent, you know, like kind of wants see like what's happening?

I saw that there's this article I am going to post a link to it in the chat room, I think about the radio show and if there's going to be a link to this blog post next to the recorded video.

Alright so Right here, build in browser WordPress experiences with WordPress playground and webassembly.

Okay, so when I first kind of got into web development like one of the things I use was WordPress right because it's just like it's an amazing way of being able to kind of just get like a Content management system up and running and give them have like templates around it and have like plugins and all these other things, right?

And so this is before I really start to dive deep into JavaScript And even my radio shows website.

Like one of the earlier incarnations was is a WordPress site and I just had liked I kind of created a template on top of it and as I started getting more and more into JavaScript because like I didn't know, a lot of (pH) like the PHP stuff was still kind of blowing my mind and with all the different plugins and stuff to do things like I was relying on other people to do things.

And so and then if they didn't keep it updated, it seemed like almost like and it's like the Wild West days and like you have always updated stuff and then people are like hacking sites and all these things and stuff, I didn't wanna have to worry about, right?

So I figured out there was this plug-in.

I don't remember the plug-in, but it allowed me to be able to use the WordPress installation as like a headless CMS kind almost like a database basically.

So I could build my site the way.

I wanted and if there's like blog posts or anything or playlist or anything, I was able to just pull that from the WordPress.

I will be able to that into WordPress and then doing there, But then fast-forward, I switch everything over to JavaScript because I want to turn the website as a challenge to use all Google products.

So I will use in a bunch of firebases stuffs and I will be like Google Sheets for stuff and like the docks stuff like.

So yeah, so I kind of like stopped using Wordpress all that to say, I thought these were present but now with this is pretty cool that build in browser WordPress experiences with WordPress playground and webassembly.

Lee so WordPress because the thing WordPress is built on PHP and you need a certain type of server to be able to run PHP.

Is this doesn't run into the browser like no does like I have shown like for example on stackable it's they have this whole web containers API that it's basically node running in your browser, right?

So if I want to go spin this up, So there's that and then again here's a node js project and because of that you're able to do all these other JavaScript Frameworks that kind of like rely on know to do things and so that's why it's pretty cool.

It's spinning up.

Bam.

There you go.

This is like basically node running in my browser.

And same thing with this other is that saw how quick it like it's spun up.

I think I mess something up here.

Oh no it is actually running.

See this is just node here, so I can just run.

So just as in node I can run say Node.

It's name of the file index address.

It sees it?

Put that out.

So it's node running in the browser.

Now we have PHP running in the browser, that is super cool.

I think so.

And it's all through like webassembly, which I still try to wrap my mind around.

Its webassembly, seems super awesome.

Oh, by the way, let me add stack bullets.

As a list of links, you can check that out as well.

Shouts to them.

As you can see, I have a bunch of projects on their cool stuff.

All right, so yes, look beautiful, run like an angular project, react project, all these things in the browser, amazing, but now it looks like you do WordPress in the browser.

So the full WordPress powered by PHP running solely in the browser with webassembly that right there.

That is kind of amazing.

Right.

Goes on to say, whoops.

So, shout out to Adam and Thomas.

All right, so when you first see WordPress playgrounds, let us open that up.

It seems like an ordinary site maybe except for the colorful background.

It's anything, but what you are actually looking at is an entire WordPress Tech stack including PHP and a database running entirely in your browser.

So this here, so it's preparing WordPress.

Is it?

It worked on my Chromebook, so I am not sure.

Sometimes certain things will slow down my computer, so let us refresh it.

Yeah, so here we go.

Mind blown a Blog about philosophy.

So this is WordPress running in the browser.

And so then you can do stuff like edit the site.

Well my computer is not liking this at all.

I think my internet may have gone out whatever like you can, this is WordPress Or was it actually opens up?

And so you can do.

Now I again I haven't touched WordPress in a minute, but like you have all these different.

They have a new way of forgot what it was called Galileo or something like that.

What was it that you can now kind of like structure your pages?

You can like move things around or what have you seem pretty cool.

Yeah, but this is your whole thing so if you want to edit this, I guess.

Oh wow.

So now this kind of reminds me of like how we look forward to editing your site design, everything on your side, from the header, right down to the footer using block.

So that's a new thing, click this to start designing your blocks and choose your typography.

Okay?

So it's a nice little way of being able to get like, train, not trained, but get familiar with just in your browser.

That's pretty cool.

Yeah, my computer is not liking this, I think whatever is happening.

It is a lot for it right now.

So I am going close this out but this is pretty cool so you can get to that from the website, all right?

Hopefully You know what?

That was it that was amazing.

My browser did not like what I was doing there and so it basically like shut everything else down.

But as soon as I close that page, everything seemed to like come back.

My fans are still kicking though but neither here.

Nor there back to this, let us see?

So in this post, so Adam, who's this person?

Here is actually from his lead WordPress playground only lead on it.

And then Thomas is the product manager V8, which is like the underlying engine of chrome browsers, right?

So then they talk about how WordPress playground can help you as a Developer how to Works under the hood and what it means for the future of Wordpress.

So, so, yeah.

So, this is cool use WordPress without installation.

Embed it in your app, and even control it with JavaScript, That's super cool.

You can use and customize the WordPress embedded at playground that word, press dot net for free.

I am afraid to open this.

Let us see, let us see what happens here.

It's the same thing up, something will stop doing that, okay?

There's no Cloud infrastructure and support to pay for because the site lives entirely in your browser.

No one else can visit it.

So similar to how stacked blitzes like when that thing running in my browser, the node running in the browser no one else has access to that because it's only in my browser and like they're saying that you can refresh the page and it's just like a brand-new is like it's gone and so like I said here you can get as many of these sites as you want for prototyping.

Trying out plugins and quickly, exploring ideas.

So that is pretty cool.

So without having to set up a whole WordPress instance let us say you want to try some different plug-in.

Let us say you create a plug-in you want to try it out but or maybe you want like a friend to try it out and you don't want to have to go through like having them set up a whole WordPress instance to install it and do all these other things.

This want to check it out.

You can just do that in the browser.

So you're probably like send them a link or something and it will just set up on their How's your all the different plugins, and they can check it out too?

That's kind of cool.

That's super cool.

You can even use them to test your code in different environments, using the built in PHP in WordPress version switches.

Yes, I saw that also so you can check out different versions.

So if you're running into an issue that you can see.

Oh, maybe it's a version of Wordpress or maybe it's a version of PHP.

What's the issue?

This is super cool.

Yeah.

So yeah, WordPress playground is entirely is an entirely new way of using Wordpress is full power.

However, is only unlock by including it in your app.

So the easy way to is to embed WordPress playground in an iframe, which makes sense, okay?

And configure it using query parameters API, okay?

That's what the official showcase does.

Oh when you select, for example, the pendant theme and the co blocks plug-in, the embedded iframe gets updated to point to this.

I am going to try that.

My computer May explode on me, but let me try that.

So it's just by using this link this.

I got saying before, if you wanted to test out something you can just like send them a link.

This is I guess would be the link.

Let me see this here.

Hold on.

This is pretty cool.

So it's repairing WordPress is going to get the theme and that plugin.

My computer shut down again.

So alright cool.

I guess.

Okay, so here we go.

I guess I can go under where do I go again?

Is it here?

No.

How do you do it again?

Oh here.

Go dashboard and things so it should have this pendant theme.

And it does and I can customize it.

That's pretty dope, let us see.

And then Co block, so I should be able to look under plugins And C code blocks that is dope.

Oh man.

Oh wow.

Holy crap.

Okay again, now my things are back up.

That is dope.

That is amazing.

I am super impressed.

So this is the type of stuff where I am like webassembly is amazing like running these like with Photoshop in the browser, I think that's using webassembly.

And then also like skoosh is an image like we call it.

It makes image files like smaller Like that, I think it's using webassembly like all these things, you know, like the browser is, an amazing thing is just kind of cool.

So the iframe is an easy way of getting started, but it's also limited to just the basic configuration options, okay?

If you need more than that, there's another more powerful API.

Oh, so I thought that was like it.

They could do more stuff.

Okay.

So the WordPress playground JavaScript, shot, the JavaScript client, enables full control over the embedded site.

Oh, that's dope.

So then they have this Library npm package.

The wp playground client, Wow, check the interactive tutorial.

So that even show you a tutorial.

That's pretty dope.

Let us see.

Okay, I think code is not too bad, so running the PHP stuff, it just does that.

That's cool.

And so now this is what I thought I was kind of scrolling through this, and I was like, this is pretty cool.

So now you can use web assembly PHP, even without WordPress.

So because all this is built around WordPress and WordPress roads in PHP.

So, it makes sense that there's some part of it that where there's webassembly for PHP, where you don't need WordPress and that's what this is.

And so WordPress.

Playground is not a monolith webassembly.

PHP is released independently of WordPress and you can use it separately as well for the web.

You may use the PHP Watson web npm package optimized for a low bundle size.

And in node.js you can lean on PHP wasm node which provides more PHP extensions.

And so, Adam use the former to add interactive PHP Snippets to this processor tutorial.

Okay.

So look like they have something embedded in their site, then this is how you would use it out of the super cool.

I am a tell Mi so Shasta Jim, he's a PHP developer Advocate advantage and some I don't know if he knows about this because I am sure you probably would have told me about this, but I am going to tell him about.

So at least I knew about it first.

So shout out to Jim.

So under the hood, there's one assembly PHP SQL translator in an in browse in browser server.

It's me.

That's why my whole computer is like.

Nope, this is running but it ran fine.

I think on my Chromebook as probably infrastructure.

I am the cool.

So now okay, so they talked about how they built it and things here.

This is a pretty good reason to the web server lives inside the browser in a regular WordPress.

Clicking on a link say blog, would initiate an HTTP request to the remote back.

End server to fetch the blog page if you make sense, however WordPress plug playground has over Go back in because again, it's all within the browser, it has a service worker.

Transit service workers and pwas, that intercept, all outgoing requests and passes them to an in-browser.

PHP instance, running in a separate web worker and shelter web workers again, is it is amazing what the browser can do it.

Super cool.

So here's like the webpage right?

And then the service worker in steps, any quicksand things that you have here, right?

And then it is rendered in the worker thread, okay?

By the in, Zur WordPress instance.

So thing running into it.

Okay, that is amazing.

And then there's a networking is supported through websockets welcoming our game.

So a bunch of stuff I have no clue what that stuff means so then WordPress can be used in even more places than the browser.

What?

Oh crap! It's almost a quits.

So okay.

So again I didn't read all this, but they mention stack with which is what I mentioned earlier.

So since WordPress can now run on webassembly, you can use it to run in a node.js server in the it's the same V8 engine of course, with stacked wits.

You can also run node.js directly in the browser.

Meaning that you could run WordPress and PHP compiled to webassembly executing in node js which is also compiled to webassembly running in the browser.

So this is a link to stack lives.

Holy crap it is a link to stack quits.

Oh damn okay look at me house.

I was ahead of my time.

I am even okay.

Here we go.

Gutenberg.

That's what it's called that Galileo.

Guttenberg I mean stack with and my computer shut down again.

My browser is like nope.

How did the super cool?

Sir.

I am Amazed.

I am definitely going to show gymnast.

This is super cool.

So, that means Oh, that's super with the webassembly stuff.

All right.

Wow.

Wow.

Okay, this is gonna take forever.

So let me stop his again.

My browser like shut down on me is like nope.

Okay, we're back.

All right, I don't want to keep pushing it.

So check, this is the future may bring zeros set up interactive and collaborative WordPress apps.

Imagine jumping straight into a code editor where you're free to just get building right away.

That's what I just like.

Feel like with the node stuff is that says pretty cool?

It's going to PHP.

You can even share a simple link and start a multiplayer editing session such as in Google doc.

Like you can do gold up and then when you're done, it only takes a single quick to seamlessly, deploy your creation to a variety of a hosting services.

All without ever installing anything locally that is done.

And that's just a glimpse.

I am definitely going to tell Jim about this, like, right after this.

I am gonna send them this video and stuff.

So, all right.

But yeah, I found that earlier, like, right before this.

And so, I was like, I will be kind of cool though.

What?

That is?

Super cool.

All right, my bad that! Wow! Okay, I am just gonna like all the things because before I remember that was the thing with setting up like WordPress.

I get like the word.

Press up.

Wasn't too bad, but like the database and then like the lamp stack.

Or something and I had to run this one thing to get it running and that's what I like about.

Like note everything is just in the cloud in the browser like I can just do it that way, but looks like PHP is coming towards that way, which is super cool.

So, I am going to show this the gym and see if his mind explodes like-minded because being able to just run its oh, Kai know, Jim created a plugin for WordPress and so for him to be able to test it out on different versions and stuff.

I call in the browser without having to install it.

Oh, I am going to like blow his mind.

I think with this.

So my bad.

I am just yeah, I am gonna get you all back to work, so because I am going to show Jim this is super cool.

So we're going to send you off with some traveling music.

This is, once I get this loaded, I can tell you.

Alright, sure audio.

So this is new Jabez featuring a Pawnee be.

The check is called, thank you.

Thanks again for hanging out and when we come back, we will take a look at artists website.

Maybe check out some videos.

Listen to some music, maybe you will come a fan but till then I wish you much productivity and thanks for hanging out.

Here we go.

New job ads, featuring a Ponte di, thank you.

All right, see you around.

Yeah, I will be easy piece.