Code Editing
It is the part of the modeling area where the functionality of the page and its elements can be extended. Each element has a list of built-in events depending on the element type.
The code editing area is displayed at the bottom of the page, following a bar with icons. The icon 
in the center of the bar allows you to modify the size of the area, while the icon 
on the far right allows to close it.
Sections
•Javascript code editor of the page: It allows to add and update functions associated with the events of elements or pages.
•Event handler: The event handler is displayed to the right of the code editor, it contains the identifier and the list of events of the selected element. If no element is selected, the list of page events expands.
•Message Monitoring Console: Located below the code editor, this advanced tool facilitates the monitoring and management of messages during development.
Editor Options
Performs the same operation as the preview.
Increases the panel size and covers the page modeling area.
Returns the panel to its previous size.
Changes the style of the code editor to dark mode.
Changes the style of the code editor to the previous mode.
Operations of JavaScript Functions
Associate
The page has JavaScript functions associated with its events defined by default, unlike its elements, which do not have them.
To create and associate a JavaScript function with an event, select the event in the event handler, enabling the new function name to be entered. By default, a name is generated consisting of the element identifier concatenated with the event name. Clicking on the icon 
creates the JavaScript function associated with the event in the code area, and the name of the function is added to the event list.
If the name of the JavaScript function already exists within the code, a number is automatically suffixed to the name.
Select
Selecting a JavaScript function in the event handler positions the cursor over it in the code editor.
Disassociate
To disassociate a JavaScript function from an event, click on the icon 
that is displayed when hovering the cursor over it in the event list. In this way, the association of the function with the event is deleted but it is not deleted from the code.
If the JavaScript function is deleted from the code area, it still appears associated with the event handler. However, the event does not execute any function and does not throw an error.
Message Monitoring Console
You can access this console by clicking on the icons corresponding to the messages, which are located in the bottom bar of the code editor.
If the JavaScript function is deleted in the code area, it is still associated with the event handler; however, the event does not execute any function and does not throw an error.
Upon accessing the console, the messages are displayed in an organized and categorized manner. Details about each message are provided, including its location in the code and possible solutions. The messages are updated in real time, with continuous monitoring that allows you to visualize errors and warnings as they are detected.
Message Types
Syntax Errors: Detects and notifies syntax errors in the code.
Warnings: Highlights potential issues that could affect the performance or quality of the code, providing alerts on aspects that may need attention or review.
Usage Information: Identifies situations in the implementation of methods and functions, offering recommendations to improve the code.
