The builder is the Cook Self Service drag'n'drop application, for building your components.
Structure
Projects are decomposed in 3 stages. The builder is so splitted in 3 main parts :
Projects (Components) / Tables (Controllers & Views) / Pages (Layouts)
Ex:
- My project 1
- My project 2
Project :
This represents your whole component. From there you can generate and download.

Tables / Views / Triad :
Each project contains its own tables. They represent the SQL data structure.

Pages / Layouts :
A layout represent the component template in Joomla.

Hierarchical Tabs
Each tab is child of the upper selected tab. It mean every time you change tab, all bottom contents (bellow the tab) will change.
image example :
- Hello My World (selected)
- Continent
- Continents (invisible)
- Continent (invisible)
- Cities (selected)
Create new file
1. Click on the [ + ] button at the bottom of the files list on the left margin:

2. Enter the name and click on the save icon, or type Enter

2.a Note : At any moment you can edit the name, clicking on the pencil icon.
Pencil icon appears when mouse roll over the file entry.

3, The new project opens.
Properties are empty:

4, Click on the top-right pencil icon to edit the properties of the project.

5. Save the form with the save icon, or type Enter.
Delete / Trash
1. Drag an element to the trash to delete it. Any element with dotted handle can be trashed. (All you can create, you can destruct)
2. Confirm it.

Note : When an element is used on other pages, the trash will advert you before to delete:

Toolbox
The left side margin contains tools (or elements) to drag 'n' drop in your contents (Table, Layout)
Map
- Projects
- Projects (list of projects)
- Account (user account page)
- Tables
- Tables (tables of parent project)
- Wizards
- Data Types
- Pages
- Layouts (layouts of parent table)
- Fields (availables fields from this context)
- Bricks
- Tasks
- Filters
Properties
Every instancied objects has a property icon to edit it.
In this example, editing the 'Name' field instancied in a grid:

You must click the save icon to keep the changes.