Перейти к содержимому

Как из visual studio отправлять проект на github

  • автор:

Как подключить Git к Visual Studio Code

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

Visual Studio Code (VS Code) – это бесплатный и открытый редактор кода, который был разработан Microsoft. Он подходит для различных языков программирования (JavaScript, TypeScript, Python , PHP , Java, C++, Go, Ruby, Kotlin) и доступен для использования на Windows, MacOS и Linux.

Редактор кода Visual Studio Code включает в себя широкий набор функций, который делают его удобным и популярным для разработки ПО. Он предоставляет доступ к инструменту управления версиями Git и легко интегрируется с ним.

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

Использование возможностей Git из VS Code

Visual Studio Code позволяет использовать возможности Git напрямую из редактора кода. Рассмотрим наиболее популярные функции Git в VS Code:

  1. Инициализация Git-репозитория. Это делается из меню команд или панели команд (клавиша F1), или через командную строку integrated terminal. После вы можете начать работу с Git и управлять версиями и ветками.
  2. В VS Code можно просматривать и отслеживать изменения в коде и коммитить их напрямую из редактора. Используйте для этого графический интерфейс или командную строку (терминал VS Code), чтобы добавлять, изменять и фиксировать изменения.
  3. Интеграция Git-консоли. В VS Code можно работать с Git, используя терминал VS Code. При работе применяются стандартные команды Git: git status, git add, git commit, git push и т.д. Эта функция будет полезна тем, у кого есть опыт работы с Git из командной строки.
  4. VS Code поддерживает множество Git-расширений, которые позволяют использовать дополнительные функции Git, такие как GitLens, который показывает информацию об изменениях, авторах и коммитах внутри файла, или Git Graph, который показывает графические данные об истории коммитов и ветках.

Основные требования к работе системы

Visual Studio Code – легковесный кодовый редактор, который не требует больших системных затрат для работы, он легко адаптируется к различным конфигурациям и системам. Придерживайтесь этих минимальных требований к оборудованию, на котором будет запущен VS Code, чтобы обеспечить плавную работу с редактором и максимально использовать возможности программного обеспечения:

  1. Операционная система: Windows, MacOS и Linux (в том числе Ubuntu, Debian, Fedora и другие). Система должна быть обновлена до последней версии, чтобы обеспечить работу современных приложений.
  2. Процессор: 1.6 ГГц или более, Intel Core 2 Duo или более.
  3. Оперативная память (ОЗУ): минимально 2 ГБ, для больших проектов рекомендуется не менее 4 ГБ.
  4. Жесткий диск: не менее 200 МБ свободного места на жестком диске для установки версии 32-х бит, или не менее 500 МБ для установки на 64-х битные системы.

Чтобы работать с репозиториями выбирайте надежное и мощное оборудование. Для таких проектов подойдет услуга Аренда выделенного сервера.

Работа с панелью Source Control

Рассмотрим начальные действия, которые пригодятся вам при знакомстве с панелью Source Control.

  1. Панель Source Control в Visual Studio Code находится в нижней части редактора и активируется с помощью иконки Git (выглядит как ветка). Нажмите на эту иконку, чтобы открыть панель Source Control.
  2. Если у вас уже есть Git-репозиторий, он автоматически отобразится в панели Source Control. Если нет, вы можете инициализировать новый Git-репозиторий в нужном каталоге с помощью команды «git init» в командной строке терминала VS Code или через встроенную функцию VS Code «Initialize Repository».
  3. Когда вы открываете новый проект, VS Code автоматически открывает панель Source Control и делает первый коммит «Initial Commit» с указанием всех файлов проекта. Эти файлы будут отображены в списке изменений.
  4. Просмотрите список изменений в панели Source Control. Определите, какие файлы вам нужно добавить в ваш следующий коммит, какие файлы изменены, а какие еще не отслеживаются Git.
  5. Кликните по файлу, чтобы просмотреть изменения в режиме сравнения с предыдущей версией. Используйте команды «Stage Changes» (добавить изменения в индекс) или «Discard Changes» (отменить изменения), чтобы изменить состояние файла.

  1. Чтобы добавить файлы коммит, введите сообщение коммита в поле ввода внизу панели Source Control. Нажмите на кнопку «Commit» (Фиксировать изменения) для создания нового коммита с выбранными файлами.
  2. Используйте кнопки «Push» (Загрузить изменения на сервер) и «Pull» (Загрузить изменения с сервера), чтобы обновить свой локальный репозиторий или отправить коммиты на удаленный репозиторий.
  3. Чтобы переключиться на другую ветку Git или создать новую ветку и начать работу в ней, используйте список веток.

Мы привели варианты часто используемых действий при работе с панелью Source Control. Теперь рассмотрим другие возможности VS Code.

Индикаторы области Gutter

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

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

Индикаторы области Gutter – удобный способ быстро найти и проанализировать информацию о коде, поэтому они являются важным инструментом для разработчиков. Плагины для VS Code могут добавлять индикаторы области Gutter для специальных типов файлов, дополнительных компонентов и других функций, что позволяет упростить работу и обеспечить более высокую производительность и эффективность.

Просмотр отличий файлов

VS Code предоставляет множество инструментов для просмотра отличий между файлами. Это полезно для отслеживания изменений в коде, работе с ветками Git, исправления ошибок или просто для сравнения файлов.

Чтобы сделать сравнение файлов (а также ветки Git, различные коммиты) выберите два файла в панели и нажмите правой кнопкой мыши на них, затем выберите «Compare selected» (Сравнить выбранное) чтобы открыть сравнение в редакторе.

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

Работа с ветвлением

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

При работе с ветвлением кода вам могут пригодиться следующие действия:

  1. Создание ветвления. Выберите нужную ветку в панели Source Control, затем щелкните правой кнопкой мыши по ней и выберите «Create new branch» (Создать новую ветку). Введите имя ветки и нажмите Enter.
  2. Объединение веток. Выберите ветку, которую вы хотите объединить с текущей, щелкните правой кнопкой мыши и выберите «Merge branch» (Объединить ветвь). Выберите ветку, которую вы хотите объединить, нажмите Enter.
  3. Разрешение конфликтов. При объединении веток могут возникнуть конфликты. Если это происходит, редактор кода показывает сообщение о конфликте и предлагает варианты разрешения. Выберите нужную опцию разрешения конфликта и нажмите «Accept current change» (Принять текущее изменение). После разрешения конфликтов сохраните изменения, которые вы внесли в код, и закройте все открытые файлы.
  4. Удаление ветки. После того, как вы объединили ветки и сохранили изменения, вы можете удалить ветвление. Для этого выберите ветку, которую вы хотите удалить, затем щелкните правой кнопкой мыши и выберите «Delete branch» (Удалить ветку).

Virtual Studio Code: установка расширений

Установка расширений в Visual Studio Code позволит увеличить функционал редактора и получить более гибкий инструмент для работы с кодом. Рассмотрим некоторые из плагинов, который пользуются популярностью у разработчиков.

Модуль Git Lens

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

  1. Просмотр автора и времени изменения.
  2. Оставление комментариев и ассоциаций к коммитам, что помогает лучше понимать, за что отвечает каждый коммит.
  3. Просмотр истории коммитов в интерактивном режиме, что позволяет легко перемещаться между ними.
  4. Просмотр изменений в графическом режиме.
  5. Поддержка относительных путей, благодаря чему можно легко редактировать файлы, находящиеся в папках или в любом месте в репозитории.

Модуль Git Blame

Git Blame помогает отслеживать, кем и когда были внесены изменения в файлы в репозитории Git. Расширение отображает автора, коммит и время изменения каждой строчки кода. Также с его помощью можно оставлять комментарии к сделанным изменениям.

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

Модуль Git History

Git History – расширение, которое позволяет просмотреть историю коммитов в пользовательском интерфейсе VS Code. С его помощью можно быстро и эффективно пройтись по всей истории редактирования и перейти к нужным коммитам или файлам в проекте.

Расширение Git History предоставляет возможность эффективно управлять историей коммитов, ускоряет работу по разработке и требует меньшего времени для отслеживания изменений.

Заключение

Подключение Git к Visual Studio Code позволяет эффективно управлять версиями источников и отслеживать изменения. Visual Studio Code предоставляет интуитивный и удобный интерфейс для работы с Git, позволяя комфортно выполнять все необходимые операции, начиная от создания репозитория и выполнения коммитов, до отслеживания изменений и слияния веток.

A1.2 Приложение A: Git в других окружениях — Git в Visual Studio

Начиная с Visual Studio 2013 Update 1, пользователям Visual Studio доступен Git-клиент, встроенный непосредственно в IDE. Visual Studio уже в течение достаточно долгого времени имеет встроенные функции управления исходным кодом, но они были ориентированы на централизованные системы с блокировкой файлов, и Git не очень хорошо вписывался в такой рабочей процесс. Поддержка Git в Visual Studio 2013 была существенно переработана по сравнению со старой версией, и в результате удалось добиться лучшей интеграции Visual Studio и Git.

Чтобы воспользоваться этой функциональностью, откройте проект, который управляется Git (или выполните git init для существующего проекта) и выберите пункты View (Вид) > Team Explorer (Командный обозреватель) в главном меню. В результате откроется окно «Connect» («Подключить»), которое выглядит примерно вот так:

Подключение к Git-репозиторию из окна Team Explorer (Командный обозреватель)

Рисунок 157. Подключение к Git-репозиторию из окна Team Explorer (Командный обозреватель)

Visual Studio запоминает все проекты, управляемые с помощью Git, которые Вы открыли, и они доступны в списке в нижней части окна. Если в списке нет проекта, который вам нужен, нажмите кнопку «Add» («Добавить») и укажите путь к рабочему каталогу. Двойной клик по одному из локальных Git-репозиториев откроет главную страницу репозитория, которая выглядит примерно так «Домашняя» страница Git-репозитория в Visual Studio.

Это центр управления Git; когда вы пишете код, вы, вероятно, проводите большую часть своего времени на странице «Changes» («Изменения»), но когда приходит время получать изменения, сделанные вашими коллегами по работе, вам необходимо использовать страницы «Unsynced Commits» («Несинхронизированные коммиты») и «Branches» («Ветки»).

Подключаем Git для Visual Studio Code

Для контроля версий и быстрого доступа к файлам из любой точки, в которой есть Интернет, обычно используют GitHub. На локальном компьютере для этой цели используют программу Git. Поскольку сейчас самым популярным редактором кода является Visual Studio Code, рассмотрим, как подключить Git к этой программе и отправлять данные в репозиторий на GitHub.

Установка Git, регистрация на GitHub

Для начала нужно скачать Git , установить ее на свой компьютер (следуйте предлагаемым опциям) и зарегистрироваться на GitHub в качестве нового пользователя.

Регистрация на github

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

Создание репозитория

На компьютере вы запускаете Git Bash и вводите глобально свои данные, которые указывали при регистрации на GitHub.

$ git config — global user . name «TesterGitUser»
$ git config — global user . email «my_real_email@gmail.com»

Вместо «TesterGitUser» вы указываете свой логин на GitHub и вместо my_real_email@gmail.com — тот email, который указывали при регистрации.

Клонирование репозитория с GitHub

С помощью терминала

Теперь можно создать или открыть проект с помощью VSCode, инициализировать Git для этого проекта (по сути определенной папки на вашем компьютере). Для этого вы запускаете в этой папке VSCode, затем открываете терминал через пункт меню Terminal → New Terminal (или сочетанием клавиш Ctrl+ Shift + ` — или Ё в русской клавиатуре — сразу под клавишей Esc ). Проверьте, чтобы терминал был Git Bash по типу (хотя это не настолько принципиально, но удобно), а затем напечатайте команду:

Инициализация

Знак $ терминал поставит без вашего участия. Ваша задача — правильно напечатать команду ))

Кстати, для привычных нам Ctrl+С => Ctrl +V в Git Bash есть замена:

копирование: Ctrl + Ins , а вставка: Shift + Ins

В терминале вы увидите примерно такую строку:

Initialized empty Git repository in _____путь к вашей папке с проектом_____/.git

В вашей папке с проектом при этом появится скрытая папка .git , в которой Git, как программа, складывает свои файлы для управления версиями вашего проекта.

Теперь вы можете клонировать ваш репозиторий, созданный на GitHub, с помощью команды

Клонирование
$ git clone https : //github.com/user/ваша ссылка на проект

Если ваш проект содержит только файл Readme.md, то в папке с проектом на вкладке Files вы увидите только его. Если же вы клонируете чей-то проект с набором готовых к использованию файлов, то все они будут у вас в папке уже вашего проекта.

В процессе клонирования с помощью команды $ git clone автоматически создается удаленное подключение к исходному репозиторию (такое соединение называется origin ). Это позволяет разработчикам, создающим локальную копию центрального репозитория, легко загружать вышестоящие изменения или публиковать локальные коммиты. Именно поэтому большинство проектов на основе Git называют свой центральный репозиторий origin .

Визуально

Инициализацию и клонирование репозитория можно сделать также из-под графического интерфейса. Для этого вам нужно переключиться во вкладку Контроля версий — в английской версии Source Control ( Ctrl+Shift+G ). На скриншоте внизу иконка вкладки подсвечена зеленой обводкой.

Вначале вы должны инициализировать репозиторий нажатием кнопки Initialize Repository.

Теперь у вас появилась строка меню справа, которая позволяет клонировать Git репозиторий (Clone Git Repository). Нажатие на эту ссылку приводит к появлению выпадающего поля ввода сверху, в котором вы добавляете скопированную ссылку из своего Git-профиля. Вам нужно будет указать папку, куда вы собираетесь клонировать файлы.

Инициализация и клонирование репозитория

После клонирования VSCode спросит у вас, хотите ли вы открыть папку с клонированным репозиторием или добавить его в существующее рабочее пространство (Would you like to open the cloned repository, or add it to current workspace?). Удобней всего, пожалуй, открывать в новом окне.

В папке с проектом появится файл Readme.md, который вы добавили при создании своего репозитория.

Добавление файлов в проект и первый коммит

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

Изменения в файлах в VSCode

Тут нужно сделать некоторое отступление, чтобы объяснить, что Git и GitHub — это не одно и то же, как и репозиторий на вашей локальной машине и репозиторий на GitHub .

Дело в том, что Git — это программа, которая позволяет вам сохранять изменения во всех ваших файла проекта на локальном компьютере. Но при этом, как и любая другая программа, сама она ничего делать не будет. Ваш браузер ведь тоже не ищет сайты без вашего участия? Поэтому для начала вам нужно сказать (в терминале) или показать (в VSCode) программе Git на вашей машине, что именно вы хотите записать в виде версии ваших файлов. Для этого и существуют коммиты (commit). И, кстати, это все изначально будет сохраняться именно на вашем компьютере, а не в сети. Уйдут файлы в сеть тоже только после того, как вы это запишите в виде команды в терминале или выполните в VSCoode.

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

Создаем коммит визуально

Чтобы изменения появились и на Github, нужно создать первый коммит. Коммит (commit) — это сохранение конкретной версии файла внутри Git. В переводе с английского commit означает «фиксировать». Обычно говорят «закоммитить в Git» — значит отправить в Git определенную версию файла, к которой потом можно будет вернуться.

Для этого переходите в VSCode на вкладку Source Control и записываете некий осмысленный для ваших действий комментарий в поле Message, добавляете с помощью кнопки «+» ваш комментарий и изменения для отправки, и нажимаете кнопку Commit. Если вы передумали добавлять какой-то файл в репозиторий, нажмите кнопку «-» рядом с ним.

Если нужно отправить или удалить все помеченные в качестве измененных файлы, нажмите на «+» или «-» в строке Changes. Там же можно отменить выбор.

Git commit и push в VSCode

Для того чтобы ваши изменения «улетели» к тому же и на GitHub, можно выбрать из выпадающего списка справа от кнопки Commit пункт Commit & Push .

Если вы находитесь не в главной ветке репозитория, Git предложит вам синхронизировать ваши действия с помощью кнопки Sync Changes 1, которая запустит команду pull, за которой следует командой push. При нажатии на кнопку синхронизации VSCode выдаст вам окно с предупреждением «This action will pull and push commits from and to «origin/branch_name». Т.е. сначала вы получите данные из этой ветки, а потом только отправите свои.

Отправляем коммит из терминала

В терминале мы не увидим визуально, какие файлы Git считает измененными. Для проверки этого существует команда

Как подключиться к github из visual studio?

В Visual Studio уже встроен Git. Везде пишут только как скачать уже имеющийся удалённый репозиторий с git hub’а, но нигде, как подключиться к гитхаб аккаунту из visual studio Итак, у меня есть аккаунт на guthub, я создал приложение на локальном компе. Как мне через visual studio без доп плагинов подключиться к своему аккаунту, создать новый репозиторий и запушить папку с проектом в него?

Отслеживать
задан 26 июн 2018 в 15:18
Alexey Zolotov Alexey Zolotov
398 1 1 золотой знак 4 4 серебряных знака 16 16 бронзовых знаков

ru.stackoverflow.com/questions/847565/… Вот тут пишут о смежной проблеме, возможно там есть новая для вас информация.

28 июн 2018 в 8:55

2 ответа 2

Сортировка: Сброс на вариант по умолчанию

Открыть Team Explorer (View — Team Explorer), затем кликните по иконке штепселя (Manage Connection):

введите сюда описание изображения

Более подробное описание в документации

PS Ещё в меню View — Other Windows есть пункт Github, но я им не пользовался, так как гитхабом не пользуюсь так как мне приходится чаще с tfs работать.

Отслеживать
ответ дан 30 июн 2018 в 7:29
28.6k 21 21 золотой знак 59 59 серебряных знаков 141 141 бронзовый знак

Для GitLab и Githab, как подключиться из VS к удаленному аккаунту и добавить локальный проект в новый пустой репозиторий.

1) Сначала на gitlab.com создаем новый проект с названием, соответствующим локальному проекту. На Github так же, только Репозиторий.

введите сюда описание изображения

2) В Visual Studio в проекте нажимаем внизу окна кнопку «Добавить в систему управления версиями»=> git.

3) В разделе «Отправить в удаленный репозиторий» вводим URL-адрес созданного на сайте репозитория проекта, нажимаем Опубликовать. Проект должен загрузиться на сайт.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *