XPages App to Web App: Part Thirteen - HTML Layouts
We've covered a lot of the Ship and Ship Spot basic web component JavaScript. But now it's time to dig into the HTML. But first, it's important to recap the landing page web component.
We've covered a lot of the Ship and Ship Spot basic web component JavaScript. But now it's time to dig into the HTML. But first, it's important to recap the landing page web component.
In the last two parts we covered the ship form, but we didn't cover the HTML of the form. We'll cover that in the next part, but first we'll cover creating the class. As we do that, we'll see one of the big benefits that Web Components brings to JavaScript application development. Because here we'll start with the Ship Spot form, which not only captures data that will create or display a Ship but also creates a Spot - Location, Port From and Port To.
The last part focused on using observedAttributes()
to switch what the main action button did, depending on the current document state. In this part we'll cover the functionality behind the search button and the save.
In the last two parts we created our first web component and converted the login function into services we could use for all data interactions, the first use being to load data for any select controls in the application. Now it's time to create the ship form.
We've got a login and a landing page, we're ready to start building the bulk of the application now. But we need the data. In part six we handled the login, both for a mock session and the actual authentication to Domino REST API. But that format is going to quickly get messy as we build out the rest of the application. We can do better.