Manual de Usuario

Todo lo que necesitas saber para usar SAVA IDE Web al máximo.

Primeros pasos

Crear cuenta

1. Visita savaide.com/ideweb y haz click en Probar Demo Gratis o ve directamente a savaide.com/ideweb/app.
2. En la pantalla de login, haz click en Crear cuenta. Ingresa tu nombre de usuario, email y contraseña.
3. Al registrarte recibirás créditos demo gratuitos para probar la plataforma.
4. Una vez dentro, verás el IDE completo con el panel de bienvenida.

Tu primer proyecto

1. Abre el Chat IA (panel derecho) y escribe algo como: "Crea un servidor HTTP en Node.js con Express"
2. La IA creará los archivos automáticamente en tu workspace. Los verás aparecer en el explorador de archivos (panel izquierdo).
3. Haz click en cualquier archivo para abrirlo en el editor central.
4. Usa la Terminal (parte inferior) para ejecutar comandos como node server.js.

Interfaz del IDE

La interfaz está dividida en zonas principales:

Editor de código

El editor usa CodeMirror 6, un editor de código moderno con las siguientes características:

• Syntax highlighting para JavaScript, TypeScript, Python, HTML, CSS, JSON, Bash, C#, y más.
• Pestañas: abre múltiples archivos y navega entre ellos con las pestañas superiores.
• Numeración de líneas y plegado de código (fold).
• Buscar y reemplazar: usa Ctrl+F para buscar.
• Autocompletado nativo del lenguaje + autocompletado asistido por IA.

Gestión de archivos

En el explorador de archivos (panel izquierdo) puedes:

• Click derecho en un archivo o carpeta para ver el menú contextual: crear archivo, crear carpeta, renombrar, eliminar, duplicar.
• Arrastrar y soltar archivos desde tu computadora al explorador para subirlos al workspace.
• Los archivos se guardan automáticamente en AWS S3. Cada usuario tiene hasta 100MB de almacenamiento.

Workspaces

Los workspaces son proyectos independientes. Cada uno tiene su propio árbol de archivos.

Terminal

La terminal integrada permite ejecutar comandos directamente en el servidor:

• Muestra/oculta con el botón de terminal en la barra superior o Ctrl+`.
• Escribe comandos y presiona Enter para ejecutarlos.
• El directorio de trabajo es tu workspace activo.
• Soporta comandos como node, python, npm, ls, cat, etc.
• Usa el botón de limpieza para limpiar la salida.

Chat con IA

El chat es la característica principal de SAVA IDE. La IA puede:

• Crear archivos automáticamente en tu workspace.
• Editar archivos existentes con reemplazos precisos.
• Ejecutar comandos en la terminal del servidor.
• Leer archivos de tu workspace para entender tu proyecto.
• Buscar en archivos usando grep y patrones.
• Iniciar servidores y previsualizar tu app.

Cómo enviar un mensaje

1. Escribe tu mensaje en el campo de texto inferior del chat.
2. Presiona Enter para enviar (o Shift+Enter para nueva línea).
3. La IA responderá en tiempo real con streaming. Verás el progreso de las herramientas que usa.
4. Para cancelar una respuesta en curso, presiona Esc o el botón de detener.

Ejemplos de prompts efectivos

"Crea un proyecto completo de una app de notas con React y un backend en Express"

"Lee todos los archivos de mi proyecto y explícame la arquitectura"

"Encuentra y corrige el bug que causa que el formulario no envíe datos"

"Agrega autenticación JWT a mi API existente"

"Crea una landing page profesional con CSS moderno para mi startup"

Modelos de IA disponibles

SAVA IDE soporta múltiples modelos de diferentes proveedores. Selecciona el modelo desde el dropdown en la cabecera del chat.

Modo Pensamiento

El modo pensamiento permite que la IA "razone internamente" antes de dar una respuesta. Esto mejora la calidad en tareas complejas a cambio de más tokens (y créditos).

Adjuntar archivos

Puedes adjuntar archivos al chat para que la IA los analice:

• Haz click en el botón de clip (📎) junto al campo de texto.
• Selecciona uno o más archivos de tu computadora.
• Los archivos aparecerán como badges encima del campo de texto.
• Soporta imágenes (la IA puede analizarlas), archivos de código, documentos de texto, etc.

Historial de chats

Tus conversaciones se guardan automáticamente en la nube (S3).

• Haz click en el botón de reloj en la cabecera del chat para ver conversaciones anteriores.
• Click en cualquier conversación para cargarla.
• El botón + (Nuevo chat) limpia la conversación actual y empieza una nueva.
• Puedes exportar la conversación actual como archivo Markdown con el botón de descarga.

Autocompletado IA

El autocompletado con IA te sugiere código mientras escribes, similar a GitHub Copilot.

• Estado: El indicador ◆ AI ON en la barra de estado muestra si está activo.
• Activar/desactivar: Haz click en el indicador ◆ AI ON en la barra de estado.
• Aceptar sugerencia: Presiona Tab para aceptar la sugerencia completa.
• Rechazar: Simplemente sigue escribiendo o presiona Esc.

Vista previa web

Cuando la IA (o tú) ejecuta un servidor web, el IDE detecta el puerto y muestra una vista previa integrada.

• La vista previa aparece automáticamente como un panel lateral.
• Botón ↻ para recargar.
• Botón ↗ para abrir en una pestaña nueva del navegador.
• Botón ✕ para cerrar la vista previa.
• Si hay múltiples servidores, úsalos desde el botón de Servidores activos en la barra superior.

Tareas (TODOs)

El panel de tareas te ayuda a organizar tu trabajo:

• Abre desde el botón ✓ en la cabecera del chat.
• Agrega tareas manualmente escribiendo en el campo y presionando Enter.
• La IA también puede agregar tareas automáticamente durante su trabajo.
• Haz click en una tarea para marcarla como completada.
• Exporta las tareas como texto con el botón de exportar.

GitHub PR Review

Conecta tu cuenta de GitHub para hacer review de Pull Requests con IA:

1. Haz click en el botón de GitHub en la barra superior.
2. Ingresa un Fine-grained personal access token con permisos de repositorios y PRs.
3. Selecciona un repositorio y PR.
4. La IA analizará los cambios y te dará feedback detallado.

Créditos y pagos

¿Cómo funcionan los créditos?

Los créditos se consumen según el uso de IA:

• Cada token procesado (tanto de entrada como de salida) consume créditos.
• Los modelos más potentes (Pro, Opus) consumen más créditos por token.
• El autocompletado IA también consume créditos cuando está activo.
• Editar archivos, usar el terminal y gestionar workspaces no consume créditos.

Ver tu saldo

Tu saldo se muestra en 2 lugares:

• Badge ● en la barra superior (junto a tu nombre de usuario).
• Indicador en la barra de estado inferior.

Comprar créditos

Haz click en el badge de créditos o en el indicador de la barra de estado. Se abrirá el modal de compra con los paquetes disponibles:

El pago se procesa de forma segura a través de MercadoPago. Los créditos se acreditan inmediatamente después del pago.

Soporte

Si tienes problemas o preguntas:

• Tickets de soporte: Accede al sistema de tickets desde el menú del IDE o desde el botón de soporte en el landing.
• Categorías: Técnico, Pagos, Cuenta, Facturación, General.
• Tiempo de respuesta: Normalmente dentro de 24 horas hábiles.

Atajos de teclado