Skip to main content

Kelp Glossary

This glossary defines common terms that you might see as you're working with Kelp, or throughout our Documentation and Help Center.

A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z

A

App

An app is a web application created in Kelp. The app runs in a browser and provides interactive features to its users.

C

Canvas

The canvas is the working space where you define the app logic. To create an app, you place components on the canvas and connect them with wires.

Component

A component is a building block in Kelp. You create apps using components and connecting them with wires. Basically, Kelp has two types of components: components and widgets. Widgets are visual components that show information to users. However, in the component library, we keep components in different categories, for example, utils, connectors, data processing components, and many others.

Component Library

The component library is the list of available Kelp components. To open the component library, right-click anywhere on the canvas in Developer mode.

Composite Component

Composite components consist of core components or other composite components. You create composite components by grouping a piece of the graph into a single composite component. Composite components help create different abstraction levels in Kelp.

Core Component

Core components are default components that you see in the component library. Unlike composite components, you can't break down core components into other components.

D

Dataflow Graph

Dataflow graph is the logic layer of an app, which you create in Developer mode. The graph is a combination of interconnected components placed on the canvas. As a data structure, the whole graph or any of its parts is a JSON object. This allows you to easily copy and paste the graph to another place on the canvas or even into another app.

Data Gateway

The data gateway is a secure backend service between your app and external data sources. All API calls from Kelp apps go through the data gateway. The data gateway is multipurpose. Kelp uses it for monitoring, security, load balancing, caching, protocol translation, and so on. What security is concerned, the data gateway helps protect, manage, and share user credentials with external secure data sources. The data gateway doesn't store or log any app data. All the app data passing through the data gateway is end-to-end encrypted while in transit.

Data Source Connection

A data source connection (or a connection for short) is a configuration of settings that Kelp apps use to connect to external data sources. Depending on the data source, a connection contains various settings. For example, connections to secure APIs include necessary authentication information. Connections are reusable: you can use them inside one app or across multiple apps. Kelp has two types of connections: preconfigured and custom, which users add themselves. A list of preconfigured connections covers popular APIs (Google API, HubSpot API, Dropbox API, and more).

Data Stream

A data stream is a sequence of ongoing events ordered in time. A component that receives the data stream processes each piece at a time. Data streams usually pass events to the List widget or to another component.

Data Transformation

A data transformation is a transformation of the data that flows between components as events. Each component has the specific data structure it expects to receive. If an in-port of a component receives the data whose schema differs from the expected one, the component won’t operate as it’s supposed to. In this case, you need to apply a data transformation to the data the component receives. Kelp supports various JSON transformation languages, for example, KelpQL, JMESpath, JSPath, and others. To see which data schemes in-ports of a component expect, open the component library and search for the component.

Design Mode

In Design mode, you arrange and format widgets, which show information to users. You can also set up the app navigation, change styles, and break down the information the app shows into pages.

Developer Mode

In Developer mode, you build apps by placing components and connecting them with wires.

E

Event

Events are containers that hold and transfer the response data of HTTP requests through wires. Kelp has two event types: data events and signals. When we mention "events" in the Kelp documentation, we mean data events in most cases. Data events can hold and transfer HTTP requests, constants, changes on a variable, ingested messages, and many other things.

Event Listener

The event listener is a debugging tool available in Developer and Preview modes. As an interface element, the event listener is a panel, which you can open. The event listener records data events and signals passing through the selected wires. You can then view the recorded data in chronological order.

G

Grouping

Component grouping is useful if you want to do the following:

  • Declutter the dataflow graph. If you have a large number of components, the graph becomes messy. To make it neat, you can hide multiple components in a group.
  • Create a composite component. To create a composite component, you first need to group the constituent components. You decide which components to group. For example, you can group components that have the same objective or those related to a particular piece of the app logic.

L

Layout

The layout is the widget arrangement you create in Design mode.

P

Ports

Components use in-ports to receive events and out-ports to emit events. Each component has one or more in- and out-ports. To trigger a component, no need to connect all ports. The exact ports you need to connect depend on the component type and desired functionality. Kelp has three port types: standard, queryable, and hybrid. To see which ports a component has, open the component library and search for the component.

Preview Mode

In Preview mode, you can see how an app looks to users.

Q

Queryable Ports

Queryable ports (or q-ports for short) are bidirectional ports. Unlike standard unidirectional ports, q-ports are pink in the Kelp interface. A q-port is, in fact, two standard ports joined together, where one port can only receive events, while the other one—emit. q-ports can be connected with q-wires only. A real-life analogy of a q-port is a double socket.

Note: Apart from q-ports, Kelp also has hybrid ports, which can accept both standard and q-wires.

Queryable Wires

Queryable wires (or q-wires for short) are bidirectional wires that connect q-ports and hybrid ports. Unlike standard wires, q-wires are pink in the Kelp interface. A q-wire is, in fact, a bundle of two standard wires, where one wire is a forward data stream, while the other one—a backward data stream. You can split a q-wire into two standard wires, and vice versa: bundle two standard wires into a single q-wire. To do so, you need to use the QPort Client and QPort Server components respectively.

S

Signal

Signals are special events that can affect the graph by changing the default operations of components. Signals are a part of the control flow mechanism. They can do the following:

  • Mark the beginning and end of a batch of events.
  • Instruct widgets to display a progress bar.
  • Reset buffer on ports, and so on.

Kelp has several types of built-in signals. Some components, such as the HTTP component, emit signals by default. In some cases, to control the data flow, you may need to inject signals yourself.

U

UI Blocks

UI blocks are primitives you use to create custom widgets. The Kelp interface is based on Blueprint JS: a react-based UI toolkit for building complex data-dense interfaces for desktop applications.

V

Vega Chart

Vega Chart is an integrated widget that supports Vega and Vega-Light declarative visual language. Vega Chart helps to create rich data visualizations.

W

Widget

A widget is a visual component you add to the graph to design your app interface layout. You add widgets in Design mode. Widgets can show information to users as charts, graphs, icons, tabs, lists, cards, and so on.

Wires

As a concept, a wire is a data stream. As an interface element, a wire is a thin line that connects components. You define how data flows in your app by connecting components with wires. Kelp has two wire types: standard and queryable.