BMC Helix ITSM - Smart IT 21.x: Fundamentals Developing Progressive Web Applications
A Progressive Web Application (PWA) is a type of application software delivered through the web, built using common web technologies. It is intended to work on multiple platformsthat use a standards-compliant browser, including both desktop and mobile devices.
In BMC Developer Studio, you can enable progressive views either for an out-of-the-box (OOTB) form or for a custom form. Using PWA, you can create applications that are flexible and provide a dynamic, modern UX for your applications. PWA provides a modern, mobile-friendly UI that is like Smart IT but is also customizable and extensible like Mid Tier.
This course combines classroom instruction with laboratory exercises to guide students through the basic concepts, features, and functionalities of PWA and its development in BMC Developer Studio. Students will develop skills in building various components like Advanced filters, Parallel Active links using the new properties added in BMC Developer Studio to support PWA. They will also learn about the layouts and panels, configuration elements, and localization for PWA. Additionally, they will explore the customization use cases for Smart IT Progressive Views.
Major release:
BMC Helix ITSM 21.x
Recommended Prerequisites:
Good for:
Administrators, Developers
Course Delivery:
Instructor-Led Training (ILT) | 24 hours
Course Modules
-
Introduction to Progressive Web Applications
- Overview of PWA
- Developing Applications with PWA technologies
- Features and advantages of PWA
- Mid Tier Architecture for PWA
- Capabilities of Mid Tier in PWA
- Smart IT Screens supported by PWA
- Enabling Progressive Views for Forms
- Cross-launch of PWA from ITSM to Smart IT
- Difference between Smart IT and Progressive Web Application screens
- Creating and Editing tickets
- Screen Customization Settings
- Creating a Progressive View
-
Advancements in Developer Studio for Progressive Web Application
- Advancements in Developer Studio to support PWA
- Progress Bar Widget
- @mention Component
- Advanced Filter Component
- Simple Search Menu
- Date and Time Picker
- Supporting Typeahead Feature for Character field on Search Menus
- Ability to Run the Active Links in parallel
- Survey Component
-
UI Layout of Progressive Web Application
- User Interface Layout of PWA
- UI Layout Style of PWA
- Panel Sequence
- Panel Properties
- Features of Flow Panel Holder
- Fixed Panel Holder
- Panel Properties of Progressive View
- Create Complex Layouts with Flow Panels
- Creating Date and Time Fields
-
Developing Progressive Web Application Components
- Creating a Search Menu
- Setting Typeahead Feature for the Character field in Search Menu
- Creating a List Table
- Creating a Selection List
- Customization Best Practices for Developing PWA
-
Developing Progressive Web Application Advanced Components
- Configure an Advanced Filter Component
- Configure a Faceted Filter Component
- Filter Properties of Table Field in Progressive View
- Properties of Advanced Filter in Progressive View
- Active Link Actions
- Creating Open Window Action for Popup Window
- Creating Open Window Action for Search or Submit Windows
- Creating Open Window Action for Dialog Window
- Creating Open Window Action for Modify or Display Windows
- Creating Parallel Active Links
- Creating Display Error Message on Mid Tier vs PWA
-
Localization of Progressive Web Application
- Localization Overview
- Localization Process of PWA
- Preparing Application and Server for Localization
- Preparing Configuration Data
- Create a Package Definition Form
- Create a Tab Separated Values (TSV) file
- Translate the Strings in a TSV file
- Import a TSV file containing translated strings to the AR System Message Catalog Form
- Best Practices for Localizing a PWA
-
Smart IT Progressive View Customizations
- Understand and Analyze the Customization for Smart IT in Progressive Views
- Smart IT PWA Implementation
- Types of Smart IT Progressive Views
- Smart IT Progressive View Layout
- Smart IT Progressive View Panels
- Adding a Custom Form in Smart IT
- Customize Smart IT Incident PV Screen
- Customize Smart IT Change PV Screen