2. Fibonacci Sequence

Once you join Qreli, we will see 7 apps in your account that will help you learn how to build quickly:

This app will introduce the Compute Module - that is, doing some activities without any user interactions repeatedly until certain conditions are met.

We will create a little app that calculates the Fibonacci value and sequence. If you are not familiar with it, here is the Wikipedia page describing it: https://en.wikipedia.org/wiki/Fibonacci_sequence

We will do two implementations: one manually, using loops and decisions, and one using AI coding.

Manual implementation (intro to variables, loops and decisions)

We will implement this algorithm in a straightforward way - note the {...} in front of the Calc step; this denotes that the step has no user interactions - no data being entered or reported to users.

Let's go.

In Entry, we start by asking our users to enter the value for which we need to calculate the Fibonacci number.

Besides the Fibonacci number itself, we will also provide the sequence up to that number. To do so, we instantiate a list with 0. We will also provide an alternative implementation using an Array element — we'll instantiate both of them here. To learn more about variable types, click here.

You can move the execution order of your variables up and down by dragging the left hanlde:

When you define a variable, besides its type, you will see a bunch of these icons on the right:

Lastly, you can see all the variables you defined, and where they live on your DESIGN > DATA tab:

What is Fibonacci you ask?

Here it is, compliments of Wikipedia:

The pseudocode we implement is as follows:

list = {0}
while counter < entry
   if counter does not exist, counter = 1
   if f2 does not exist f1 = 1 else f1 = f2
   if fib does not exist, f2 = 1 else f2 = fib
   if fib does not exist then 
      fib = f1 + f2
   else
      fib = 1
   list = {list, fib}

This is exactly what we implement in the Calc compute module:

For the calculation of the Fibonacci number, we use a conditional IF-THEN:

If fib is not empty

fib = f1 + f2

else

fib = 1

To add to the list:

We repeat the steps above while we satisfy the condition count < entry.

If that condition has not been met, we keep going back to the beginning of the Calc step and run through the variables again.

If the condition has been met, we go to the next step, set as default:

When done, we show the results.

We use a decorator to show the Fibonacci value with thousands separator, as well as to configure the display of the array contents:

AI implementation (intro to AI Coding)

We realized that the joy of building with Qreli dims when having to manually implement low-level algorithms and logic.

The fun of Qreli is quickly assembling interfaces and APIs and mashing them up together into a solution that's instantly ready to share with the world.

That's why we added AI coding, so that whenever you need to do something outside of interface, API calls, or simple variable definition, you can do it all, fast and easy, with the included AI coder.

Of course, if you are familiar with Javascript, you can add your own code in here as well.

You start the same way, by adding a variable:

Then, click on AI / Code — the interface transforms into this:

Based on the input type you need, enter a real sample input, e.g. 7. You may also ask AI to generate some synthetic input for what you need:

Then, ask AI to write the code that produces what you need:

You will usually work with AI to refine the output until it produces what you need, or if you'd like you may edit the code directly in the editor.

This is the very process we went through to generate the code in our ai variable. We replaced the sample input 7 with the input we collect from users ${entry} , and are running this variable only when users select AI Coding:

When users select AI Coding, we extract the results directly from the object returned by the ai object:

{
  "value": 7,
  "sequenceString": "1, 1, 2, 3, 5, 8, 13",
  "sequenceArray": [
    1,
    1,
    2,
    3,
    5,
    8,
    13
  ]
}

The Fibonacci value if using AI Coding comes from the ai variable, otherwise from the calculated field:

Likewise for the string list:

And likewise for the array (arrays are more interesting, you can do more things with them):

The end result is the same, but much faster since it's running straight code vs a logical abstraction: