The web application, together with one or more smart contracts, is the other part that helps to form a DApp. The application files are available inside the app directory, in the Files hierarchy, presented at the left side menu.
The application is structured into three main files: app.html, app.css, and app.js.
The CSS file (app.css) determines how the application looks, by defining style preferences and visual details.
Navigating through the files and editing them is the same as contracts. Expand the app folder by clicking the arrow next to it, then click any of the listed files to open it in a new editor window.
There are two distinct actions, exposed in the form of two buttons, positioned next to the app folder name: Show Preview and Mosaic View.
Show Preview opens up a new window containing the application rendering view.
The Mosaic View is a pre-determined setting that opens up all three app files together with the preview in a single, 4-way split screen. This set up enables quick live editing since the Show Preview will automatically read saved changes, rendering the content results in real time.
It is possible to disable injecting SuperBlocks Lab Web3 provider by checking the Disable accounts option in the Show Preview window, in which case, simulating the accounts are unavailable.