Dashblock is the easiest way to automate websites without coding... but how to do so?
When you create a new Project, Dashblock's editor opens and you get a brief description on its components.
Here is a sum-up of the different spaces :
the editor's header on the top ;
the apps sidebar on the left ;
the blocks playground at the center ;
the block configuration form on the bottom right ;
the browser preview on the top right.
Let's review each one of those spaces.
The Editor's header
The editor's header contains Project level information and actions.
> On the left side you will find :
A "back" arrow to go back to your workspace
Your Project metadata : logo, name and description (all those fields are editable)
> On the right side you will find :
Integratebutton to deploy your Project and start using it by calling a REST API or using our Zapier App
A "New Automation" button to add an automation (the blue block in which you drop the grey ones) to your Project.
The Apps bar
There you can choose the Apps you will use.
In the App bar, you will find :
> An app called "Built in" :
When clicking on it, a drawer with blocks will open. You can drag and drop those blocks in the playground to build your automation.
> A "+" button to add new Apps in the bar :
When clicking on it, a modal with different Apps will open. You can add whatever App you like from the catalog, and even use your (published) projects as Apps.
The blocks playground
This is the space in which you connect blocks together, to define and organize the different steps of your automations.
In an automation, the different blocks need to be connected vertically, from top to bottom, following their execution order.
The block configuration form
Once you added a block to your action, you will need to configure it.
You can do so using the configuration form which contains all the navailable options.
The configuration form has also a drawer which opens automatically when filling values and contain the previous blocks' outputs (exactly like when you build a Zap).
After connecting and configuring your block, you will need to apply it. This will execute the action in the browser preview and let you access the outputted data (if any).
The browser preview
This is where you will see the browser actions applied on the target website.
In some case, you will need to select element directly on the webpage to configure blocks such as
Collect data etc.
It is also pretty useful to get a visual feedback of your automation on the targeted website.
You can maximize the screen at any time by clicking on it, and even interact with the website (click, scroll, etc). However, it worth noting that those interactions are not recorded and will not generate new blocks (for the moment).