Features Pricing Docs Community Blog Account

Introduction to Wappler

Wappler's User Interface
Resources and Tips for Beginners to Wappler

Getting Started

Wappler's User Interface
Wappler Shortcut Keys
App Connect Introduction
Bootstrap Integration
Using the File Manager
Using the Design Panel
Using the CSS Styles Panel
Setting Up a Lightweight Dev Environment with NodeJS and SQLite
Migrating Dreamweaver Site Definitions into Wappler

Project Manager

Create Local Project
Switch Projects
Remove Projects
Project from Git Repository
Extensions Channels
Reset Frameworks

How-To Guides

App Connect + JS

Bootstrap 4 & 5 Visual Designer

Bootstrap Layout
Using Bootstrap with Custom Paths
Bootstrap Typography and Text
Creating a Bootstrap 5 Navbar
Creating Offcanvas Sidebar with Bootstrap 5
Navigation Align Options
Bootstrap Cards
Bootstrap 4 Forms
Bootstrap 4 & 5 Modals
Using Bootstrap 5 Placeholders
Theme Manager
Theme Manager - Advanced Options
Using the Theme Manager with Bootstrap 5
Converting Bootstrap 4 pages to Bootstrap 5

Image Galleries and Animations

Applying a Page Preloader

Front-end Components

Using the Date Range Picker with Insert and Update Record
Using Time Picker with Date Picker Component
Using Date Range Picker with Dynamic Values
Getting Started with App Connect Event Calendar
App Connect Calendar Dynamic Events
Using the Autocomplete Component
Displaying a Confirmation Dialog on Form Submit
Deleting Database Records with Confirmation
App Connect Calendar Dynamic Events
Using Summernote WYSIWYG Editor
Introduction to App Connect Flow
Using the Toggle Component
Using the Tagify Component
Custom Content for Tagify Lists
Inserting Tagify Values into a Database
Using Tagify with Multi References
Tagify - Creating New Tags and Storing them in the Database

Server-side Components

Debugging Server Connect Errors
Connecting to a Database
Creating Database Queries
Creating Custom SQL Queries
Database Single Query
Using Nested Queries with the Database Query Builder
Advanced Multi Level Nested Queries with the Database Query Builder
Displaying Dynamic Data on your Pages
Filtering Database Query with a Text Input
Filtering Database Query with an URL Parameter
Dynamic Select Menu
Applying Dynamic Paging
Dynamic Sortable Table
Displaying Record Details with the Data Detail Component
Loop Through Database Records with the Data Iterator Component
Insert Database Record
Get Inserted Record ID
Sending a Value for Unchecked Checkbox on Database Insert / Update
Delete Database Records
Sending Form Data to Email
Filtering Database Query with Multiple Checkboxes - #5 by Freddy_Blockchain
Dynamically Check Multiple Checkboxes
Server Side Includes (SSI)
Using Session Variables
Generating an unique UUID identifier
Using Set Value in Server Connect
Creating Reusable Actions with Server Connect Library
Using Globals in Server Connect
Join Results of 2 Data Collections
Using Data Transformations in Server Connect
Working with Server Connect Array Lists

Form and Data Validation

Applying Validation to Your Forms
Check if a Database Record Already Exists Before Inserting a New Entry

File Management

Uploading Single File To Your Server
Adding Progress Bar to Upload Form
Inserting Uploaded File Names in a Database
Uploading Multiple Files To Your Server
Inserting Multiple File Names in a Database
Show Image Preview Before Upload
Listing Files From a Folder on Your Server
Resize Image and Create a Thumbnail on Upload
Using the Dropzone Component
File Downloads with Server Connect
Custom File Downloader with Controls and Progress Bar

Security and Login

Setting up Site Security Settings
Login - Create a Working User Login Page
Using Argon2 Secure Hashes
Security - Restricting Access to Your Page
Security - Secure your Server-Side data
Logout - Create a Working User Logout Button
Getting Details of the Logged In User and Binding them to your page
Logged User Session Name
Password Reset Functionality: Part 1
Password Reset Functionality: Part 2
Register New User and Auto Login on Success
Redirecting on Login Based on User Roles
Using OAuth2 Connector with Facebook
Using OAuth2 Connector with Google

Cookies, Sessions and Local Storage

Using Cookie to Show Modal Once
Passing Values Between your Pages
Working with Arrays
Creating a Cookie Consent Alert
Creating a Shopping Cart with the Data Store Component

API and JSON

Working with JSON Data
Using API Data Source
Data Types and Binding
Caching API Data
API Connector components, how to use and connect REST/Curl API's

Mobile Apps

Setting Up a Mobile Project with Capacitor
Framework 7 - Including the Framework on your Mobile App
Creating Desktop Apps
Using Dynamic Data in Desktop and Mobile Apps
Mobile Apps: Routing with Bootstrap
Using Local Databases in Mobile and Desktop apps
Using Capacitor Camera Plugin

Routing and URL Rewrite

URL Rewriting with Wappler
Creating Single Page Apps (SPA)

Ecommerce

Getting Started with Stripe Integration in Wappler
Stripe Elements Overview
Creating a Stripe Buy Button
Creating Stripe Pricing Tables
Using Stripe Embedded Checkout
Getting Started with Stripe Webhooks
Stripe Checkout with Custom Products
Stripe Subscriptions
Stripe Custom Checkout Forms
Stripe Integration Part 1 - Customer Creation
Stripe Integration Part 2 - Listing Customers
Stripe Integration Part 3 - retrieving a customer object
Stripe Integration Part 4a - The basic Payment Action - App Connect Page
Stripe Integration Part 4b - The Basic Payment Action - Server Connect Page
Stripe Integration Part 5 - Adding shipping Details to your checkout
Introduction to custom checkout module

Git and Version Control

Version Control with Git
Git Branches
Git Remote Repositories
Git Powers - Going back in time
Connecting to GitHub, Gitlab or BitBucket
Creating a Wappler project based on existing Git Repository

NodeJS

Node.js Integration in Wappler
Creating template based pages and layout in Wappler with NodeJS
Building SPA pages with NodeJS
Using Partials with NodeJS
Sever Side Rendering with NodeJS
Using Server Connect Data for Server Side Rendering in NodeJS
Applying Security to your NodeJS pages
Creating a NodeJS project with Docker
NodeJS FTP deploy on shared hosting with Plesk and cPanel
Realtime Data Update with NodeJS and WebSockets
WebSockets - Realtime Messaging
Building a Real Time Chat Application

Database Manager

Creating Database Connections with the Database Manager
Creating Database Relations with the Database Manager
Editing Database Data with the new Database Manager
Creating Sub Tables with Database Manager
Using Multi References in the Database Manager

Hosting and Cloud Platforms

Managing Cloud Servers with Resource Manager
Understanding SSH Keys: Enhancing Server Security and Access Control
Using a Single Local Database Server for all Your Projects
Using Managed Databases with the Resource Manager
Managing SSH Keys with Resource Manager
Use SSH for Remote Docker Targets
Installing Shared Services on Remote Servers
Installing and Using Redis for Multiple Projects
Free Google Firebase Hosting in Wappler!
Deploying your Web Sites/Apps to Heroku
Setup AWS hosting with Docker
Setup S3 on AWS
Setup S3 on Digital Ocean Spaces
Using S3 Connector
Roll your own PaaS - Heroku alternative (Part 1)
Roll your own PaaS - Heroku alternative (Part 2)
Setup AWS hosting with Docker
Using App Connect S3 Upload
Using Elastic IP with Amazon AWS
Remote File Manager for Docker
Connecting existing servers in Wappler for docker deployments
Creating a Free Server with Oracle Cloud Always Free

Cookies, Sessions and Local Storage Docs

Discuss

Cookies, Sessions and Local Storage Index

Learn how to manage Cookies, Sessions and Local Storage.

Cookies, Sessions and Local Storage Docs

Using Cookie to Show Modal Once
Passing Values Between your Pages
Working with Arrays
Creating a Cookie Consent Alert
Creating a Shopping Cart with the Data Store Component