Disclaimer: Force.com sites might not be the best way to develop a status page because of the daily and monthly allocations. However, I think its a nice Visualforce and site development exercise. And since the page is public and we need the guest profile, we also deal a little bit with sharing and visibility.
At the end we should have something like this in our page:
Salesforce has a small snippet on how to add a Lightning component to a Visualforce page (here), but we want to use Lightning Out to add a component to a public website. To allow guest user access, there’s a catch: we need to implement the
ltng:allowGuestAccess interface in our app:
<aura:application access="GLOBAL" extends="ltng:outApp" implements="ltng:allowGuestAccess"> <aura:dependency resource="c:statusComponent"/> </aura:application>
For starters, thinking about the data structure of a simple status page like this one, we have three obvious objects to deal with: the systems listed, the incidents (per system) and the incidents updates. We can assume there’s a master-detail relationship between a system and an incident, and another between the incident and the incident update. The system has a current status (available, with a performance degradation or unavailable), while the incidents and their updates can change this status.
No mystery regarding how the page works. It is a Visualforce which uses Lightning Out, which implements a Lightning App that has a component as dependency. This is a composed component, which means it uses another components to compose the view.
The main status component (
statusComponent) queries the systems and instantiates a component (
systemStatus) that is dedicated to show info regarding a specific system. This system status component queries the unresolved incidents of its system and instantiates the
systemIncident component, which does pretty much the same thing to a
Now talking a little about the back-end of things: it would be nice if the user responsible for updating the incidents statuses could update the system and the incident statuses. This way, if an incident is resolved, the site can be instantly updated.
The source code can be found here: https://github.com/renatoliveira/force-com-status-page.