Skip to main content

Happy to see you here!

Noodl is a low code web app builder that will have you creating applications faster and smarter. It's a visual development environment that you don't need any previous coding skills to start learning. It's also great for developers who already know how to code as you can easily mix in JavaScript when appropriate.

Building User Interfaces

Visual nodes

Learn how to to place and edit visual elements using Noodls node model

Components

Learn how to create visual components that are reusable

Layout

Learn how to create layouts and group content using visual nodes

Responsive Design

Learn how to to build responsive layouts and components

Style Variants

Learn how to define style variants for visual elements

Visual States

Learn how to style hover, focused, and other visual states on UI elements

States Node

Learn how to use the States node to create UI states, animations and more

Scrolling Content

Learn how to set up scrolling containers and pages

Modules and Prefabs

Get pre-made components, third-party-services, and new capabilities with modules

Figma Plugin

Turn designs in Figma into Noodl nodes

Working with data

Making Connections

Learn how to make data connections between nodes.

Variables

Learn how to store data locally in your app using variables

Objects

Learn how to store objects of data locally in your app

Arrays

Learn how to store multiple objects of data using arrays

Lists Basics

Learn how to generate lists of UI elements from data

UI Controls and data

Learn how connect UI Controls to data nodes to create forms and more

External Data

Learn how to work with external data using REST APIs

Navigation

Basic Navigation

Learn how to create pages and how to navigate between them

Multi Level Navigation

Learn how to set up a multi-level-navigation system

Encoding Parameters in URLs

Learn how to pass parameters in the URL when navigating between page

Popups

Learn how to display popups on user interactions

Component Stack

Learn how to create a wizard flow using a Component Stack

Working with cloud data

Creating a cloud service

Learn how to set up a cloud service for your App, to store and read persistant data

Creating a class

Learn how to create a class for storing data records in a cloud service.

Creating new database records

Learn how to store a data Record in a cloud service.

Quering records from a database

Learn how to query record from a database to your app

Updating records

Learn how to update existing records in a database

Filter database queries

Learn how to filter database queries

Record relations

Learn how to create relations between records in a database

Access Control

learn how to limit access control to records to certain users.

Importing and exporting data

learn how to import and export data to/from your cloud services database.

Visualizing Data

Using the Table component to visualize data

Learn how to use the Table node and Query Records to display data in a table.

Adding pagination to the Table component

Learn how to use the Pages And Rows component to paginate the data in your Table.

Filter your Table data

Learn how to use the Filter prefab to filter out data from a Query Node and display it in a Table.

Styling the Table

Learn how to make style changes to the Table prefab.

Building business logic

Client Side Business Logic with Nodes

Learn how to work with logic nodes for your frontend

Javascript in Noodl

Learn how to use Javascript in Noodl and combine nodes with code

Client Side Business Logic with Javascript

Learn how to use Javascript for custom logic

Custom UI Components

Learn how to create your own re-usable components

Events

Learn how to work with events in Noodl

User Management

Creating users in Noodl

Learn how to create user accounts in your app

Cloud Functions

Introduction

Start learning how to build logic that runs in the cloud.

Email Verification

Learn how create signup flows and more.

Scheduled Jobs

How to do scheduled jobs using cloud functions.

Logging and Debugging

How to log and debug your cloud functions.

Javascript

How to write Javascript in cloud functions.

Collaboration

Version Control

Learn how to use Noodls powerful version control features based on Git

Migrating from Noodl hosted Git

Projects created with closed source Noodl need to be migrated for collaboration to work

Deploying and hosting apps

Using a self hosted cloud service

Learn how to create a self hosted cloud service through a Docker Container

Deploying to iOS and Android

Learn how to deploy your project as a native app

Self hosting your Noodl Frontend

Learn how to deploy your project to a local folder for Self Hosting

All videos

Using the Noodl Figma plugin

This video shows how to use the Noodl Figma plugin.

06.56

Watch video

Building AirBnB Clone

Casually building an AirBnB clone and testing some new upcoming features of 2.8.2

2:09:22

Watch video

Noodl 2.8 release overview

A look at the new features of 2.8 most norably cloud functions.

04:15

Watch video

Noodl Basics - Visual States

Learn how to use Noodl visual interaction states.

1:54

Watch video

Intro to cloud services

Continue the learning journey from the intro lessons in this video guide.

22:08

Watch video