Visual Studio Live Share может это сделать?

Опубликовано: 2022-03-10
Краткое резюме ↬ Совместная работа над офисными документами — это решенная проблема. Сотрудничать над кодом по-прежнему довольно сложно. Это потому, что совместного использования только кода недостаточно. Чтобы действительно сотрудничать, разработчик должен иметь возможность совместно использовать всю свою среду. VS Live Share — это новый сервис, который позволяет вам делать именно это, и вы можете быть удивлены тем, насколько много общего вы можете сделать на самом деле.

Несколько месяцев назад Microsoft выпустила бесплатную службу Visual Studio (VS) Live Share. VS Live Share — это совместная работа над кодом на уровне Google Docs. Несколько разработчиков могут одновременно работать над одним и тем же файлом, не выходя из собственного редактора.

После выпуска Live Share я понял, что многие из нас смирились с изоляцией в своем коде и даже не подозревают, что есть лучшие способы работы с такой службой, как VS Live Share. Это отчасти потому, что мы застряли в старых привычках, а отчасти потому, что мы просто не знаем, на что способны все VS Live Share. С последней частью я могу помочь!

В этой статье мы рассмотрим функции и рекомендации для VS Live Share, которые упрощают совместную работу с разработчиками, как если бы вы были «анонимным бегемотом».

список анонимных животных в Google Docs
В Документах Google есть интересный способ обработки анонимных участников (большой предварительный просмотр)

Поделитесь своим кодом

Live Share поставляется как расширение как для Visual Studio, так и для Visual Studio Code (VS Code). В этой статье мы сосредоточимся на VS Code.

Страница readme расширения vs code live share
(Большой превью)

Вы также можете установить его через пакет расширений VS Live Share, который включает в себя следующие расширения, все из которых мы рассмотрим в этой статье…

  • VS Live Поделиться
  • VS Прямая трансляция аудио
  • Расширение Slack-чата
Еще после прыжка! Продолжить чтение ниже ↓

После установки расширения вам нужно будет войти в службу VS Live Share. Вы можете сделать это, открыв палитру команд Ctrl/Cmd + Shift + P и выбрав «Войти через браузер». Если вы не войдете в систему и попытаетесь начать новый сеанс обмена, вам будет предложено войти в систему в это время.

Палитра команд vs code, показывающая возможность входа в систему с помощью браузера
Используйте палитру команд VS Code, чтобы начать новый сеанс Live Share (большой предварительный просмотр)

Существует несколько способов начать сеанс VS Live Share. Вы можете сделать это из палитры команд, вы можете нажать кнопку «Поделиться» на нижней панели инструментов или использовать представление проводника VS Live Share на боковой панели.

vs код с рамками, нарисованными вокруг различных частей пользовательского интерфейса, которые можно использовать для запуска сеанса обмена в реальном времени.
Существует множество способов начать новый сеанс VS Live Share (большой предварительный просмотр)

Ссылка копируется в буфер обмена. Затем вы можете отправить эту ссылку другим, и они смогут присоединиться к вашему сеансу Live Share — при условии, что они также используют VS Code. Что, разве мы не все?

Теперь вы можете сотрудничать так же, как вы работали над обычным старым документом Word:

Другой человек может не только видеть ваш код, но и редактировать его, сохранять, выполнять и даже отлаживать. Для вас они отображаются в виде курсора с именем на нем. Вы появляетесь в их редакторе таким же образом.

Обозреватель VS Live Share

Проводник VS Live Share отображается в виде нового значка на панели действий — это панель значков в крайнем правом углу моего экрана (крайний левый от вашего для размещения панели действий по умолчанию). Это своего рода «эпицентр» всего, что связано с VS Live Share. Отсюда вы можете начинать сеансы, завершать их, совместно использовать терминалы, серверы и видеть, кто подключен.

по сравнению с просмотром в реальном времени
Обозреватель VS Live Share — это обзор всего, что связано с Live Share (большой предварительный просмотр)

Рекомендуется привязать сочетание клавиш к этому представлению VS Live Share Explorer, чтобы вы могли быстро переключаться между ним и вашими файлами. Вы можете сделать это, нажав Ctrl/Cmd + K (или Ctrl/Cmd + S ), а затем выполнив поиск «Show Live Share». Я привязал свой к Ctrl/Cmd + L , который, кажется, не привязан ни к чему другому. Я считаю этот ярлык интуитивно понятным ( L для Live Share), и его легко нажимать на клавиатуре.

экран привязки клавиатуры в коде vs с привязкой, созданной для вьюлета vs live share
Вы можете создать привязку для представления VS Live Share Explorer (большой предварительный просмотр)

Поделиться кодом Только для чтения

Когда вы начнете новый сеанс совместного использования, вы получите соответствующее уведомление и спросите, хотите ли вы предоставить общий доступ к своему рабочему пространству только для чтения. Если вы выберете только чтение, люди смогут видеть ваш код и следить за вашими движениями, но не смогут взаимодействовать.

против уведомления кода, предлагающего пользователю выбрать общий доступ только для чтения
Сеансы общего доступа по умолчанию доступны для чтения и записи, но вы можете сделать их доступными только для чтения (большой предварительный просмотр).

Этот режим полезен, когда вы делитесь с кем-то, кому вы не обязательно доверяете — может быть, с продавцом, партнером или отчужденным бывшим.

Это также особенно полезно для инструкторов. Обратите внимание, что на момент написания этой статьи VS Live Share заблокирован для 5 одновременных пользователей. Поскольку вам, вероятно, понадобится больше в режиме только для чтения, особенно если вы обучаете группу, вы можете увеличить ограничение до 30, добавив следующую строку в свой файл настроек пользователя: Ctrl/Cmd + , .

 "liveshare.features": "experimental"

Изменить поведение присоединения по умолчанию

Любой, у кого есть ссылка, может присоединиться к вашему сеансу Live Share. Когда они присоединятся, вы увидите всплывающее окно с уведомлением. Точно так же, когда они отключаются, вы получаете уведомление. Это поведение по умолчанию для VS Live Share.

против уведомления кода с именем человека, который присоединился к сеансу обмена в реальном времени
VS Code будет предупреждать вас всякий раз, когда кто-то присоединяется к вашему сеансу (большой предварительный просмотр)

Рекомендуется изменить это, чтобы вам приходилось вручную одобрять кого-либо, прежде чем он сможет присоединиться к вашему сеансу. Это сделано для того, чтобы защитить вас в случае, если вы пойдете на обед и забудете отключить сеанс. Ваши коллеги не могут снова войти в систему, изменить одну букву в вашей строке подключения к базе данных, а затем смеяться, пока вы проводите следующие четыре часа, пытаясь понять, как ваша жизнь пошла так ужасно неправильно.

Чтобы включить это, добавьте следующую строку в файл настроек пользователя Ctrl/Cmd + , .

 "liveshare.guestApprovalRequired": true

Теперь вам будет предложено, когда кто-то хочет присоединиться. Если вы заблокируете кого-то, он будет заблокирован на время сеанса. Если они попытаются присоединиться снова, вы не будете уведомлены, и они будут бесцеремонно отклонены VS Live Share.

Иди и наслаждайся обедом. Ваш компьютер в безопасности.

Фокус последователей

По умолчанию любой, кто присоединяется к вашему сеансу Live Share, «подписывается» на вас. Это означает, что их редактор будет загружать любой файл, в котором вы находитесь, и прокручивать каждый раз, когда вы прокручиваете. Даже если вы переключите файлы, участники увидят именно то, что видите вы.

Как только человек вносит изменения в файл, он больше не подписан на вас. Поэтому, если вы оба работаете над одним файлом вместе, а затем переходите к другому файлу, они не перейдут автоматически вместе с вами. Это может привести к большой путанице, когда вы говорите о коде в файле, в котором находитесь, в то время как другой человек смотрит на что-то совершенно другое.

Помимо простого сообщения друг другу, где вы находитесь (что, кстати, работает), есть удобная команда «Фокусировать участников», которая находится в палитре команд Ctrl/Cmd + Shift + P.

Палитра команд vs code, показывающая команду live share focus
Доступ к команде «фокус» из палитры команд VS Code (большой предварительный просмотр)

Вы также можете получить к нему доступ в виде значка в представлении VS Live Share Explorer.

vs code live share explorer значок фокуса
Отправьте запрос на подписку, щелкнув значок подписки в представлении VS Live Share Explorer (большой предварительный просмотр).

Это сфокусирует ваших участников на следующем объекте, на который вы нажмете или до которого прокрутите. По умолчанию запросы фокуса VS Live Share принимаются неявно. Если вы не хотите, чтобы люди могли сфокусировать вас, вы можете добавить следующую строку в свой файл настроек пользователя.

 "liveshare.focusBehavior": "prompt" 

Также обратите внимание, что вы можете следить за участниками. Если вы нажмете на их имя в представлении VS Live Share Explorer, вы начнете подписываться на них.

Поскольку подписка отключается, как только другой человек начинает редактировать код, может быть сложно точно определить, когда люди подписаны на вас, а когда нет. Одно место, где вы можете посмотреть, — это представление VS Live Share Explorer. Он сообщит вам файл, в котором находится человек, но не сообщит, подписаны ли они на вас.

Хорошей практикой является просто помнить, что фокус всегда меняется, поэтому люди могут видеть или не видеть то, что видите вы в любой момент времени.

Отладка в команде

Участники могут совместно использовать любые запущенные вами сеансы отладки. Если вы начнете сеанс отладки, они получат точно такой же опыт, как и вы. Если это сломается на вашей стороне, это сломается на их стороне, и они получат полное отладочное представление всего вашего кода.

Они могут входить, выходить, повторяться, добавлять часы, оценивать в консоли отладки; любую отладку, которую вы можете сделать, они тоже могут сделать, и они могут это контролировать.

Отладка также может быть запущена участниками. Однако по умолчанию VS Code не позволяет удаленно запускать отладчик. Чтобы включить это, добавьте следующую строку в файл настроек пользователя Ctrl/Cmd + , :

 "liveshare.allowGuestDebugControl": true

Поделитесь своим терминалом

Большая часть работы, которую мы делаем как разработчики, не находится в нашем коде; это в терминале. В некоторые дни кажется, что я провожу за своим терминалом примерно столько же времени, сколько и за своим редактором. Это означает, что если у вас есть ошибка на вашем терминале или вам нужно ввести какую-то команду, было бы неплохо, если бы ваши участники в VS Live Share могли видеть ваш терминал в дополнение к вашему коду.

VS Code имеет встроенный терминал, и вы можете поделиться им с VS Live Share.

Палитра команд vs code с выбранным общим терминалом
Доступ к команде «Поделиться терминалом» из палитры команд VS Code (большой предварительный просмотр)

Когда вы это сделаете, у вас будет возможность предоставить общий доступ к вашему терминалу только для чтения или для чтения и записи.

vs код, предлагающий поделиться терминалом только для чтения или чтения-записи
Всегда предоставляйте общий доступ к терминалу только для чтения, если вам абсолютно не нужно предоставлять к нему доступ для записи (большой предварительный просмотр)

По умолчанию вы должны предоставлять общий доступ к своему терминалу только для чтения. Когда вы делитесь своим терминалом для чтения и записи, пользователь может выполнять произвольные команды прямо на вашем терминале. Позвольте этому погрузиться на мгновение. Это тяжело.

Само собой разумеется, что наличие удаленного доступа на запись к чьему-либо терминалу сопряжено с большим доверием и ответственностью. Вы должны когда-либо делиться своим терминалом для чтения и записи только с людьми, которым вы безоговорочно доверяете. Отчужденные бывшие, вероятно, не обсуждаются.

Безопасное совместное использование вашего терминала только для чтения позволяет человеку на другом конце линии видеть, что вы печатаете, и вывод вашего терминала в режиме реального времени, но ограничивает их от ввода чего-либо в этот терминал.

Если вы окажетесь в ситуации, когда другому человеку будет проще просто добраться до вашего терминала, а не пытаться провести вас через какую-то дурацкую команду с кучей флагов, вы можете поделиться своим терминалом для чтения и записи. В этом режиме другой человек имеет полный удаленный доступ к вашему терминалу. Выбирайте друзей с умом.

Поделитесь своим локальным хостом

В приведенном выше видео команда терминала заканчивается ссылкой на сайт, работающий по адресу https://localhost:8080. С помощью VS Live Share вы можете поделиться этим локальным хостом, чтобы другой человек мог получить к нему доступ так же, как если бы это был его собственный локальный хост.

Если вы запускаете общий сеанс отладки, когда участник нажимает на этот URL-адрес локального хоста со своей стороны, он прерывается для вас обоих, если срабатывает точка останова. Более того, вы можете совместно использовать любой процесс TCP. Это означает, что вы можете поделиться чем-то вроде базы данных или кеша Redis. Например, вы можете поделиться своим локальным сервером Mongo DB. Серьезно! Это означает, что больше не нужно изменять файлы конфигурации или пытаться запустить общую базу данных. Просто поделитесь портом для вашего локального экземпляра базы данных Mongo.

Делитесь нужными файлами правильным способом

Иногда вы не хотите, чтобы соавторы видели определенные файлы. Вероятно, в вашем проекте есть закрытые ключи и пароли, которые не зарегистрированы в системе управления версиями и не подходят для публичного просмотра. В этом случае вы захотите скрыть эти файлы от всех, кто участвует в вашем сеансе Live Share.

По умолчанию VS Live Share скрывает любой файл, указанный в вашем .gitignore . Если есть файл, который вы хотите скрыть, просто добавьте его в свой .gitignore . Обратите внимание, что это только скрывает файл в представлении проекта. Если вы находитесь в общем сеансе отладки и переходите к файлу, который находится в .gitignore , он все еще загружается в редакторе, и ваши соавторы смогут его увидеть.

Вы можете получить более детальный контроль над тем, как вы делитесь файлами, создав файл .vsls.json .

Например, если вы хотите убедиться, что любые файлы, находящиеся в .gitignore , никогда не будут видны даже во время отладки, вы можете установить для свойства gitignore значение exclude .

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

Точно так же вы можете показать все в своем .gitignore и контролировать видимость файла непосредственно из файла .vsls.json . Для этого установите для gitignore значение none , а затем используйте свойства excludeFiles и hideFiles . Помните: «исключить» означает никогда не отображаться, а «скрыть» означает «не отображаться в проводнике».

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

Общий доступ и расширения

Частью привлекательности VS Code для многих разработчиков является огромный рынок расширений. Большинство людей будет иметь более чем несколько установленных. Важно понимать, как расширения будут работать или не работать в контексте VS Live Share.

VS Live Share синхронизирует все, что относится к контексту проекта, которым вы делитесь. Например, если у вас установлено расширение Vetur, потому что вы работаете с проектом Vue, оно будет доступно всем участникам — независимо от того, установлено ли оно у них. То же самое относится и к другим контекстно-зависимым вещам, таким как линтеры, средства форматирования, отладчики и языковые службы.

VS Live Share не синхронизирует расширения, зависящие от пользователя. Это могут быть такие вещи, как темы, значки, привязки клавиатуры и так далее. Как правило, VS Live Share делится вашим контекстом, а не вашим экраном. Вы можете обратиться к статье официальной документации по этому вопросу для более подробного объяснения того, какие расширения вы можете использовать совместно.

Общайтесь во время совместной работы

Первое, что люди делают в своем первом опыте работы с VS Live Share, — это пытаются общаться, вводя комментарии к коду. Это похоже на то, что нужно написать (получить?), но на самом деле это не то, как VS Live Share был разработан для использования.

VS Live Share не предназначен для замены вашего любимого чат-клиента. Вероятно, у вас уже есть предпочтительный механизм чата, и VS Live Share предполагает, что вы продолжите его использовать.

Если вы уже используете Slack, существует расширение VS Code под названием Slack Chat. Это расширение все еще находится на ранней стадии разработки, но выглядит весьма многообещающе. Он переводит VS Code в режим разделения и встраивает Slack с правой стороны. Более того, вы можете начать сеанс Live Share прямо из чата Slack.

vs code slack расширение чата
Расширение Slack Chat помещает Slack в ваш редактор (большой предварительный просмотр)

Еще один инструмент, который выглядит довольно интересно, называется CodeStream.

CodeStream

В то время как VS Live Share стремится улучшить совместную работу редактора, CodeStream стремится решить ту же проблему с точки зрения чата.

Расширение CodeStream позволяет вам общаться непосредственно в VS Code, и эти чаты становятся частью вашей истории кода. Вы можете выделить фрагмент кода для обсуждения, и он попадет прямо в чат, чтобы был контекст для ваших комментариев. Затем эти комментарии сохраняются как часть репозитория Git. Они также отображаются в вашем коде в виде маленьких значков комментариев, и эти комментарии будут отображаться независимо от того, в какой ветке вы находитесь.

Что касается VS Live Share, CodeStream предлагает бесплатный набор функций. Вы можете начать новые сеансы прямо из панели чата, а также нажав на аватар. Новые сеансы автоматически создают соответствующий канал чата, который вы можете сохранить с кодом или удалить, когда закончите.

Если общения в чате недостаточно для выполнения работы, и вам нужно сотрудничать, как в 1999 году, помощь находится на расстоянии одного телефонного звонка.

VS Прямая трансляция аудио

Хотя VS Live Share не пытается заново изобрести чат, он заново изобретает ваш телефон. Что-то вроде.

С расширением VS Live Share Audio вы можете позвонить кому-нибудь напрямую и общаться в голосовом чате из VS Code.

Палитра команд vs code, показывающая параметр запуска аудиовызова
Совершайте аудиовызовы из VS Code с помощью расширения VS Live Share Audio (большой предварительный просмотр)

Затем другой человек получит приглашение присоединиться к вашему разговору.

против уведомления кода с вопросом, хотите ли вы присоединиться к аудиовызову
VS Code спросит вас, хотите ли вы присоединиться к аудиовызову, который находится в процессе (большой предварительный просмотр)

Вы увидите значок динамика в нижней строке состояния, когда вы подключены к вызову. Вы можете нажать на этот динамик, чтобы изменить аудиоустройство, отключить свой звук или отключиться от вызова.

vs параметры кода, показывающие такие параметры, как отключение звука и отключение для расширения аудио в реальном времени
У вас есть полный контроль над настройками звука во время вызова VS Live Share Audio (большой предварительный просмотр)

Последний совет, который я вам дам, вероятно, самый важный, и это не причудливая функция или непонятная настройка, о существовании которой вы не знали.

Измените свою мышечную память

У нас есть годы обучения поведению, когда дело доходит до получения помощи или обмена нашим кодом. Состояние инструментов для совместной работы с разработчиками было настолько плохим так долго, что мы были вынуждены вставлять код в Slack, начинать неловкие звонки по Skype, которые в основном состоят из «скажи мне, когда ты сможешь увидеть мой экран», или толпиться вокруг монитора и указывать на него. чрезмерно, т. е. в стиле стоковой фотографии.

группа людей, указывающих на экран компьютера
(Большой превью)

Самое важное, что вы можете сделать, чтобы получить максимальную отдачу от VS Live Share, — это использовать VS Live Share. И это должно быть «сознательное» усилие.

Ваш мозг хорош в шаблонах. Вы постоянно распознаете и классифицируете окружающий мир на основе выявленных закономерностей, и у вас это так хорошо получается, что вы даже не осознаете, что делаете это. Затем вы вырабатываете ответы по умолчанию на эти шаблоны. Вы формируете инстинкты. Вот почему вы по умолчанию будете использовать старые способы сотрудничества, даже не задумываясь о том, что вы делаете. Прежде чем вы это узнаете, вы будете звонить по Skype с кем-то, кто поделится вашим экраном, даже если у вас установлен Live Share.

Я много писал о VS Code, и люди время от времени будут спрашивать меня, как они могут повысить свою продуктивность с помощью своего редактора. Я всегда говорю одно и то же: в следующий раз, когда вы потянетесь за мышью, чтобы что-то сделать, остановитесь. Можете ли вы сделать что-то с клавиатурой вместо этого? Вы, вероятно, можете. Найдите ярлык, а затем заставьте себя использовать его. Поначалу это будет происходить медленнее, но если вы готовы намеренно изменить поведение, вы будете удивлены тем, как быстро ваш мозг по умолчанию переключится на более продуктивный способ делать что-либо.

То же самое касается Live Share. Вы будете участвовать в разговоре, делясь своим экраном, когда вам придет в голову, что вы можете использовать Live Share. В этот момент остановитесь; нажмите кнопку «Поделиться» в нижней части VS Code.

Да, у человека на другом конце может не быть установленного расширения. Да, настройка может занять некоторое время. Но если вы поработаете над формированием такого поведения сейчас, в следующий раз, когда вы начнете это делать, оно «просто сработает», и вскоре вам даже не придется об этом думать, и в этот момент вы наконец-то достигли такого уровня сотрудничества, как «Анонимный Бегемот».

Дополнительные ресурсы

  • Пакет расширения VS Live Share
  • Документы VS Code Live Share
  • Расширения и поддержка экосистемы
  • Начало работы с VS Live Share