Tutorial - Presentación de WEBDEV

• sitios de Internet e Intranet estáticos. Estos sitios gestionan datos que no cambian (sitio de presentación de la empresa, etc.).
• sitios de Internet e Intranet dinámicos que gestionan datos. Los sitios WEBDEV acceden a todas las bases de datos relacionales y no relacionales disponibles.

El entorno de desarrollo se abre. La página de inicio de WEBDEV aparece.

• ver noticias sobre los productos de PC SOFT,
• crear un proyecto,
• abrir un proyecto existente,
• abrir un ejemplo,
• acceder a los diferentes tutoriales disponibles en WEBDEV.

Si es la primera vez que inicia WEBDEV 2025, aparecerá un asistente de bienvenida:

• Si ha utilizado una versión anterior de WEBDEV, este asistente le ayudará a recuperar las configuraciones anteriores.
• Si es un nuevo usuario, el asistente le ayudará a configurar el entorno. Podrá elegir la configuración de pantalla y configurar los Centros de Control.

1. En la página de inicio, haga clic en "Tutorial".
2. En "Tutorial - Presentación de WEBDEV", haga clic en "Abrir el proyecto de ejercicio".
   
3. El proyecto correspondiente se abre en el editor. El cuadro de mando del proyecto aparece. El cuadro de mando permite seguir el progreso global de un proyecto a través de varios widgets.
   

Editor

1. Presione Ctrl + E.
2. En la ventana que aparece, introduzca el nombre de la página que desea abrir: PAGE_List_of_products.
3. Valide. La página aparece en el editor.

Todos los editores utilizan el mismo entorno:

• Menú del editor (1), que se muestra como una cinta de opciones (veremos cómo usarlo en el siguiente párrafo).
• Editor actual (2) (en este caso, editor de páginas). El editor muestra el elemento que se está creando o editando en modo WYSIWYG (What You See Is What You Get).
• Paneles (3). La UI de WEBDEV incluye varios paneles horizontales y verticales que permiten acceder rápidamente a diferentes tipos de información.
  Por ejemplo:
  • El panel "Explorador de proyectos" (a la izquierda) muestra una lista de todos los elementos del proyecto por categoría.
  • El panel "Buscar - Reemplazar" (que se muestra en la parte inferior) permite realizar búsquedas rápidamente en el proyecto.
  Los paneles se pueden ocultar pulsando Ctrl + W.
• Pestañas de documentos abiertos (4). Estas pestañas permiten ver rápidamente todos los elementos abiertos. Al hacer clic en un elemento, este se muestra en el editor correspondiente.

Cinta de opciones en detalle

La cinta de opciones está constituida por 3 áreas:

• el área de botones, a la izquierda (1).
• el área de pestañas, en la parte superior (2).
• el área de opciones (3).

	El área de botones agrupa los botones de acceso rápido. Estos botones permiten realizar las operaciones más frecuentes, comunes a todos los editores: guardar, abrir, crear, etc. Puede abrir la ventana "Acerca de" desde el logotipo del IDE.

• la pestaña actual, en negrita y subrayada.
• pestañas contextuales con color. Estas pestañas son específicas del elemento actual.
• las otras pestañas.

Área de opciones (3)

Las opciones que aparecen en la cinta de opciones cambian en función de la pestaña seleccionada. Existen varios tipos de opciones:

• Opciones a seleccionar,
• Botones para hacer clic,
• Botones desplegables que muestran otras opciones. Existen dos tipos de botones desplegables:
  • botones desplegables para desplegar un menú,
  • botones divididos que permiten desplegar un menú (haciendo clic en la flecha), o realizar una acción predeterminada (haciendo clic en el ícono del botón).

En los diferentes tutoriales de WEBDEV, hablaremos de pestañas y grupos para referirnos a una opción de menú. Por ejemplo: Para abrir la ayuda, vaya a la pestaña "Inicio", grupo "Ayuda en línea" y haga clic en "Ayuda".