Uso de Git en Dreamweaver

Dreamweaver es compatible con Git, un sistema de control de versiones de código abierto distribuido para administrar el código fuente. Con la integración de Git en Dreamweaver, puede trabajar de forma independiente en su código desde cualquier lugar y combinar más tarde sus cambios en un repositorio central de Git. Git ayuda a seguir todas las modificaciones de los archivos y, además, le permite volver a las versiones anteriores.

Los repositorios de Git también son útiles al trabajar en equipo, ya que Git permite crear y mantener ramas con facilidad. Por ejemplo, para un diseñador que desee trabajar en un cambio de diseño del sitio. Al mismo tiempo, si otro miembro del equipo va integrando solicitudes de cambio para el mismo sitio, ambos pueden trabajar de forma independiente usando Git. En este caso, ambos pueden crear independientemente una rama y realizar sus cambios en sus repositorios locales respectivos. El repositorio local contiene el historial completo de todos los cambios que haya realizado en la fuente. Puede realizar una pausa y combinar los cambios con el repositorio central en cualquier momento. La combinación asegura que el repositorio central tenga siempre el código más reciente, incluyendo los cambios de ambos.

Continúe leyendo para saber cómo empezar a utilizar Git en Dreamweaver.

Si usted es un nuevo usuario de Git, en primer lugar debe descargar un cliente de Git y crear una cuenta de Git. Es esencial un cliente Git para poder usar Git desde Dreamweaver.

Si usted es un usuario que ya tiene una cuenta de Git, inicie sesión en su cuenta. Asegúrese de haber descargado el cliente de Git en su sistema. 

Para comenzar a trabajar con Git en Dreamweaver, siga estos pasos:

Panel Git

Se recomienda instalar el cliente Git con los valores de configuración predeterminados. Posteriormente, Dreamweaver toma automáticamente la ruta al archivo ejecutable.

Ahora puede iniciar Dreamweaver y asociar su sitio a un repositorio Git.

Dreamweaver admite operaciones de Git mediante el panel Git (Windows > Git). Como usuario de Dreamweaver, puede utilizar este panel para realizar operaciones comunes de Git, como confirmar, insertar, extraer y localizar.

Asociar su sitio con Git

Para empezar a utilizar Git en Dreamweaver, deberá asociar primero el sitio de Dreamweaver con un repositorio Git. Un repositorio Git es como una carpeta que puede crear para que le ayude a realizar el seguimiento de los cambios en el archivo. Puede tener cualquier número de repositorios Git en su equipo. Cada repositorio de su sistema es independiente. Es decir, los cambios guardados en un repositorio Git no afectan al contenido de otro.

Puede asociar su sitio web a un repositorio, ya sea creando un repositorio o clonando un repositorio existente. Al inicializar o crear un repositorio, se crea un repositorio Git vacío en el directorio de trabajo actual, con un archivo .gitignore en la carpeta.

No obstante, si clona un repositorio Git existente, todos los archivos del repositorio principal se clonarán en su sistema local.

Continúe leyendo para obtener información sobre cómo inicializar un repositorio Git o clonar un repositorio.

Inicializar un repositorio Git

Cuando comience a trabajar con Git en Dreamweaver, el primer paso será crear un repositorio. Al inicializar un repositorio Git para el sitio, se crea un repositorio Git donde puede añadir los archivos asociados al sitio de Dreamweaver.

Clonar un repositorio existente

Si ya está trabajando con un repositorio Git existente alojado en Github o Bitbucket u otros servicios de alojamiento populares, puede realizar el siguiente procedimiento para clonar el repositorio desde Dreamweaver. Al clonar un repositorio existente, se crea una copia del repositorio de destino en el sistema local.

Usar Git para control de versiones

Ahora que ha asociado su sitio de Dreamweaver con un repositorio Git, podrá ver los archivos en Git desde el panel Archivos (vista de Git). Git categoriza los archivos en su repositorio local como:

• Archivos sin seguimiento: archivos que no ha confirmado en el repositorio Git al menos una vez. Después de inicializar un repositorio Git, los archivos no tendrán seguimiento hasta que los confirme.
• Archivos sin modificar: archivos que no se modifican.
• Archivos modificados: archivos que se editan.
• Archivos en escenario: archivos que se modifican y que están listos para confirmarse.

Con Git, puede realizar un seguimiento de las modificaciones de los archivos. Al modificar los archivos en su sistema local, los archivos modificados aparecerán en un color diferente en el panel Archivos. Cuando haga doble clic y abra el archivo en la Vista de código, también podrá ver la marca del medianil frente a las líneas que se han modificado. Puede continuar y confirmar los archivos modificados en Git para sincronizar los cambios.

Al confirmar sus archivos, Git le permite introducir mensajes de registro para cada validación, y revisar los cambios con la función de diferencia. También puede ver el historial de versiones de cada archivo y el repositorio completo.

Continúe leyendo para obtener más información sobre cómo realizar un seguimiento de los cambios desde Dreamweaver, y confirmar sus cambios en Git.

Realizar un seguimiento de los cambios en Git

En el panel Archivos de Dreamweaver, observe el icono Git, que le permite cambiar entre la vista FTP y la vista Git. Haga clic en el icono de Git para cambiar a la vista Git.

Si ha inicializado un nuevo repositorio Git y no ha confirmado los archivos, estos permanecerán sin seguimiento. Sin embargo, si hubiera confirmado sus archivos después de inicializar el repositorio, Git los reconocerá.

Si ha clonado todos sus archivos desde otro repositorio, Git volverá a reconocerlos.

Cuando modifique un archivo y haga clic en Guardar, el panel Archivos mostrará los archivos modificados en un color diferente. Para ver los cambios exactos en Vista de código, haga doble clic en el archivo modificado.

La marca del medianil indica las líneas donde se han realizado cambios. Las marcas del medianil en verde indican el nuevo código añadido. La marca del medianil en amarillo indica el código modificado y en rojo indica una línea de código que se ha eliminado.

Al hacer clic en la marca del medianil amarilla, la aplicación muestra el cambio en el código. La línea eliminada de código aparecerá en rojo, mientras que el código nuevo añadido lo hará en verde.

Observe un símbolo R en la esquina izquierda de las líneas de código eliminadas. Para volver a añadir el código eliminado al archivo, haga clic en el símbolo R.

Use las marcas de medianiles para ver la diferencia y revisar los cambios antes de confirmar los cambios en el repositorio Git.

Vea la diferencia en los archivos modificados

Al abrir el panel Git, puede ver una lista de los archivos modificados. Puede hacer clic en un archivo de la lista y ver los cambios realizados en este después de la confirmación anterior (diferencia). Para ver la diferencia en un archivo, siga uno de estos procedimientos en el panel Git:

• Para previsualizar las modificaciones a nivel de archivo, haga clic en cada archivo. Los resaltes rojos indican la versión anterior, mientras que los verdes indican el cambio que se acaba de realizar.
• Seleccione el archivo para el que desea ver la diferencia. Haga clic en  (icono de Diferencia). Aparecerá el cuadro de diálogo Diferencia de Git con los cambios resaltados en rojo y en verde.

Confirmar cambios

Revertir cambios

Si ya ha confirmado los cambios y desea volver a la versión anterior de un archivo, haga lo siguiente:

Crear etiquetas

Puede crear etiquetas siempre que confirme los cambios en Git. Puede utilizar las etiquetas para marcar confirmaciones importantes. Por ejemplo, un registro de un cambio importante solicitado por un cliente. Las etiquetas actúan para señalar una confirmación específica.

Ver el historial del archivo

Cada vez que confirme un archivo en Git, puede ver el historial del archivo junto con los detalles de la confirmación. Esta posibilidad ayuda a identificar confirmaciones importantes y las etiquetas asociadas a las confirmaciones.

1. En el panel Git, siga uno de estos procedimientos:

• Seleccione el archivo requerido y haga clic en  (icono Mostrar historial de archivos).
• Haga clic con el botón derecho en el panel Archivos y seleccione Historial de archivos.

El sistema muestra el historial de archivos de Git del archivo seleccionado. También puede ver los detalles de la confirmación de este archivo desde el mismo cuadro de diálogo.

Ver historial de repositorio

Además de ver el historial de un archivo en Git, también puede ver los cambios realizados al nivel del repositorio. Puede ver todos los cambios y confirmaciones realizadas al nivel del repositorio. Para ver el historial del repositorio, realice los pasos siguientes:

Usar Git para colaboración

Una de las funciones más especiales de Git son las ramas. A diferencia de la mayoría de los sistemas de control de versiones, una rama de Git es equivalente a una línea independiente de todos sus archivos o código asociados. De forma predeterminada, el repositorio tiene una rama denominada “maestra”. La rama maestra es la principal o definitiva. Puede crear ramas a partir de la maestra y realizar ediciones en cada una de las ramas.

También puede crear una rama a partir de otra rama en la que esté realizando una copia de la rama principal. Puede trabajar de forma independiente en ambas ramas en el mismo repositorio Git. Por ejemplo, puede trabajar en una nueva función para su sitio en una rama mientras atiende algunas solicitudes de cambio en otra rama.

Git también permite combinar ramas si desea incorporar los cambios de la rama actual en una rama de destino. Cuando combina dos ramas, ambas seguirán existiendo de forma independiente. Puede seguir trabajando con las ramas principal y de destino.

En Dreamweaver, cuando muchos desarrolladores y diseñadores trabajan conjuntamente para un sitio, cada usuario puede crear una rama a partir de la maestra y realizar cambios de forma independiente. Cuando sea necesario, pueden combinar fácilmente sus cambios con otra rama y continuar trabajando con las dos ramas.

Para obtener más información sobre ramas creación y gestión de ramas en Git, lea las secciones siguientes:

Crear ramas en Git

Combinar ramas

Trabajo con repositorios remotos

Los repositorios remotos en Git son versiones de un proyecto que se alojan en otra red. Puede acceder a los repositorios remotos creando una conexión con el repositorio. Dependiendo de los derechos de acceso especificados en el repositorio remoto, puede tener un acceso de solo lectura o acceso de escritura a dicho repositorio.

Al trabajar en equipo, los repositorios remotos le ayudan a insertar y extraer datos en otros repositorios. Desde el panel Git en Dreamweaver, puede crear una conexión remota, realizar varias operaciones de Git, como Fetch (localizar), Git Push (inserción de Git), Git Pull (extracción de Git) y Remote Fresh (actualización remota).

Puede leer los siguientes procedimientos, para saber cómo crear y administrar repositorios remotos.

Añadir un repositorio remoto

Puede agregar un repositorio remoto para compartir archivos y el progreso del trabajo y acceder a los archivos del proyecto alojados en otra red. Al añadir un repositorio remoto, se establece una conexión remota con el repositorio de destino. Dreamweaver le permite crear repositorios remotos desde el panel Git.

Antes de añadir un repositorio remoto, asegúrese de que el otro repositorio tenga habilitada la configuración pública.

Gestionar repositorios remotos

Después de añadir un repositorio remoto y establecer una conexión, puede obtener y extraer los archivos del repositorio remoto en su repositorio local. También puede insertar sus archivos en el repositorio remoto. Sin embargo, primero debe localizar los archivos en el repositorio remoto antes de realizar una acción Git Push por primera vez.

Recuerde confirmar todos los archivos en el repositorio local antes de intentar moverlos. Si su repositorio local tiene archivos en escenario, la operación Git Push no se realizará correctamente. 

Puede realizar las siguientes operaciones de Git desde Dreamweaver:

Fetch all (localizar todo)

Haga clic en  para buscar todos los archivos de todas las conexiones remotas. Se recomienda que realice una operación Git Fetch (localización) antes de realizar Git Push (recuperación) o Git Pull (extracción). Esta acción solo localiza los archivos del remoto y no modifica el repositorio local.

Extraer archivos desde el repositorio remoto

Puede extraer archivos desde un único repositorio o un grupo de repositorios. Al hacer clic en el icono Git Pull, el sistema muestra el cuadro de diálogo Git Pull (extracción) con varias opciones.

Insertar archivos en el repositorio remoto

Después de conectar con los repositorios remotos, al modificar y confirmar los archivos modificados, Git registrará estos cambios. El icono Git Push en el panel Git mostrará inmediatamente el número de archivos que se han modificado. Estos archivos ahora se pueden insertar en el repositorio remoto.

Al realizar una operación Git Push, las confirmaciones que ha hecho en el repositorio local se insertarán en el repositorio remoto.

Para mover sus archivos desde Dreamweaver:

Búsqueda de archivos en el panel Git

La barra de búsqueda del panel Git le permitirá buscar archivos usando el nombre de archivo. Esta capacidad es especialmente útil cuando se dispone de un gran número de archivos asociados al sitio.

Para buscar un archivo, escriba el nombre del archivo en la barra de búsqueda. El archivo o los archivos que contengan la consulta de búsqueda aparecen inmediatamente.

Añadir archivos a la lista de elementos ignorados

Si no desea que Git realice ninguna acción sobre un archivo, puede añadir el archivo a la carpeta .gitignore. Git ignorará entonces los archivos de esta carpeta siempre que realice cualquier acción, incluidas las operaciones de confirmar, mover y extraer. Debe confirmar el archivo .gitignore en su repositorio local para que cualquier otro usuario que clone su repositorio también sea consciente de la existencia de los archivos en la carpeta .gitignore.

Para añadir archivos a .gitignore, vaya al panel Archivos en Dreamweaver. Seleccione y haga clic con el botón derecho del ratón en el archivo que desea que ignore Git, y seleccione Git > Añadir a .gitignore.

En cualquier momento, si desea eliminar un archivo de .gitignore, seleccione el archivo desde el panel Archivos. Haga clic con el botón derecho del ratón y seleccione Git > Quitar de .gitignore.

Asegúrese de confirmar el archivo .gitignore en los repositorios locales y remotos después de modificar este archivo.

Acceder a Git a través de la línea de comandos

En las secciones anteriores de este artículo, habrá aprendido a utilizar el panel Git (IU) para llevar a cabo tareas como asociar un repositorio Git a su sitio, crear y administrar conexiones remotas, insertar archivos en un repositorio o extraer archivos desde un repositorio. También puede realizar las siguientes acciones y mucho más utilizando comandos git.

Para realizar cualquier operación Git usando el terminal, siga uno de estos procedimientos:

• Haga clic en Ventana > Git y, a continuación, haga clic en el icono Abrir consola de bash/terminal.
• En el panel Archivos, cambie a la vista Git. Haga clic en el icono Abrir terminal Git al lado de la lista desplegable de repositorios.

Para ver los comandos git más comunes, consulte la Hoja de referencia de Git. 

Al realizar determinadas acciones como inicializar un repositorio Git desde la línea de comandos, estas acciones se reflejan también en la interfaz de Dreamweaver.

Sin embargo, también puede modificar archivos utilizando la línea de comandos cuando la aplicación Dreamweaver esté cerrada. En ese caso, aparecerá el siguiente mensaje la próxima vez que inicie Dreamweaver:

Establecer preferencias de Git en Dreamweaver

Las preferencias de Git en Dreamweaver le permiten definir algunos ajustes para utilizar Git en Dreamweaver. Puede utilizar el cuadro de diálogo Preferencias para definir las preferencias de Git, como la ruta al terminal, los ajustes de tiempo de espera, etc.