AI Content Chat (Beta) logo

Chapter 4 User InterfaCe DesIgn NPM DXP UI (presentation) component development relies on NPM (Node Package Manager) so that you can incorporate other NPM packages into your development process. It provides package management capabilities to both the ATS and RTS. React Technology Stack The RTS consists of multiple libraries such as React, Semantic UI, React Native, Redux, MobX, and Flux. You can make your own framework using these libraries. React React is a component-based JavaScript library for building a UI that deals with the view in the MVC. The React library is leveraged to provide many features to build a dynamic user interface: • Server-side rendering: Next.js is the framework for the server-side rendering of a React-based application. It provides a flexible way to completely or partially render your application and optimize it so it will be easily searchable, linkable, and navigable for web crawlers. • Performance: Virtual DOM in React makes the UX better and it works faster. • Reusable component: This component has its own logic and controls its own rendering, and can be reused wherever you need. Code re-se helps to make your apps easier to develop and easier to maintain. React Support Library The React support library includes the following: Elemental UI or Semantic UI Semantic UI is React’s official integration CSS framework that helps create beautiful, responsive layouts using HTML. It uses simple phrases called behaviors that trigger functionality. As shown in Figure 4-9, Semantic UI provides UI capability to the RTS, but you can use other CSS frameworks (e.g., Elemental UI, which is the UI toolkit for a React- based application). 137

Building Digital Experience Platforms - Page 155 Building Digital Experience Platforms Page 154 Page 156