Introduction
Every takeymakey tool is powered by a little bit of code, written in JavaScript. The code defines some inputs, processes them and returns some output.
Let’s take a look at a sample snippet.
({
take: [ /* some inputs */ ],
make: () => [ /* some output */ ]
})
The tool is an object with two properties, take
and make
.
Let’s look at take
first. To define a single input, we add an array with one object, like this.
({
take: [
{
type: "text",
label: "My example input",
}
]
})
The first property, type
, determines the sort of field to use. In this case, we are using a text
field. This creates an input in the tool where a user can add some text. The label
is shown near the input to let users know what information is needed.
Now let’s look at an example make
function.
({
make: function() {
return [
{
type: "text",
label: "My example output",
value: "Hello world!"
}
]
}
})
The function returns an array that is very similar to one defined by take
. Here again, each item in the array will create an output in the form. This output also uses the text
field, with a slightly different label
.
There are some differences, though. This time around we add a new property, value
, that is set to "Hello world!"
.
At the moment, this function will return "Hello world!"
no matter what inputs are passed to the function. In order to react to those inputs, we need to access the data, which is passed as the only argument to the function.
({
take: [
{
type: "text",
label: "My example input",
}
],
make: function(data) {
return [
{
type: "text",
label: "My example output",
value: data.toUpperCase()
}
]
}
})
This function takes a string that the user inputs, and transforms it to use uppercase characters. Now we have a fully working example and have built our first working tool!
Now that you’ve finished this introduction, read more about the take
and make
properties, or dive in and start building your own tool.