Wappler 2021 — Year in Review

New technologies, e-commerce integrations and community growth.

Teodor Kuduschiev
Wappler.io
12 min readDec 21, 2021

--

It’s the end of the year again and we are really excited to look back at the most important milestones of Wappler development in 2021.

Our team has been working hard in 2021 integrating new technologies and innovations in Wappler. Below we will summarize the most important achievements of 2021.

January

Bootstrap 5

We integrated the latest version of the world’s most popular front-end open source toolkit.

Bootstrap 5 integration comes with a Bootstrap 4 to Bootstrap 5 convertor. Everything done automatically for you and all the required changes are be applied.

Full Bootstrap 5 support has been added to the Theme Manager. You can enjoy full theming with Wappler’s Theme Manager.

We’ve also added Bootswatch 5, including all themes which are Bootstrap 5 based.

Tabs Management Menu

A new context menu is available for the editor tabs. You can easily manage all the open tabs in a single click.

February

Airtable API

It’s really easy to connect to Airtable API with Wappler. You can connect to your Airtable database and use the data in your API Actions or on your pages:

Image Processing for Node.js

A new Cover Fit image resizing method has been added for Node.js. It allows you to perform smart image resize and supports objects detection.

Homebrew and Scoop Integration

You no longer need to install additional command line programs. Wappler does it automatically for you, using the power of two great installers Homebrew for MacOS and Scoop for Windows.

New Bootswatch Themes

We’ve included 4 new Bootswatch 5 themes — Morph, Quartz, Vapor and Zephyr.

New Docker Hosting Provider — Hetzner

Hetzner — an awesome German hosting provider with great server prices and speed has been added to Docker Hosting Providers list in Wappler.

Database Manager Improvements

The Database Manager has been improved, so that the database schema is loaded fully on demand — without any delays or infinite loaders.

March

Websockets

Full support for Web Sockets bi-directional messaging has been added for NodeJS in Wappler! It offers Server Connect and App Connect integration, which allow you to deliver amazing real time communication solutions.

You can define actions and events for Web Sockets for full asynchronous, two way communication between client and server with messages. Easily Emit, Broadcast or send Direct Messages to the clients in the server.

Thanks to the WebSockets and NodeJS integration in Wappler you can also track the progress of your heavy API Actions, when working with huge amount of data or processing large files.

Mobile Apps Development

We streamlined the process of creating mobile apps and their content pages. Now it’s easier to create your app main page and link your content pages to it, add page transitions and navigate between your pages.

The updated Framework 7 brings new blocks such as the Login Screen, which can be easily used with your Login API Actions.

Stripe Integration

You can use the full Stripe API with 310 Server Connect actions, Webhooks integration and so much more directly in Wappler.
Thanks to the client and server-side Stripe integration in Wappler it’s now easier than ever to add simple buy now buttons, checkout pages and even create entire stores.

The easiest way to get up and running with your product sales is using the client-side checkout options. Add a Buy Now button easily in a couple of clicks.

Build a custom shopping-cart using the Data Store component in Wappler and send your products to the checkout.

You can use Stripe Webhooks to listen for events on your Stripe account so you can automatically trigger reactions. You can easily update customer’s information in your database when a payment succeeds, send emails to the customers or easily perform any other Server Connect action.

Creating subscriptions with Stripe is an easy job! Just define your subscriptions in Stripe Dashboard and copy their Price IDs in the checkout session.

Not using Stripe Dashboard for your products? No problems! You can easily checkout your custom products from your shopping cart or database.

April

Custom Stripe Checkout Forms

You can create your own custom checkout forms for Stripe. Custom forms allow you to fully customize your checkout, branding and style of the page, while the whole payment is securely handled by Stripe.

Data Transformations

New Data Transformation options have been added in Server Connect. Now you can easily combine different data sources, add, rename or remove columns.

Offcanvas Component

The Offcanvas Component allows you to create hidden sidebars for your web sites and apps for navigation, shopping carts, and more which appear from the left, right, or bottom edge of the viewport.

Mobile Apps with Bootstrap

We’ve integrated a special SPA routing in App Connect, so that your mobile Bootstrap based apps feel and act smoothly — just like a native app.

Bootstrap Icons

Bootstrap Icons is high quality, open source icon library with over 1,300 icons. You can use them in any of your projects.

Bootstrap 5 Blocks

You can use the included Bootstrap 5 blocks to quickly build your page layout. Browse the categories and select a block and add it on the page.

App Flows

Using App Flows you can define complex, reusable client side workflows for data processing — just as in Server Connect but client side. App Flows are really useful on complex web apps, where you do a lot of client side processing or on mobile or desktop apps, where no server side is available.

You can easily use your App Flows on different pages, so you no longer have to define the same flow over and over again. Just add the App Flow component on the page and select your flow using the Action Picker.

May

Wappler 4.0 beta 1 — with ElectronJS Integration and Apple Silicon M1 Native Support

In Wappler 4.0 beta 1 we switched our core engine from NWJS to ElectronJS, which brings speed, stability and user experience improvements. Apps like Discord, Twitch, Slack, Figma, Visual Studio Code, Skype and many more, are already using Electron and that makes it the best platform to build Desktop Apps like Wappler.

ElectronJS integration brings native Apple Silicon M1 support, now you can use the full powers of your M1 chip and run Wappler natively.

Wappler 4.0 beta 2, 3, 4 and 5 — Stability and Memory Optimizations

With beta 2,3,4 and 5 we made our Electron integration bullet proof, which means these beta versions brought better performance, stability and less memory usage. Switching between the different panels and projects is lightning fast.

Success Story

The interactive zoo map of Basel Zoo has been built with Wappler.

June

Wappler 4.0 beta 6 and 7 — with New Server Connect Editor

You can open any Server Connect API action in a separate editor tab. This offers you great flexibility in editing Server Connect actions visually on а larger canvas. You can also work on multiple Server Actions simultaneously and save them when needed, just like any other file your are working on.

Wappler 4.0 beta 10 — with New Wappler UI

We’ve redesigned and fine tuned the whole interface. The main icons now more clearly represent their sections and functionality. We added color coding to these icons, as well as to the editor tabs.

July

Wappler 4.0 beta 11 and 12 — with New Gorgeous Wappler UI Themes and Glass Effects

Choose your favorite theme from the 19 available gorgeous themes, including amazing glass effects on menus and dialogs.

You can select any of the available Wappler UI themes, there is theme selector dropdown in the right upper corner so you can easily switch themes.

Amazing modern glass look is available for all menus and and modal dialogs.

Wappler 4 Released!

On July 21, 2020 we released Wappler 4.0 full of new exciting features such as — a New Modern UI, Stripe Integration, Bootstrap 5 Integration, Realtime Data with Websockets, Apple Silicon M1 Native Support, API Actions and App Flows in Tabs, Reusable Global Options, ElectronJS Integration and many updates! All of this and event more, thanks to the great Wappler Community!

September

Lightweight Local Dev Environment

It’s never been easier to setup a local development environment in Wappler and start working on your projects. You don’t need to install and configure any local servers to run your dynamic Wappler web app or site. Use the powers of the integrated in Wappler NodeJS server in combination with a SQLite database.

Toggle Component

The toggle component is a simple, but quite handy component. It can be used to easily toggle visibility, styling, classes of the elements on your pages.

October

Database Manager — JSON Fields Support

We added support for JSON fields in the Database Manager, letting you define arrays of arbitrary length in a single JSON field — from simple arrays to complex structures.

UUID Generator

You can easily generate unique UUID identifier when needed, available as a global option for your API Actions steps.

Database Editor in Tabs

Now you can preview and edit tables data in separate tabs.

Docker Real-Time Debugging

When using Docker you can view the web and database servers logs in real time. These are useful for finding problems in your app.

Server Connect and App Flows Redesigned UI

We’ve simplified the Server Connect and App Flows UIs, by removing the unnecessary steps nodes and also improved their design, based on the feedback we received in our community.

We added a new context menu, which allows you to not only add steps in your API Actions, but also duplicate, remove or disable steps, enable or disable output for single or multiple steps and expand or collapse all child elements.

Success Story

Meet MealPro — a mutli-tenant responsive app built for meal planners.

November

New Native, Resizable Modal Dialogs and Popup Windows

A huge architecture change has been implemented in Wappler. We are now using native popups and dialogs in Wappler. They offer full native OS look and feel.

You can resize the new popup dialogs and also drag them wherever you want on the screen, event on another monitor.

The modal dialogs also have native close and maximize buttons and style based on the OS.

Resizable Expressions Pane

The expressions pane is now resizable, making it easier to work with long and complex expressions.

New UI Icons

The tree views in App Connect Structure, Data Bindings and Server Connect got an UI refresh. Now with new modern collapse and expand icons.

Success Story

We present you the responsive website of the low-code software company Slashash built with Wappler — https://slashash.co/

December

Project Updater

One of the most requested features in our community has been integrated in Wappler — a project files updater. On project open it checks for updated files for all the used frameworks. If there are any updates available they are being displayed in a nice dialog.

You can choose whether to perform updates per framework, update all the files or not to update them.

Argon2 Hashing Algorithm for Nodejs

We integrated a native Argon2 module for Nodejs server model. You can take advantage of the Argon2i and Argon2id algorithms available in Wappler for maximum security.

Success Story

We present you the responsive website of Pukka Travels, built by our power users from Slashash.

But that’s not all — this year our amazing community has grown, reaching 16000 users and the success user stories keep growing!

As we end this year, we are looking forward to expand Wappler even more in 2022 with many updates and amazing new features!

Not using Wappler yet?

Download Wappler, and don’t forget to join our community forum! Share your experience, get help, showcase your work or just have nice chat with others.

--

--