Chapter 4 User InterfaCe DesIgn Angular Support Library The Angular support library includes the following: Material UI Angular Material is Bootstrap components written in Angular by using Google’s Material Design specification. All the UI (presentation) components such as accordion, table, gauge, charts, etc. have been split into separate importable modules, which are reusable across applications. As shown in Figure 4-9, Angular Material provides UI capability to the ATS. Bootstrap Twitter Bootstrap is used while developing the UI (presentation) component of a DXP to speed up development. However, a DXP is lean and flexible, hence the entire template HTML is customizable. It is possible to use another CSS framework as per business requirement. It works on the mobile-first approach to implement responsive features. SASS (Syntactically Awesome Style Sheets) – CSS Preprocessor SASS provides a simpler, more elegant, syntax for CSS and implements various features that are useful for creating and managing CSS, such as nested rules, variables, mixins, selector inheritance, and many more. It also helps to keep everything organized and allows you to create style sheets faster. Swagger Swagger helps you to mock the web services. The UI (presentation) component has service data hooks that communicate with a server through a REST API. All the REST APIs are defined in Swagger. Code generated by Swagger provides a simple and well- defined interface to the REST APIs. This enables fast development, as the developer can see from the data module documentation exactly which methods are available, what parameters are accepted, and the JSON in which the data is returned. 135
![Building Digital Experience Platforms - Page 153](/cdn-cgi/image/width=600,quality=80,format=webp/https://cdn.relayto.com/images_originals/600ee6feb14f9.jpeg)