AYUDA EN LÍNEA
 WINDEVWEBDEV Y WINDEV MOBILE

¡Nueva funcionalidad de WEBDEV 2024!
Ayuda / Tutorial WEBDEV / Tutorial - Presentación de WEBDEV
  • Lección 1 - Entorno de WEBDEV
  • ¿Qué es WEBDEV?
  • Iniciar WEBDEV por primera vez: página de inicio
  • Entorno de desarrollo
  • Editor
  • Cinta de opciones en detalle
  • WLanguage
  • En resumen

Tutorial - Presentación de WEBDEV

Lección 1 - Entorno de WEBDEV
Abordaremos los siguientes temas:
  • ¿Qué es WEBDEV?
  • Iniciar WEBDEV por primera vez: página de inicio
  • Entorno de desarrollo
  • WLanguage
Durée de la leçon 5 min
¿Qué es WEBDEV?
WEBDEV es un Entorno de Desarrollo Integrado de DevOps destinado a crear sitios de Internet e Intranet en diversos campos: comercio electrónico, multimedia, etc.
Los sitios desarrollados con WEBDEV pueden utilizarse para acceder a información almacenada en bases de datos.
WEBDEV permite crear:
  • 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.
Los diferentes tutoriales le mostrarán cómo crear y mejorar sus propios sitios web (con o sin base de datos) utilizando las numerosas funcionalidades disponibles en WEBDEV.
Iniciar WEBDEV por primera vez: página de inicio
Para comenzar, abra WEBDEV 2024.
Inicie sesión si es necesario.
El entorno de desarrollo se abre. La página de inicio de WEBDEV aparece.
Página de inicio
La página de inicio permite:
  • 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 2024, 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.
Entorno de desarrollo
Abramos un proyecto para descubrir las principales características del entorno de WEBDEV:
  1. En la página de inicio, haga clic en "Tutorial".
  2. En "Tutorial - Discover WEBDEV (Lesson 1 and 2)", haga doble clic en "Full WEBDEV Site - Answers".
    Ejemplos del tutorial
  3. El proyecto correspondiente se abre en el editor. El cuadro de mando del proyecto se muestra en pantalla. El cuadro de mando permite seguir el progreso global de un proyecto a través de varios widgets.
    Cuadro de mando del proyecto

Editor

El entorno de desarrollo de WEBDEV incluye una UI específica y varios editores que permiten crear los distintos elementos de un sitio web: un editor de páginas para crear páginas, un editor de reportes para crear reportes, etc.
Abramos una página en el editor de páginas:
  1. Presione Ctrl + E.
  2. En la ventana que se muestra, escriba 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:
Entorno de los editores
  • 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 es un elemento clave de la interfaz del editor. Puede acceder a todas las opciones de WEBDEV a través de esta cinta.
La cinta de opciones incluye tres áreas:
Cinta de opciones de los editores
Veamos estas áreas en detalle.
Área de botones (1)
Área de botones

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.
Área de pestañas (2)
Área de pestañas
Las diferentes pestañas de la cinta permiten acceder a las opciones de los editores del proyecto actual. Existen varios tipos de pestañas:
  • 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)
Área de opciones
Las opciones de la cinta cambian dependiendo 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).
Las opciones están organizadas por grupos. Cada grupo de opciones tiene un nombre y un iniciador de cuadro de diálogo Iniciador de cuadro de diálogo. Este botón permite realizar una acción específica según el grupo actual: abrir la descripción del elemento actual, abrir la ayuda, etc.
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, en la pestaña "Ayuda en línea", en el grupo "Inicio", haga clic en "Ayuda".
WLanguage
WLanguage es el lenguaje de programación común a WINDEV, WEBDEV y WINDEV Mobile.
Si no está familiarizado con este lenguaje, le recomendamos que siga las lecciones de los conceptos de programación. Estas lecciones presentan los diferentes tipos de variables, principales instrucciones de WLanguage, procedimientos, etc.
En resumen
Hemos cubierto los aspectos esenciales del entorno de WEBDEV. Abrimos un proyecto y una página en el editor. En la siguiente lección, veremos cómo funciona un sitio web estándar y cómo se compara con un sitio WEBDEV.
Hemos terminado la primera lección. No olvide cerrar el proyecto actual:
  1. En la pestaña "Inicio", en el grupo "General", despliegue "Cerrar" y seleccione "Cerrar proyecto".
  2. Guarde los cambios si es necesario.
La página de inicio de WEBDEV aparece.
Tabla de contenidoSiguiente lección
Versión mínima requerida
  • Versión 2024
Comentarios
Haga clic en [Agregar] para publicar un comentario

Última modificación: 05/12/2023

Señalar un error o enviar una sugerencia | Ayuda local