Webform Rendering
The concept of rendering plays a fundamental role in bringing digital interfaces to life. However, Qodly Studio has a unique approach to rendering that sets it apart from traditional methods.
What is Rendering?
At its core, rendering represents the pivotal stage where the abstract blueprint of a digital interface takes its final form. It encompasses the intricate process of translating design layouts, data connections, and interactive behaviors into a visually appealing and functional user interface that end-users can interact with.
Understanding the Qodly Approach
In the case of Qodly Studio, rendering takes a different path compared to conventional web development. Here's how it works:
Design and Configuration: Users initiate the webform creation process within Qodly Studio by arranging components, mapping datasources to these components, and configuring event-driven behaviors. This design phase captures the form's layout and desired functionality.
JSON Representation: Instead of generating conventional HTML code, Qodly Studio encapsulates the entire webform, including layout, data connections, and event-driven logic, in a structured JSON file. This JSON file serves as the representation of the webform.
Rendering Trigger: Accessing the webform directly in a web browser is not an option. Instead, the webform is "rendered" when users initiate the rendering process, which can be done in one of two ways:
Preview in the Studio: Users have the option to preview the webform within the Qodly Studio interface.
Dedicated Browser Tab: Alternatively, users can opt to render the webform in a separate browser tab.
When a webform is rendered for the end user, what is returned is the final HTML code and CSS that represent the webform's visual appearance and functionality.
The webform is transformed into an HTML/CSS representation that can be displayed and interacted with in a web browser. JSON is used internally for data representation and configuration but is not what the end user receives when viewing the webform.
Runtime Rendering
At runtime, webforms are generated and interpreted by the built-in renderer engine. This engine takes the JSON representation and transforms it into a functional, interactive form that end-users can engage with.
Unique Webform URLs
Crucially, each webform is assigned a unique URL on the Qodly Web server. These URLs serve as access points for end-users to interact with and render the webforms they require.
Data Flow and Server Architecture
The flow of data within the Qodly Studio ecosystem is carefully orchestrated, ensuring a seamless rendering experience:
Qodly Studio operates with an embedded Studio web server, providing secure web access. Users can conveniently preview webforms within the protected confines of Qodly Studio.
Additionally, the Qodly web server functions as a REST server, facilitating communication between the rendering engine and the web server through REST requests.
After deployment, webforms become readily accessible to end-users, who can render and interact with them directly in their web browsers.
Webform Rendering Options
Rendering a webform in Qodly Studio provides versatile control and accessibility. You can preview it in the Studio or a separate browser window, but It's important to note that:
Database resource access control depends on the chosen rendering method.
Preview in the Studio
This approach provides a comprehensive view of data classes, functions, and attributes, even if they are not exposed as REST resources.
Please keep in mind that:
This preview is conducted with Administrative privileges, utilizing the Admin account you registered with. To conduct a preview based on a specific user's perspective, explore the options for Previewing in a new tab or Previewing the entire site.
Preview in a Browser Window
You have the flexibility to render the current webform or the entire website in a browser window. In both scenarios, the webform is rendered by the Qodly web renderer engine. This engine diligently applies REST resource restrictions and permission actions defined in your Qodly project, ensuring that only exposed resources are rendered in the browser.
It's worth noting that:
This preview operates under the logged-in user's privileges. During your initial preview or when your session expires, your browser will prompt you to log in with a Qodly user account, utilizing this account's privileges for rendering your application.
Preview Webform in a New Tab
Preview the Entire Site
Preview button on the Qodly toolbar presents the start page, as defined in the Settings within a browser window tab. This option provides a holistic view of the application's initial landing page.
When the Preview button is clicked and unsaved changes are present in open webforms, a popup is displayed to ensure users are aware of their unsaved work. This popup prevents the application from rendering until the unsaved changes are addressed.
Users can choose to save all changes in open webforms before rendering, without seeing this popup again, by checking the "Memorize..." checkbox at the popup's bottom. Alternatively, this alert can be controlled through the "Show Unsaved Files Pop Over" setting in user preferences.