Многоликость кода VS в браузере

VS Code построен на основе веб-технологий (HTML, CSS и JavaScript), но осмелюсь сказать, что сегодня он в основном использовал локальное приложение, установленное на вашем компьютере. Тем не менее, ситуация начинает меняться, поскольку наблюдается абсолютный взрыв мест, где VS Code становится доступным для использования в Интернете. Я бы сказал, что это большое дело, поскольку VS Code — это не просто какой-то редактор; это основной редактор используемый веб-разработчиками. Доступность в Интернете означает возможность использовать его без установки программного обеспечения, что важно для таких мест, как школы, где управление всем этим является проблемой, и компьютеров, таких как Chromebook, где вы вообще не устанавливаете локальное программное обеспечение.

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

vscode.dev

Всего несколько недель назад, когда я писал, Microsoft отказалась от vscode.dev. Крис Диас:

Современные браузеры, поддерживающие API доступа к файловой системе (сегодня Edge и Chrome), позволяют веб-страницам получать доступ к локальной файловой системе (с вашего разрешения). Этот простой шлюз к локальной машине быстро открывает некоторые интересные сценарии использования VS Code для Интернета в качестве локального инструмента разработки без установки

Прямо сейчас этот API есть только в Edge и Chrome, но даже если вы не можете его получить, вы все равно можете загружать файлы или, что более полезно, открыть репозиторий. Если это действительно работает, то в основном это … VS Code в браузере. Он может открывать ваши локальные папки и ведет себя во многом так же, как ваше локальное приложение VS Code.

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

В остальном ощущается примерно то же самое. Даже такие вещи, как «Найти в проекте», кажутся такими же быстрыми, как и локальные, даже на больших сайтах.

GitHub.dev: весь «Период публикации (.) На любом репозитории GitHub»

Если вы зайдете на github.dev, вы также получите VS Code в браузере, но он не совсем такой же.

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

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

Вы могли подумать, что vscode.dev и github.dev в какой-то момент сольются в один, но кто знает.

Ой, если подумать об этом наоборот, вы также можете напрямую открывать репозитории GitHub на своем локально установленном VS Code (даже без его клонирования).

В первых двух нет терминала или предварительного просмотра, но есть с GitHub Codespaces.

GitHub Codespaces — это тоже VS Code в браузере, но более интересный. Во-первых, вы авторизуетесь в Microsoft-land во время его использования, что означает, что он запускает все ваши расширения VS Code, которые вы запускаете локально. Но, возможно, еще важнее то, что вы получаете рабочий терминал. Когда вы его раскручиваете, вы видите:

Добро пожаловать в Codespaces! Вы используете наш образ по умолчанию.

• Он включает среды выполнения и инструменты для Python, Node.js, Docker и других. См. Полный список здесь: https://aka.ms/ghcs-default-image
• Хотите использовать вместо этого собственное изображение? Дополнительные сведения см. Здесь: https://aka.ms/configure-codespace[19459005visible

🔍 Чтобы полностью изучить код VS, выполните поиск с помощью палитры команд (Cmd / Ctrl + Shift + P или F1).

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

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

Это на той же территории, что и Gitpod.

Gitpod очень похож на GitHub CodeSpaces в том, что это VS Code в браузере, но с рабочим терминалом. Этот терминал похож на полноценную среду Docker / Linux, поэтому у вас есть много возможностей. Возможно, он даже сможет имитировать вашу производственную среду, если вы используете все, что поддерживает Gitpod.

Также стоит отметить, что Gitpod подключается к «рабочим пространствам», которые запускают службы. В этом демонстрационном проекте выше экземпляр MongoDB работает на одном порту, а сервер предварительного просмотра открыт на другом порту, что вы можете увидеть в макете интерфейса браузера. Возможность предварительного просмотра проекта, над которым вы работаете, абсолютно необходима, и они справляются с этим элегантно.

Возможно, вы помните, что мы использовали Gitpod в видео о DataStax Astra (jumplink), которое получилось очень хорошо.

Я (абсолютно) предполагаю, что Gitpod может быть приобретена Microsoft. Похоже, что Microsoft движется именно в этом направлении, и купить ее, безусловно, лучше, чем быть увлеченным компанией, которая производит основную технологию, которую вы используете. Вы должны сыграть «нет, это хорошо! это подтверждает рынок! мы испекли тебе неуклюжий торт! » какое-то время, но я не могу представить, что это закончится хорошо.

Это тоже очень похоже на CodeSandbox или Stackblitz.

По сути, CodeSandbox и Stackblitz также запускают VS Code в браузере. Или… что-то, что использует, по крайней мере, кусочки VS Code (недавний эпизод Syntax немного затрагивает подход StackBlitz).

Вы также можете установить VS Code на свой собственный сервер.

Это и есть кодовый сервер Coder. Таким образом, вместо того, чтобы использовать чужую веб-версию VS Code, вы используете свою собственную.

Вы можете запустить VS Code на локальном сервере, но я полагаю, что главное здесь то, что вы запускаете его на живых облачных веб-серверах, которыми вы управляете . Возможно, серверы, на которых работает ваш код, так что вы можете использовать это, чтобы буквально редактировать файлы на сервере. Кому нужен VIM, если у вас есть полноценный VS Code (лолз).

Мы говорили о школьном сценарии использования, и я полагаю, что это тоже убедительно, так как школа может даже не полагаться на сторонний сервис, а размещать его самостоятельно. Варианты использования iPad / Chromebook здесь тоже актуальны, а может, даже в большей степени. В документации говорится: «Продлите время работы от батареи, когда вы в пути; все интенсивные задачи выполняются на вашем сервере », что, как я полагаю, означает, что в отличие от vscode.dev, где такие задачи, как« Найти в проекте »(предположительно) выполняются на вашем локальном компьютере, они выполняются сервером (возможно, медленнее, но не медленнее, чем ноутбук за 200 долларов?)

---

Во всем этом явно что-то есть. Я оптимистично настроен на веб-IDE. Просто посмотрите, что происходит с Figma (пинает задницу), что, как я считаю, составляет одну треть из-за того, что дизайнерам экранов совещаний по продукту нужно с небольшим раздуванием, одну треть из-за простой модели команды и разрешений и одну треть из-за тот факт, что он построен в первую очередь для Интернета.