Presentation given on the Belgian OutSystems Community meetup in November 2018 about Reusable UI Components in OutSystems version 11

1. Reusable UI Components

2. What is a Component?
A component is a reusable object that speeds up application creation
and delivery. It should be easy to use and understand, and the focus
should be main or common use cases.

3. 6 Simple steps
• Purpose
• Logic
• Presentation
• Reusability
• Maintenance
• Non-functional requirements

4. Using an API
• Keep it small
• Keep it simple
• Focus on the main use cases
• Offer the best defaults
• Limit the number of inputs

5. Pitfalls to avoid
• Keep in mind the possibility of change
• Avoid the !important CSS tag
• Use style classes where possible
• Avoid setting colors and buttons
• Offer extensibility

6. Names and descriptions
• meaningful names
• Use PascalCase
• Use event names that start with "On"

7. Visual presentation
• Use images that identify the component
• Use the same image within the component
• Use false Conditions for Better Previews
• Add sample content to placeholders if useful

8. Maintenance
• Add comments or notes where needed
• Comment changes to code between versions
• Create a demo module

9. Let’s give it a try