The Interface
Wappler's interface is minimal and easy to navigate and use.
The toolbar on the left contains buttons which allow you to open/close the File Manager, Server Connect and Find & Replace panels located at the top and Project Manager, Options and Your Account details at the bottom:
The top toolbar contains tools and options for changing between Design and Code view, changing screen size options and Undo/Redo buttons:
The right panel allows you to select an element and edit its properties using the dedicated smart properties inspector or the Visual CSS Editor. Also you can add, delete, duplicate or remove elements here using the App Structure tree or DOM tree:
At the bottom of the screen you will find the publish panel and the console. Here you can define your project settings, targets, server model settings and publish it to multiple targets:
The most important part of Wappler screen is in the middle, where you see your design rendered. Here you can see how your website or mobile app looks, you can visually add elements (inside, before or after) the selected element, duplicate whole blocks of content or delete anything from the page or app layout.
