---
title: "Component Development"
slug: "component-development"
updated: 2025-01-24T16:55:10Z
published: 2025-01-24T16:55:10Z
canonical: "learn.servitly.com/component-development"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://learn.servitly.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Component Development

Here you can find all the information to create reusable, visually appealing, and functional components. Whether you're building a simple filter, a template, or a complex widget, this guide provides a clear roadmap.

Before creating a new component, you must clearly define which type of component do you need. In some cases it is enough to define a filter to format data in a specific way into widgets, otherwise if you need a new UI/UX that is not configurable through built-in components, probably you need a new widget component.

1. [**Creating a new component**](/docs/component-creation)

In the Components Manager create the new component and start editing it.
2. **Writing source code**

Write the source code according to the component type:
  1. [Filter](/docs/editing-a-filter)
  2. [Widget or Control](/docs/editing-a-widget)
  3. [Template](/docs/editing-a-template)
3. [**Styling with CSS**](/docs/styling-with-css)

Structuring your CSS and use CSS variables for theming.
4. [**Debugging**](/docs/component-debug) How to debug the source code and try it in a DPS.
5. **Publishing** Make your component public to your production environment.