Tema 10 · Productividad

Comparación de Directorios y Navegación Sincronizada

Aprende a usar la Comparación de Directorios y la Navegación Sincronizada en FileZilla para detectar al instante archivos modificados o faltantes entre local y producción.

Filtros de Exclusión: Ignorar .git, .env y node_modules Edición Remota en Vivo: Vincular FileZilla con Visual Studio Code

¿Qué es la Comparación de Directorios?

Cuando trabajas en un proyecto con cientos de archivos y necesitas saber exactamente qué páginas o estilos modificaste en tu PC y cuáles faltan en el servidor, no tienes que revisar fecha por fecha.

FileZilla cuenta con una función nativa de Comparación de Directorios (accesible con el atajo Ctrl + O o en el menú Ver ➔ Comparación de directorios ➔ Activar).

El Código de Colores de la Comparación

Color Visual Significado en FileZilla Acción Típica del Desarrollador
Verde El archivo solo existe en un lado (por ejemplo, creaste una nueva imagen en tu PC que aún no está en el servidor). Subirlo al servidor o borrarlo si es obsoleto.
Amarillo El archivo existe en ambos lados, pero el tamaño o la fecha de modificación son diferentes. Inspeccionar cuál es la versión más reciente antes de sobrescribir.
Sin Color Los archivos son 100% idénticos en tamaño y fecha. Ninguna; están sincronizados.
💡 Tip de Productividad: En Ver ➔ Comparación de directorios, activa la opción "Ocultar archivos idénticos". La interfaz esconderá todo lo que esté al día y solo te mostrará los archivos pendientes de sincronizar.

Navegación Sincronizada: Moverte en Espejo

La Navegación Sincronizada (en el menú Ver ➔ Navegación sincronizada) vincula el explorador local con el remoto:

  • Si en el panel local entras a assets/css/, el panel remoto entrará automáticamente a assets/css/.
  • Si subes un nivel hacia atrás, ambos paneles retroceden al unísono.
  • Esto elimina el riesgo de subir un archivo CSS dentro de la carpeta equivocada de imágenes o scripts.

⚡ Activación Permanente de Navegación Sincronizada en un Sitio

Configuración dentro del Gestor de Sitios para activar el modo espejo automáticamente cada vez que conectas:

sitio-sincronizado.xml
Solo lectura 
<!-- Pestaña Avanzado del Gestor de Sitios -->
<Server>
    <Name>Academia Kilopolis - Producción</Name>
    <Host>sftp.kilopolis.com</Host>
    <Port>22</Port>
    
    <!-- Rutas espejo equivalentes -->
    <LocalDir>C:\xampp\htdocs\kilopolis\</LocalDir>
    <RemoteDir>/var/www/html/kilopolis/</RemoteDir>
    
    <!-- Activar navegación sincronizada obligatoria -->
    <SyncBrowsing>1</SyncBrowsing>
    
    <!-- Comparación de directorios activa por defecto -->
    <DirectoryComparison>1</DirectoryComparison>
</Server>
🧠
Mini-Quiz de Retención
Comprueba tu comprensión antes de pasar a la siguiente lección
1 Pregunta
Pregunta 1
¿Para qué sirve activar la opción "Ocultar archivos idénticos" durante una Comparación de Directorios en FileZilla?
🦉
¿Tienes dudas con este tema?
Sócrates AI puede darte analogías y explicarte este código paso a paso.

🚀 ¿Quieres dominar Manual de FileZilla: FTP, SFTP & Despliegue Web y crear proyectos reales?

Aprende arquitectura limpia, desarrollo web moderno, buenas prácticas y despliegue en producción con nuestro Bootcamp Fullstack Developer con mentorías en vivo.

Conocer el Bootcamp

🏛️ Autoría y Propiedad Intelectual: Obra educativa original de David Amador para Kilopolis Academia (Solucionáticos), estructurada sobre las especificaciones y estándares abiertos del W3C, el estándar vivo de WHATWG y la documentación oficial de código abierto. © Todos los derechos reservados.