English

Français

🎉 Bienvenido

Introducción a Voltapp

PARA EMPEZAR ⏱

Descubrir las plantillas

Crear su Airtable

Conectar sus datos

Publicar su aplicación

APRENDER VOLTAPP ▶️

Descubrir la interfaz

https://www.youtube.com/watch?v=IGEIBs5xqag

Una vez en el editor, la interfaz de Voltapp se divide en 4 partes principales:

1. La barra de herramientas, que contiene diversas acciones que puede realizar el usuario (como añadir un nodo o publicar la aplicación). Tenga en cuenta que la barra puede cambiar en función de los diferentes modos (que se comentan a continuación)
2. El árbol de proyecto, a la izquierda, representa todos los nodos que componen la app (elementos hiperpersonalizables y combinables como un texto, un botón o una conexión a Airtable). Los nodos se organizan en una estructura de árbol con el nodo de la aplicación como raíz. Cada nodo creado aparece aquí y puede moverse, borrarse o seleccionarse. En el ejemplo anterior puede ver el nodo App, el nodo Section, el nodo Text y el nodo Image.
3. La vista previa en el centro muestra visualmente el aspecto de la aplicación. También es posible seleccionar o modificar determinados nodos.
4. El Inspector de nodos, a la derecha, muestra y permite modificar los atributos del nodo seleccionado. En el ejemplo, se trata del nodo Texto.

Guardar

En Voltapp, el guardado se hace automáticamente por defecto después de cada modificación. Si prefieres guardar manualmente, ve a Menú > Preferencias y desactiva "Activar el guardado automático":

Cada vez que realice un cambio, el botón se volverá azul para indicar que puede volver a guardar.

Si tienes un proyecto grande, o si trabajas con varias personas en el mismo proyecto, te recomendamos que desactives el guardado automático.

Modo gráfico

Puede pasar del modo editor al modo gráfico utilizando los botones correspondientes de la barra de herramientas.

El modo gráfico muestra el gráfico correspondiente al nodo seleccionado. Un gráfico se compone de bloques conectados entre sí, y permite crear lógica relacionada con ese nodo sin tener que escribir líneas de código. Al seleccionar un bloque, su configuración se muestra en el inspector de la derecha, que se convierte en un inspector de bloques (del que se habla más adelante en Un sistema de gráficos para la codificación visual).

Modo de vista previa

En el modo de vista previa puedes probar tu aplicación tal y como funcionará cuando se publique.

Para obtener una vista previa con un dispositivo diferente, haga clic en el botón dispositivo de la barra de herramientas y seleccione "iPhone" en la categoría "Todos".

Cuando se activa el modo de vista previa, se añaden dos nuevos botones a la barra de herramientas:

• Pantalla completa: permite lanzar la vista previa en una nueva pestaña del navegador.
• Debug: muestra una consola de depuración (para comprobar si hay errores en la lógica de datos) con dos pestañas:

La pestaña Variables muestra el estado de tus variables (un concepto que se explica más adelante) en tiempo real mientras pruebas tu aplicación.

La pestaña Log muestra todo el historial de mensajes del bloque de depuración activados en los gráficos de Voltapp para probar su aplicación.