One of my absolute favorite things that I can do with my mobile applications because they're built in this way on top of PHP, is just develop them in a browser like I normally do with web applications. So Let's go back to our application here in the browser, and you can see, just as we did earlier, this works kind of fine here in the browser. I mean, it doesn't do the native action that we've asked it

of fine here in the browser. I mean, it doesn't do the native action that we've asked it to do because that's not available in this environment, but it doesn't break. And so we can continue developing this and just knowing that that's gonna do something when we get it into the right environment. And that means that we can go ahead and build all of this without ever having to compile or run our application onto a simulator or a real phone.

and build all of this without ever having to compile or run our application onto a simulator or a real phone. We can build our, our main application here just as we normally would. So I tend to run MPM Run, I like to use hot reloading here. So I do MPM Run Dev. So now that's waiting for changes and I just need to refresh the page here so that it's gonna pick that up and then I can go and make some changes and we see them

that it's gonna pick that up and then I can go and make some changes and we see them reflected immediately. And it's great for when you're building in the browser, but what happens when you do wanna switch to working on a device? Let's see, we'll leave this one running and then we'll go and run our application, Right? So first of all, it's taken some time

Right? So first of all, it's taken some time to boot our application, even though it's not minutes and minutes, that's not great. So we want to use hot reloading in this environment if we possibly can. Let's see what happens when we do. So let's make a change And have a look at the simulator. And you see it hasn't changed, and that's

And have a look at the simulator. And you see it hasn't changed, and that's because the simulator is unable to connect outside of its environment to the hot reloading server that we're running through V in this case. So what can we do about that? First of all, let's stop this V Hot reloading server. We don't need that. Now in its place. We are gonna run the native PHP hot reloading tool. So instead of the NPM Run Dev, I'm gonna run

We are gonna run the native PHP hot reloading tool. So instead of the NPM Run Dev, I'm gonna run our built in hot reloading service, and we can do that with PHP Artisan Native Run, and we can pass the watch flag and that will build, compile, install, and watch for hot reloading. But I've just compiled and installed the application. So I know that the latest version is already on the simulator that I want to use, so I don't really want to go

So I know that the latest version is already on the simulator that I want to use, so I don't really want to go through that whole process again. So I'm just going to native watch iOS. Now this is gonna find that simulator if it can. So let's bring that simulator to the foreground. Cool. It's there. Now let's see this hot reloading in action. And there you have it. Hot reloading onto a native environment.

And there you have it. Hot reloading onto a native environment. Now, hot reloading like this only works with simulators. It doesn't work on real devices, and that's because real devices would have to connect over the network to your laptop in order to trigger the hot reload. And that at least gives you the opportunity to work with some of the native functionality, even if not all of it's available on a simulator. So that means we could change this function on the fly

of it's available on a simulator. So that means we could change this function on the fly and we don't have to recompile and reinstall our application to make it work. So instead of doing an alert, why don't we just do a toast? Let's have a toast, and we'll just say hello world. Instead of alert me, let's just say toast me. Cool. And then if we hit the button, now it's a toast. So in this way, we can very, very rapidly start to build out our applications and test the functionality.

So in this way, we can very, very rapidly start to build out our applications and test the functionality. Hot reloading is very, very cool, no pun intended. Another trick that's really useful is to be able to connect with the web view that's on the device in real time from your laptop. Now this works in a simulator and on real devices, you can connect your full web browser from the desktop to the running web view in a simulator or on a real device,

you can connect your full web browser from the desktop to the running web view in a simulator or on a real device, and use the dev tools in the desktop browser to interrogate and manipulate the web view in the simulator or on your device. This can be great fiddling around with the page to understand what's going on. And it's very much like your developing in the browser. It just takes a couple more steps to get hooked up. And there are a couple of gotchas as well. For this.

It just takes a couple more steps to get hooked up. And there are a couple of gotchas as well. For this. I'm gonna use Safari because Safari has the tools to connect to iOS simulators and simulators are already set up to handle this. So we just go to the developed menu. In Safari, if you don't have the developed menu, you need to enable it here in the settings under advanced, and then check this box at the bottom so we can see all of the devices that are connected to this computer

and then check this box at the bottom so we can see all of the devices that are connected to this computer that have got a web view running. And obviously there's the computer itself. I've got a couple of phones connected to it right now and this simulator, and if we hover over this, you can see it's showing our application and the exact URL that's being viewed in it. So we just need to click on that and we get the dev tools.

and the exact URL that's being viewed in it. So we just need to click on that and we get the dev tools. Let's just make this a little bit smaller so we can see everything. And we've basically got full access to all of the typical dev tools. If you are used to using dev tools in Safari because Safari is your daily driver, then this is gonna feel right at home. The only thing to note is that it, it is different.

then this is gonna feel right at home. The only thing to note is that it, it is different. It's not a normal browser and it doesn't have all of the features of a normal browser. It's a web view and the web view between iOS and the web view on Android. They're also different from each other. So there might be some quirks of behavior, but here you can see all of the requests that come through. We can even inspect using the target inspector.

but here you can see all of the requests that come through. We can even inspect using the target inspector. We just need to click it and click on the element that we want to interrogate where we have access to it. We can obviously change the content in here. Again, although that's not going to update the files on the site, we could even reload the page. So basically a refresh if you want to manually knowing

we could even reload the page. So basically a refresh if you want to manually knowing that you can do this and you can do this both on iOS and Android is great. This is super helpful for when you're trying to figure out why some bugs are occurring. Of course, you can also do this when you're developing in a normal browser. The difference is that sometimes there are just issues that appear between the browser environment

The difference is that sometimes there are just issues that appear between the browser environment and the web view environment. What might work in the browser might not work in the web view, so you do need to know that this is a thing that can be done. So those are just a few little tricks that will keep up our sleeve when we're developing our application, and they'll come in really handy later on.

application, and they'll come in really handy later on.