Intro to the Dittofi Design Studio (Frontend)
Learn your way around the Dittofi Design Studio.
This is the Dittofi Design Studio.
The Dittofi Design Studio is a visual app builder.
The Studio is split up into five main tabs that are listed down the left hand side of the page. These tabs are designed to help you build custom, high quality apps. There is:
- Page builder. The page builder tab is for the development of your apps user interface.
- Data tables. The data tables tab is for building and managing a data store for your app.
- Backend actions. The backend actions tab is for building your apps backend logic and functionality.
- Custom data models. The custom models tab is for building custom data structures that are used in your app development.
- Web Services. The web services tab is for developing integrations into third party APIs.
We also have several more tools under the wrench icon at the bottom of the page. This include things like:
- Modules. Modules are used to extended functionality in one click.
- Global variables. Global variables are used for managing global settings for your app.
- Templates. Templates are where you can access and edit your app's source code.
As well as being a visual app builder, Dittofi is also an app hosting platform.
To see and test your app running in our hosting environment, click the build code button at the top of the page. This button transforms the visual design of your app into code and deploys it directly into Dittofi’s enterprise hosting environment.
Once your app's code has been generated, you can click on the preview button here to see your app running in Dittofi hosting.
In Dittofi you can build multiple versions of your app. For example, you can create a development version, where you edit and test your app without impacting your live users.
You can also create a production version of your app which is segregated from your test version.
Whenever you make a change to your app, Dittofi will automatically save these changes.
You can then click this build code button to update your app’s code and deploy these changes into your live app hosting environment.
Then, if you go over to your live app, you can click the refresh button, you will see all of the latest changes to your app live.
Dittofi gives you the option to use shortcut keys to super charge your app development. The shortcut keys mimic as closely as possible the design tools that you're most familiar with.