-
Notifications
You must be signed in to change notification settings - Fork 0
B. Wiring (Expert Mode)
Before getting started with this topic, you need to have a good understanding of some important concepts in order to connect fields.
Within Eureka, there are small software components called widgets (as mentioned in the introduction section). These widgets (also called fields) are very important within the software, since they allow the exercises to be built correctly and to share data with each other. Widgets have two very important components which are:
- Input: Basically it is the type of input data that the widget will receive to display in the software. This data can come from another widget or from a custom output.
- Output: It is the type of data that the widget returns after having been processed within it. This data can be exported within a presentation or to be connected to another widget.
So, wiring is basically the data connection between widgets, modules and submodules and it works by connecting the data through the inputs and outputs. To better understand, let's look at the following diagram:
Before start wiring, you must understand new concepts and software options.
Each of the widgets, both inputs and outputs have their own type and data structure based on the structure provided by the Javascript programming language.
It's a value representation. In eureka, the most common data types are used such as:
Numbers: Represent numeric values, either integers or decimals.
const age = 25;
Strings: Represent sequences of characters, such as words or phrases. It's being represented wrapped by quotes.
const name = "John";
Boolean: Represent true or false values.
const activated = true;
For more details, see Javascript documentation: https://www.w3schools.com/js/js_datatypes.asp
Data structures hold the data along with their values. In Eureka you can find two types of Data Structure which are the most used in the software, those are:
Array: An array in JavaScript is an ordered collection of elements. Each element can be a value, such as a number, a string, a boolean, or another data type, even another data structure such as objects. See example:
const output = ['value a', 'value b'] //With strings
const output = [{ _id: '', value: '' }, { _id: '', value: '' }] //With objects
Object: An object in JavaScript is a data structure that allows you to store and organize related information in key-value pairs. Objects are represented by wrapping the key-value with curly brackets See example:
const source = { _id: '', value: '' }
For more details, see Javascript documentation: https://www.freecodecamp.org/news/data-structures-in-javascript-with-examples/
To efficiently connect the fields, you need to have a good understanding of these concepts. In the software, a data structure pattern is used in almost all widgets, which are: identifier and value, either for inputs or outputs. For example in the checkbox widget context:
Output:
[{ _id: 161856565, value: 'Option A' }]
Input (expected data structure):
[{ _id: 161856565, value: 'Option A' }]
See the following image:
Written by Roberto Ajuchan | IXL Center, Inc.
Developer