Getting Started with Low-Code / No-Code Application

Development
The Case for Application Development
(LCNC) platforms can remove many of the barriers related to code and coding skills when it
comes to application development.
As a citizen developer, helping you to understand the fundamentals of application development
will enable to you better estimate the feasibility, prerequisites, and resources needed to build
different types of applications, making your activities more productive and impactful.

What is Low-Code/No-Code Application Development?

"low-code" uses a both traditional programming language-based environments and no-code

platforms.

Characteristics of LCNC Application Development Platforms

 Visual drag-and-drop based editing for the user interface, also called "what you see is what
you get" or WYSIWYG
 Visual drag-and-drop editing for workflows and logic
 Rich preview capabilities to easily see the app you're developing as it runs on a browser or
a device
 Visual tools for working with data
 A library of pre-built components and assets to speed up development
 An integrated developer experience, where the majority of the tools can be found within a
single environment

LCNC technology is relatively new to the enterprise, and it can be recapped as follows:

 A no-code platform replaces traditional programming languages with a suite of visual

development tools.
 A low-code platform mixes aspects of traditional development environments and no-code
environments.
 In principle, low-code/no-code tools are capable of exactly the same end results as
traditional development tools.

Introduction to Application Development Structure and Design

 Application development structure and design has evolved over several decades to create
a common set of areas in which we think about dividing the process and work to create an
app.
The Three Main Areas of App Development: User Interface, Logic, and Data
We'll divide application development into three main areas:

1. User Interface (UI), which will cover what the user of our application is going to see and
what they will be able to do.
 2. Logic, which will cover how the application works and how we apply the business rules that
our application should follow.
3. Data, which will cover how information inside the application is structured and how it is
stored and retrieved

What the User Interface Allows the User to See and Do

This involves many concepts for putting things on the screen. They include views, navigation,
components, and the composition of components. 

Putting Things on the Screen

Development environments are typically equipped with a set of tools for creating a UI. This
includes a way of defining a set of different views for different parts of the application, as well
components to represent everything from text paragraphs to buttons.

A UI not only defines the elements that can be seen, it also defines some of the basic interactions
in the app, for example, a clickable button or a dialog that appears on top of some other content.

Important – Consistency is Key for the UI

"out-of-the-box" service is an advantage for ensuring that your UI is consistent.

What does consistent mean? It means that when we use an app, as users, we expect it to behave
like other apps we’ve used in the past. It also means that the app is familiar to the user as they
move through different parts of it.
This consistency reduces the cognitive load on the user, and contributes to a more comfortable
experience with the app.
Views Are Based on Clear Functional Distinction
Some tips for planning your views include:

 Write a list of all the main user activities, such as "User creates a support ticket".
 Think about how these activities map to views in your app.
 Try to ensure that actions related to one activity are grouped in the same view or views.
 The fewer views you have, the less workload there is in expanding and updating the
application.

Navigation Helps the User Move Between Different Views

Navigation includes moving between views, links, and menus. 
Components (Elements or Artifacts) are Your Building Blocks
Every part of the UI in our app needs to be represented by something. This includes all the
buttons, any text, images, icons, and so on. In application development, all of these individual
elements are represented by components.
The term Components is used in many tools and platforms, but they are also known as elements
or artifacts. They are the same thing, and these components are the building blocks of any UI.
The components cover the most general functionality you need in your app, to give you flexibility in
how you develop your UI.
Composable Components are Your Visual Development Toolbox

 User interfaces of modern apps are made up of views and components.

 The user interface should be consistent so that it is familiar to the user and in line with their
expectations.
 Use views to break up your app into logical sections, which helps you to make the app and
your user to use the app.
 Map user activities so that related activities that user is likely to do at the same time are
grouped in the same view.
 Navigation is not only about the menu navigation, but also about considering every
transition between views and which actions trigger the changes.
 Components, also known as elements or artifacts, are the building blocks that enable visual
development.
 Smaller components can be used to compose larger components, which you will also re-
use to speed up the development of your views.

Turning Business Rules into Application Logic

Logic is what makes your application actually do things. Logic is fundamentally based on the
business rules, and the requirements for those should be well understood during the planning
process. 

Business rules are closely related to software requirements.

Application Logic as a Flow of Events, Actions, and Functions

In traditional development environments, logic is implemented with code and most of the code
deals with the application logic.

On low-code/no-code platforms, logic is often implemented using visual programming techniques.

This approach will present application logic as a flow of events and actions. 

The actions in a logic flow can also be thought of as functions. Functions are the other type of
logic we can have an application. A function is essentially a box in which you may put something,
and then something may come out. 

Logic flows and formula functions are both about creating custom in logic in our app. Logic flows
are built around events and functions as actions.

Variables as Symbols for Data that Changes

A variable is a symbol that works as a placeholder for something, such as a number or expression,
that could change. The changing value of this variable may then change the logic flow.

Bindings Connect Variables to User Interface Components

This binding creates a link between a piece of data, such as our clicks variable and will always
update the UI automatically as the underlying data is updated. This is the way dynamic data is
connected to the UI of the application.

 Logic is what makes your application actually do things.

 Logic is fundamentally based on the business rules, and requirements for those should be
well understood during the planning process.
 To ensure that business rules are appropriately met by the application, the supporting logic
needs to be defined as a flow of events, actions and functions.
 This flow can be simple or branching. It is powered by variables, or changing data, which
then impacts the user interface and experience.
Common Data Types and Their Uses

Text is often also called a "string". Text type data is used to represent any kind of text the
application contains. 

Numbers are used where we need do math with variables.

Boolean or a true/false value. This is the type that expresses that something either is or isn’t true.
This type is used in checks and toggles.

The first of the complex types is a list. A list expresses a list of items, that have some position on
the list. The items can be of any data type, a list may even be a list of lists. List type data can be
processed in loops.

The second complex type is an object. An object expresses a collection of related data. Whereas
a list has items, an object has properties. 

Storing and Retrieving Data

 Data must be structured appropriately in order for your application to know what to do with
it.
 Seeing the real world as data structures is a skill that can only be acquired by spending
time with it. If you find yourself getting stuck, try to organize the information in a
spreadsheet first.
 Simple data is considered text, numbers and Boolean information.
 Text data, often called a string, is used to refer to any text in your app.
 Numbers data may also be further identified as an integer for example, and it is used for the
mathematical calculations with your variables.
 Boolean data represents those with true or false variables as a result.
  Variable data is stored in memory, where it can be accessed quickly, but it is not preserved
for long periods of time.
 Data in a database is slower to access, but is used for more complex data, and it persists
for long periods of time.

Making API Connections for More Data and Actions

APIs are the foundation of how many modern applications are built, because they allow many
different applications to make use of the same centralized resources.

Opportunities with APIs

The opportunities with APIs and building applications are vast. If there’s an API for it, then you can build an
app for it. Whether it is an API for an inventory management system at work, an API for books, an API for
weather, or an API for smart IOT devices, there are many possibilities. 

Challenges with APIs

Connecting to an API might not be a simple task.

Application Programming Interfaces (APIs) enable you to connect your application to other
sources of data, applications and more to fetch and deliver information via a simple URL that leads
to the API.

The opportunities are vast, if anything has an API, you can build an app for it.

The challenges are that, for more complex use cases, you might need to involve the IT
department before you can access an API.

Build Your First Mini Application with SAP App Gyver

In SAP App Gyver we’re going to:

1. Create the first note-taking view and set up the components on the page.
2. Set up some variables for the note title and note content.
3. Bind those variables to the components.
4. Create a database that will house our notes.
5. Create the note listing view and its variables and bindings.
6. Create the logic to save notes into the database and then navigate us to the list view.