we have a series on that as well so you can catch up on that so you can grab the basics before we dive into this practical project. So let's take a look at how this works. When we first land on the Notes app we get an untitled note created for us instantly, so we've got something to start typing. So I'm going to go ahead and say this is a note

and you'll notice a couple of things here. The first thing is the title is kept up to date, that's thanks to the functionality of Alpine's store and also the date which this was last edited. So two minutes ago this note was created, now I've just started to edit it, the time has been updated. Now we can also update the body as well which is represented

here and that's truncated after a while. So if we go ahead and just keep typing you can see that eventually that's going to go ahead and just end there so we don't end up with the entire body of the note. Now with this we can go ahead and create a new note as well of course. What that's going to do is create a new untitled note for us, put it into this kind of editor view or we can click on

this and switch between them and we can just start typing a new note in here again with the body. And again we can switch between these notes that we've created, so everything is nice and convenient. Now what you'll also notice is that we're using a getter here to order these notes, so we'll look at that in the series as well of course. So if for example I update this note down

here, you can see that I just typed, this is pushed to the top so the latest note that you have edited will always be at the top of the list. Now everything that we're doing here is not hitting an API just yet, this is being stored in local storage. You could convert this over to hit an API but as you can see when I refresh the page we end up with the same notes on the page as well.

And of course we've also got state management so keeping up to date with how many notes there are is also really really easy as well. So what happens when we delete a note? Well the first thing is we get a little confirmation dialog in the browser, of course that could be better, but we hit okay, that's going to go ahead and delete that note for us and we can delete pretty

much all of our notes down to the last note. And when we do delete our last note what that's going to do is just create an empty untitled note for us to start typing, so we always end up with a note inside of here. So a pretty standard note editor but it's lots of fun to build and along the way we're going to learn about Alpine stores.