¿Visual Studio Live Share puede hacer eso?

Hace unos meses, Microsoft lanzó su servicio gratuito Visual Studio (VS) Live Share. VS Live Share es una colaboración de nivel de Google Docs para código. Varios desarrolladores pueden colaborar en el mismo archivo al mismo tiempo sin tener que salir de su propio editor.

Después del lanzamiento de Live Share, me di cuenta de que muchos de nosotros nos hemos resignado a estar aislados en nuestro código y ni siquiera somos conscientes de que hay mejores formas de trabajar con un servicio como VS Live Share. Esto se debe en parte a que estamos atrapados en viejos hábitos y en parte a que simplemente no somos conscientes de lo que VS Live Share puede hacer. ¡Esa última parte con la que puedo ayudar!

En este artículo, repasaremos las características y las mejores prácticas para VS Live Share que hacen que la colaboración de los desarrolladores sea tan fácil como ser un "hipopótamo anónimo".

Comparte tu código

Live Share viene como una extensión para Visual Studio y Visual Studio Code (VS Code). En este artículo, nos centraremos en VS Code.

También puede instalarlo a través del VS Live Share Extension Pack, que incluye las siguientes extensiones, todas las cuales cubriremos en este artículo...

• Compartir en vivo VS
• Compartir audio en vivo VS
• Extensión de chat de Slack
  

Una vez instalada la extensión, deberá iniciar sesión en el servicio VS Live Share. Puede hacerlo abriendo la paleta de comandos Ctrl/Cmd + Shift + P y seleccionando "Iniciar sesión con el navegador". Si no inicia sesión e intenta iniciar una nueva sesión compartida, se le pedirá que inicie sesión en ese momento.

Hay varias formas de iniciar una sesión de VS Live Share. Puede hacerlo desde la Paleta de comandos, puede hacer clic en el botón "Compartir" en la barra de herramientas inferior, o puede usar la vista del explorador VS Live Share en la barra lateral.

Un enlace se copia en su portapapeles. Luego puede enviar ese enlace a otros, y ellos pueden unirse a su sesión de Live Share, siempre que también estén usando VS Code. ¿Cuáles, no somos todos?

Ahora puede colaborar como si estuviera trabajando en un documento antiguo de Word normal:

La otra persona no solo puede ver tu código, sino que puede editarlo, guardarlo, ejecutarlo e incluso depurarlo. Para usted, se muestran como un cursor con un nombre. Apareces en su editor de la misma manera.

Explorador de VS Live Share

El explorador VS Live Share aparece como un nuevo ícono en la barra de acción, que es esa barra de íconos en el extremo derecho de mi pantalla (el extremo izquierdo de la suya para la ubicación predeterminada de la barra de acción). Esta es una especie de "zona cero" para todo VS Live Share. Desde aquí, puede iniciar sesiones, finalizarlas, compartir terminales, servidores y ver quién está conectado.

Es una buena idea vincular un atajo de teclado a esta vista de VS Live Share Explorer para que pueda alternar rápidamente entre eso y sus archivos. Puede hacer esto presionando Ctrl/Cmd + K (o Ctrl/Cmd + S ) y luego buscando "Mostrar Live Share". Enlacé el mío a Ctrl/Cmd + L , que no parece estar vinculado a nada más. Encuentro que este atajo es intuitivo ( L para Live Share) y fácil de usar en el teclado.

Compartir código de solo lectura

Cuando inicie una nueva sesión de uso compartido, se le notificará y se le preguntará si desea compartir su espacio de trabajo en modo de solo lectura. Si selecciona solo lectura, las personas podrán ver su código y seguir sus movimientos, pero no podrán interactuar.

Este modo es útil cuando comparte con alguien en quien no necesariamente confía, tal vez un proveedor, socio o un ex.

También es particularmente útil para los instructores. Tenga en cuenta que en el momento de escribir este artículo, VS Live Share está bloqueado para 5 usuarios simultáneos. Dado que probablemente querrá más que eso en el modo de solo lectura, especialmente si está enseñando a un grupo, puede aumentar el límite a 30 agregando la siguiente línea a su archivo de configuración de usuario: Ctrl/Cmd + , .

 "liveshare.features": "experimental"

Cambiar el comportamiento de unión predeterminado

Cualquiera que tenga el enlace puede unirse a su sesión de Live Share. Cuando se unan, verás una ventana emergente informándote. Del mismo modo, cuando se desconectan, te notifican. Este es el comportamiento predeterminado para VS Live Share.

Es una buena idea cambiar esto para que tenga que aprobar manualmente a alguien antes de que pueda unirse a su sesión. Esto es para protegerlo en el caso de que vaya a almorzar y olvide desconectar su sesión. Sus compañeros de trabajo no pueden volver a iniciar sesión, cambiar una letra en la cadena de conexión de su base de datos y luego reírse mientras pasa las próximas cuatro horas tratando de averiguar cómo su vida ha ido tan terriblemente mal.

Para habilitar esto, agregue la siguiente línea a su archivo de configuración de usuario Ctrl/Cmd + , .

 "liveshare.guestApprovalRequired": true

Ahora se le preguntará cuando alguien quiera unirse. Si bloquea a alguien, se bloquea durante la duración de la sesión. Si intentan unirse de nuevo, no se le notificará y VS Live Share los rechazará sin contemplaciones.

Ve y disfruta de tu almuerzo. Tu computadora está segura.

Seguidores de enfoque

De manera predeterminada, cualquier persona que se una a su sesión de Live Share lo está "siguiendo". Eso significa que su editor cargará cualquier archivo en el que se encuentre y se desplazará cada vez que se desplace. Incluso si cambia de archivo, los participantes verán exactamente lo que usted ve.

En el momento en que una persona realiza cambios en un archivo, ya no te siguen. Entonces, si ambos están trabajando juntos en un archivo y luego van a un archivo diferente, no irán automáticamente con usted. Eso puede generar mucha confusión al hablar sobre el código en el archivo en el que se encuentra mientras la otra persona está mirando algo completamente diferente.

Además de simplemente decirles dónde están (lo cual funciona, por cierto), hay un comando útil llamado "Enfocar participantes" que se encuentra en la Paleta de comandos Ctrl/Cmd + Shift + P .

También puede acceder a él como un icono en la vista VS Live Share Explorer.

Esto enfocará a sus participantes en lo siguiente en lo que haga clic o se desplace. De forma predeterminada, las solicitudes de enfoque de VS Live Share se aceptan implícitamente. Si no desea que las personas puedan enfocarlo, puede agregar la siguiente línea a su archivo de configuración de usuario.

 "liveshare.focusBehavior": "prompt" 

También tenga en cuenta que puede seguir a los participantes. Si hace clic en su nombre en la vista VS Live Share Explorer, comenzará a seguirlos.

Debido a que el seguimiento se desactiva tan pronto como la otra persona comienza a editar el código, puede ser difícil saber exactamente cuándo las personas lo siguen y cuándo no. Un lugar donde puede buscar es en la vista VS Live Share Explorer. Le dirá el archivo en el que se encuentra una persona, pero no si lo está siguiendo o no.

Una buena práctica es simplemente recordar que el enfoque siempre está cambiando, por lo que las personas pueden o no ver lo que usted ve en un momento dado.

Depurar como equipo

Los participantes pueden compartir cualquier sesión de depuración que ejecute. Si inicia una sesión de depuración, obtendrán exactamente la misma experiencia que usted. Si se rompe en su lado, se rompe en el de ellos y obtienen la vista de depuración completa en todo su código.

Pueden entrar, salir, pasar, agregar relojes, evaluar en la consola de depuración; cualquier depuración que pueda hacer, ellos también pueden hacerlo y pueden controlarlo.

Los participantes también pueden iniciar la depuración. Sin embargo, por defecto, VS Code no permite que su depurador se inicie de forma remota. Para habilitar esto, agregue la siguiente línea a su archivo de configuración de usuario Ctrl/Cmd + , :

 "liveshare.allowGuestDebugControl": true

Comparta su terminal

Gran parte del trabajo que hacemos como desarrolladores no está en nuestro código; esta en la terminal Algunos días parece que paso tanto tiempo en mi terminal como en mi editor. Esto significa que si tiene un error en su terminal o necesita escribir algún comando, sería bueno que sus participantes en VS Live Share puedan ver su terminal además de su código.

VS Code tiene una terminal integrada y puede compartirla con VS Live Share.

Cuando hace esto, tiene la oportunidad de compartir su terminal como de solo lectura o de lectura y escritura.

De forma predeterminada, debe compartir su terminal como de solo lectura. Cuando comparte su terminal de lectura y escritura, el usuario puede ejecutar comandos arbitrarios directamente en su terminal. Deja que eso se hunda por un momento. Eso es pesado.

No hace falta decir que tener acceso de escritura remoto a la terminal de alguien implica mucha confianza y responsabilidad. Solo debe compartir su terminal de lectura y escritura con personas en las que confíe implícitamente. Los ex separados probablemente estén fuera de la mesa.

Compartir su terminal de solo lectura de forma segura le permite a la persona al otro lado de la línea ver lo que está escribiendo y la salida de su terminal en tiempo real, pero les impide escribir cualquier cosa en ese terminal.

Si se encuentra en un escenario en el que sería más rápido para la otra persona llegar a su terminal en lugar de intentar guiarlo a través de un comando extraño con un montón de banderas, puede compartir su terminal de lectura y escritura. En este modo, la otra persona tiene acceso remoto completo a su terminal. Elige sabiamente a tus amigos.

Comparta su servidor local

En el video de arriba, el comando de terminal termina con un enlace a un sitio que se ejecuta en https://localhost:8080. Con VS Live Share, puede compartir ese host local para que la otra persona pueda acceder a él como si fuera su propio host local.

Si está ejecutando una sesión de depuración compartida, cuando el participante acceda a la URL del host local en su extremo, se interrumpirá para ambos si se alcanza un punto de interrupción. Aún mejor, puede compartir cualquier proceso TCP. Eso significa que puede compartir algo como una base de datos o un caché de Redis. Por ejemplo, podría compartir su servidor Mongo DB local. ¡Seriamente! Esto significa que ya no tendrá que cambiar los archivos de configuración ni intentar obtener una base de datos compartida. Simplemente comparta el puerto para su instancia local de Mongo DB.

Comparta los archivos correctos de la manera correcta

A veces, no desea que los colaboradores vean ciertos archivos. Es probable que haya claves privadas y contraseñas en su proyecto que no estén registradas en el control de código fuente y que no sean adecuadas para la visualización pública. En este caso, deseará ocultar esos archivos a cualquier persona que participe en su sesión de Live Share.

De manera predeterminada, VS Live Share ocultará cualquier archivo que se especifique en su .gitignore . Si hay un archivo que desea ocultar, simplemente agréguelo a su .gitignore . Sin embargo, tenga en cuenta que esto solo oculta el archivo en la vista del proyecto. Si está en una sesión de depuración compartida y accede a un archivo que está en .gitignore , aún está cargado en el editor y sus colaboradores podrán verlo.

Puede obtener un control más detallado sobre cómo comparte archivos creando un archivo .vsls.json .

Por ejemplo, si quisiera asegurarse de que los archivos que están en .gitignore nunca sean visibles, incluso durante la depuración, puede configurar la propiedad gitignore para exclude .

 { "$schema": "https://json.schemastore.org/vsls", "gitignore":"exclude" }

Del mismo modo, puede mostrar todo en su .gitignore y controlar la visibilidad del archivo directamente desde el archivo .vsls.json . Para hacer eso, configure gitignore en none y luego use las propiedades excludeFiles y hideFiles . Recuerde: excluir significa nunca visible y ocultar significa "no visible en el explorador de archivos".

 { "$schema": "https://json.schemastore.org/vsls", "gitignore":"none", "excludeFiles":[ "*.env" ], "hideFiles": [ "dist" ] }

Compartir y extensiones

Parte del atractivo de VS Code para muchos desarrolladores es el mercado masivo de extensiones. La mayoría de la gente tendrá más de unos pocos instalados. Es importante comprender cómo funcionarán o no las extensiones en el contexto de VS Live Share.

VS Live Share sincronizará todo lo que sea específico del contexto del proyecto que está compartiendo. Por ejemplo, si tiene instalada la extensión Vetur porque está trabajando con un proyecto Vue, se compartirá con todos los participantes, independientemente de si también la tienen instalada o no. Lo mismo es cierto para otras cosas específicas del contexto, como linters, formateadores, depuradores y servicios de lenguaje.

VS Live Share no sincroniza extensiones específicas del usuario. Estas serían cosas como temas, íconos, enlaces de teclado, etc. Como regla general, VS Live Share comparte su contexto, no su pantalla. Puede consultar el artículo de documentos oficiales sobre este tema para obtener una explicación más detallada de las extensiones que puede esperar que se compartan.

Comuníquese mientras colabora

Una de las primeras cosas que hace la gente en su experiencia VS Live Share inaugural es tratar de comunicarse escribiendo comentarios de código. Esto parece ser lo que hay que escribir (¿entiendes?), pero no es realmente cómo se diseñó VS Live Share para ser utilizado.

VS Live Share no pretende reemplazar su cliente de chat de elección. Es probable que ya tenga un mecanismo de chat preferido, y VS Live Share asume que continuará usándolo.

Si ya usa Slack, hay una extensión de VS Code llamada Slack Chat. Esta extensión aún se encuentra en una etapa temprana de su desarrollo, pero parece bastante prometedora. Pone VS Code en modo dividido e incrusta Slack en el lado derecho. Aún mejor, puede iniciar una sesión de Live Share directamente desde el chat de Slack.

Otra herramienta que parece bastante interesante se llama CodeStream.

CodeStream

Si bien VS Live Share busca mejorar la colaboración desde el editor, CodeStream tiene como objetivo resolver el mismo problema desde la perspectiva del chat.

La extensión CodeStream le permite chatear directamente dentro de VS Code y esos chats se vuelven parte de su historial de código. Puede resaltar una parte del código para discutir y va directamente al chat para que haya contexto para sus comentarios. Estos comentarios luego se guardan como parte de su repositorio de Git. También aparecen en su código como pequeños íconos de comentarios, y estos comentarios aparecerán sin importar en qué rama se encuentre.

Cuando se trata de VS Live Share, CodeStream ofrece un conjunto de funciones complementarias. Puede iniciar nuevas sesiones directamente desde el panel de chat, así como haciendo clic en un avatar. Las nuevas sesiones crean automáticamente un canal de chat correspondiente que puede persistir con el código o eliminar cuando haya terminado.

Si chatear no es suficiente para hacer el trabajo y necesita colaborar como si fuera 1999, la ayuda está a solo una llamada de distancia.

Compartir audio en vivo VS

Si bien VS Live Share no está tratando de reinventar el chat, reinventa su teléfono. Mas o menos.

Con la extensión VS Live Share Audio, puede llamar a alguien directamente y chatear por voz desde VS Code.

La otra persona recibirá un aviso para unirse a su llamada.

Verá un icono de altavoz en la barra de estado inferior cuando esté conectado a una llamada. Puede hacer clic en ese altavoz para cambiar su dispositivo de audio, silenciarse o desconectarse de la llamada.

El último consejo que le daré es probablemente el más importante, y no es una característica sofisticada o una configuración oscura que no sabía que existía.

Cambia tu memoria muscular

Tenemos años de comportamiento aprendido cuando se trata de obtener ayuda o compartir nuestro código. El estado de las herramientas de colaboración para desarrolladores ha sido tan malo durante tanto tiempo que estamos condicionados a pegar código en Slack, iniciar llamadas incómodas de Skype que consisten principalmente en "dime cuándo puedes ver mi pantalla", o amontonarte alrededor de un monitor y señalar excesivamente, es decir, estilo de fotografía de stock.

Lo más importante que puede hacer para aprovechar al máximo VS Live Share es usar VS Live Share. Y tendrá que ser un esfuerzo “consciente”.

Tu cerebro es bueno para los patrones. Estás constantemente reconociendo y clasificando el mundo que te rodea en función de los patrones que has identificado, y eres tan bueno en eso que ni siquiera te das cuenta de que lo estás haciendo. A continuación, desarrolla respuestas predeterminadas a estos patrones. Formas instintos. Esta es la razón por la que volverá a las viejas formas de colaboración sin siquiera pensar en lo que está haciendo. Antes de que te des cuenta, estarás en una llamada de Skype con alguien compartiendo tu pantalla, incluso si tienes Live Share instalado.

He escrito mucho sobre VS Code y la gente me pregunta de vez en cuando cómo pueden ser más productivos con su editor. Siempre digo lo mismo: la próxima vez que tomes el mouse para hacer algo, detente. ¿Puedes hacer algo con el teclado en su lugar? Probablemente puedas. Busque el atajo y luego oblíguese a usarlo. Al principio va a ser más lento, pero si está dispuesto a adoptar deliberadamente un comportamiento diferente, se sorprenderá de lo rápido que su cerebro adoptará por defecto la forma más productiva de hacer algo.

Lo mismo ocurre con Live Share. Estará en una llamada compartiendo su pantalla cuando se le ocurra que podría estar usando Live Share. En ese momento, detente; haga clic en el botón "Compartir" en la parte inferior de VS Code.

Sí, es posible que la persona del otro lado no tenga instalada la extensión. Sí, puede tomar un momento configurarlo. Pero si trabaja para establecer este comportamiento ahora, la próxima vez que haga esto, "simplemente funcionará" y no pasará mucho tiempo antes de que ni siquiera tenga que pensar en ello, y en ese punto, usted finalmente habrá logrado ese nivel de colaboración de "Hipopótamo anónimo".

Más recursos

• Paquete de extensión VS Live Share
• Documentos compartidos en vivo de VS Code
• Extensiones y soporte del ecosistema
• Primeros pasos con VS Live Share