Build reusable page components and use them across your application.
Recorded with an earlier Twidget interface. Names, control locations and available options may differ; use the linked documentation for current guidance.
Watch tutorial (3:02)Page components are reusable building blocks within the Twidget platform that enhance development efficiency by allowing users to create, manage, and implement consistent UI elements across multiple pages. They serve to encapsulate functionality and design into a single entity, which can be reused and modified independently from other components.
Reusability: By creating a page component, users can utilize the same visual and functional elements in different contexts without the need to recreate them every time. This reduces redundancy and aids in maintaining a cohesive design language throughout the application.
Component Modification: Changes made to a page component will reflect anywhere the component is used across the platform, streamlining updates and ensuring consistency.
Dynamic Variables: Users can define variables within page components that allow for dynamic content modification. This enables flexibility in how components interact with various data inputs, tailoring the user experience.
Component Creation: Users can create a new page component by defining its name, description, and type. This process includes selecting elements like images and text to comprise the component's UI.
Integration into Pages: Once created, page components can be added to other pages by accessing a sidebar that lists all available components, allowing for quick assembly of page layouts.
Automatic Updates: Any modification made to a page component requires the component to be published for changes to propagate across all instances where it is used. This ensures that all pages using the component benefit from any bugs fixes or design updates, maintaining uniformity.
Variable Management: Users can incorporate variables into page components, enabling dynamic behavior. When a component is placed on a page, the values of these variables can be customized, allowing for tailored interactions while preserving the component's base structure and functionality.
Page components in Twidget simplify the process of designing and managing application interfaces by offering a modular approach to UI element creation. Their reusable nature, combined with the ability to incorporate dynamic variables, empowers developers to streamline their workflow and enhance the maintainability of their applications.
Data Source Mappers
For Table elements, see [Page tables](/docs/pages/page-tables). Tables, charts and calendars now offer a scoped data picker and Sample value in the editor. The sample uses local demonstration values only; opening it does not fetch customer records or run a workflow. Page starters can also connect an...
Page tables
Use a Table element to show a list of records with search, sortable headings and paging. Choose an existing Table page creation option, add a Table element in the editor, or start with a [Page starter](/docs/pages/page-starters). Find the right element. Select the table on the canvas or in Layers. T...
Access Path Parameters in a Page
Path parameters play a crucial role in enabling dynamic and targeted content retrieval within the Twidget no-code API platform. This documentation outlines the fundamental concepts of path parameters, their implementation in Twidget pages, and their utility in enhancing page interactivity and config...
Element States
Element states are fundamental attributes that define how elements visually respond to user interactions within the Twidget no-code API platform. Each element, such as buttons, input fields, or cards, can exist in multiple states, each with unique visual characteristics that enhance the user experie...
Page Forms
Page forms are essential components in web applications that facilitate data collection from users. They streamline user interaction by providing a structured way to input data, which can then be processed for various purposes such as updating content or storing information in a database. Key Concep...
