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
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
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 backend
Learn how to set up a backend for your App, to store and read persistant data
Creating a class
Learn how to create a class for storing data records in a backend
Creating new database records
Learn how to store a data Record in a backend
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.
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
Zapier
Learn how to connect Noodl to Zapier for task automation more
User Management
Learn how to use Noodls built in User Management nodes to create signup flows and more
Collaboration
Version Control
Learn how to use Noodls powerful version control features based on Git
Deploying and hosting apps
Sandbox Deploy
Learn how to deploy your app to a Noodl sandbox domain
Deploying to custom domains
Learn how to deploy your app to custom domains
Using a self hosted backend
Learn how to create a self hosted backend 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
Deploying as a micro frontend
Learn how to deploy your app as a micro frontend, part of a container application.
All videos
Using the Noodl Figma plugin
This video shows how to use the Noodl Figma plugin.
06.56
Using the sign-up template
Learn how to make a complete sign-up flow, including email setup for account validation and password recovery.
19.55
Tab Navigation Template
Learn how to build a tab menu that let's the user navigate between different pages.
02.38
Star Rating Component
Learn how to build an animated star rating component from scratch.
07.10