Soy una persona muy visual (irónicamente, también muy corta de vista, pero esto es otra historia). Con lo que prefiero usar herramientas gráficas siempre que sea posible. Esto incluye mis (muy) modestas contribuciones a los prototipos de investigación de mi equipo, todos ellos en Git/GitHub. Hasta el momento, he usado SourceTree como cliente Git para hacer los commits, push, pull,… en los repositorios. Y la verdad es que no me ha ido nada mal aunque su soporte visual es bastante limitado (ver la imagen a continuación) y quería buscar otras alternativas con mejores visualizaciones de la historia del repositorio, sobretodo en relación a escenarios de “branching” complejos como los que tenemos en Xatkit. Hay que tener en cuenta que calcular y visualizar un árbol de commits no es nada trivial. De hecho, hasta Git está mejorando su soporte nativo para esto.

SourceTree Git Client

SourceTree in action

Quiero compartir con vosotros el resultado de mi búsqueda. No prometo que todas las herramientas sean útiles pero, las que no, son como mínimo todas curiosas/interesantes.

Contents

Clientes visuales para Git

Hay muchos clientes para Git (inclusive para gestionar tus proyectos desde el móvil). No hay tantos que pongan la parte gráfica en un primer plano. Mi selección:

GMaster

Gmaster intenta ser tan visual como sea posible. No se limita a ser un simple “wrapper” por encima de la línea de comandos de Git. Al contrario, ofrece un buen número de visualizaciones diferentes, cada una especializada en facilitar una tarea Git concreta. Por ejemplo, puedes utilizar el branch explorer para navegar por el repositorio y hacer el checkout de la versión con la que quieras trabajar. Esta visualización ayuda también a identificar rápidamente los commits que incluyen más cambios al código.

gmaster Branch Explorer

Otra se concentra en mostrar gráficamente las diferencias entre versiones para ayudarte a fusionarlas.

Visual merge with gmaster

Y si quieres, puedes seguir utilizando los comandos textuales de toda la vida. Podrías, por ejemplo, visualizar el repositorio para entender rápidamente el estado actual de las diferentes branches y a partir de ahí empezar a trabajar en modo CLI.

Además, Gmaster es todavía gratuito con lo que no pierdes nada por probarlo.

GitKraken

GitKraken es uno de los clientes Git más conocidos. Viene con muchas funcionalidades e integraciones con herramientas de terceros. Entre las funcionalidades, destacaría la historia visual de commits con la posibilidad de manejar el repo directamente desde esa visualización mediante un simple drag&drop.

GitKraken es gratuito para estudiantes y profesores. Además en su web tienen muchos recursos educativos para aprender Git.

GitKraken client

GitUp

GitUp visualiza claramente el “laberinto” de versiones del repositorio. Cada cambio que hagas se refleja inmediatamente en el grafo. Esto requiere una optimización muy buena del proceso de cálculo para que no se note mucho el “delay” en repositorios grandes (de hecho, dicen ser capaces de visualizar el grafo entero del proyecto Git mismo, con 40.000 commits, en menos de un segundo).

Aún mejor, GitUp es gratis y completamente open source.  Y la guinda del pastel es que en el mismo repositorio encontrarás también GitUpKit, un paquete genérico para construir aplicaciones sobre Git. De hecho, GitUp mismo está implementado como una ligera capa encima de GitUpKit. Si te animas, tú también puedes crear ¡tu propio visualizador de Git!.

Another GitUp screenshot

Herramientas para aprender Git

Si más que trabajar con Git, lo que quieres es aprender Git, esta sección es para ti. Las herramientas en esta sección van a ayudarte a entender como cada comando Git afecta el árbol del repositorio. ¡Juega con Git de forma segura!

Git Gud

Git Gud es un entorno web minimalista donde puedes escribir comandos y ver como a partir de ellos va evolucionando un repositorio Git inicialmente vacío. Muy fácil de usar y aún más de entender Git con ella.

GitGud tool

Git School

Otro entorno de aprendizaje para Git es Git School. Básicamente lo mismo que la anterior, aunque con pequeñas variaciones en la forma de visualizar el repositorio.

Parecido, aunque menos completo, esta web es un ejemplo de como se puede usar D3 para crear este tipo de visualizaciones de repositorios.

Git School visualization

Learn Git Branching

LearnGitBranching.js ofrece un entorno interactivo para aprender Git a base de ejercicios ordenados según su nivel de dificultad. Escoge el nivel de dificultad y mira si eres capaz de resolver el escenario que se te plantea. Siempre con la opción de ver gráficamente el resultado de cada comando y como va evolucionando el repositorio ficticio con él. Y si lo prefieres también puedes saltarte los ejercicios y usar directamente el entorno para ir jugando tú sólo, igual que con las herramientas anteriores.

Ejercicios para aprender Git

Otras herramientas Git curiosas

Git History

En lugar de visualizar la historia del repositorio, Git History te ayuda a navegar (como si una máquina del tiempo se tratara) la historia de un archivo concreto. Retrocede en el tiempo para ver quién hizo qué.

Git History of a file

Git Temporal

Git Temporal para VSCode tiene un objetivo muy similar: permitirte ver los cambios sobre un archivo o directorio a lo largo del tiempo.

GitTemporal Demo

Gource

Gource renderiza proyectos software enteros como un árbol animado. La raíz del árbol es el directorio raíz del proyecto. A partir de ahí el árbol va creciendo con las contribuciones. Los directorios son nuevas ramas del árbol y los archivos sus hojas. Los programadores aparecen “trabajando” en las ramas modificadas sus commits. La verdad, no tengo muy claro que esta representación sirva de mucho pero es muy chula de ver. Como ejemplo, este vídeo muestra la historia del desarrollo de python.