Rivalry2

HTML Diff

0 added 0 removed

Original 2026-01-01

Modified 2026-02-21

1 <a>#статьи</a>

2 <ul><li>6 фев 2023</li>

3 <li>0</li>

4 </ul>Разбираемся, как использовать встроенные функции редакторов кода и IDE для работы с GitHub и забыть про командную строку.

5 Иллюстрация: Катя Павловская для Skillbox Media

6 Когда веб-версия и GUI-клиент уже надоели, появляется мысль работать с репозиториями напрямую, минуя промежуточные звенья в виде дополнительного софта. Так получается быстрее и эффективнее, ведь код загружается прямо из вашего любимого редактора или IDE.

7 Как это сделать - читайте во второй части нашего руководства по GitHub (<a>а вот первая</a>).

8 Список редакторов кода и IDE, с которыми дружит GitHub, довольно внушительный, поэтому многие даже составляют топы таких интеграций. Здесь нужно кое-что уточнить: GitHub можно связать не только с IDE - есть варианты для<a>Telegram</a>,<a>Slack</a>, Microsoft Teams и не только.

9 В этом руководстве мы коснёмся только самого необходимого - десктопного клиента и интеграции со средами разработки.

10 В настройках нативного GUI-клиента GitHub есть опция под названием Integrations, но настоящей интеграцией её можно назвать очень условно - речь скорее об открытии исходников в вашем репозитории через установленный на ПК редактор или IDE.

11 Выбор редактора кода по умолчанию в GUI-клиенте GitHub DesktopСкриншот: Skillbox MediaДанной опцией мы просто выбираем<a>дефолтный редактор</a>для открытия файла. Чтобы её настроить, зайдите в File → Options → Integrations.

12 Поддерживаются следующие редакторы:

13 <ul><li>Visual Studio Code,</li>

14 <li>Visual Studio Codium,</li>

15 <li>Sublime Text,</li>

16 <li>ColdFusion Builder,</li>

17 <li>Typora,</li>

18 <li>SlickEdit,</li>

19 <li>JetBrains IntelliJ IDEA,</li>

20 <li>JetBrains WebStorm,</li>

21 <li>JetBrains PhpStorm,</li>

22 <li>JetBrains Rider,</li>

23 <li>JetBrains CLion,</li>

24 <li>JetBrains PyCharm,</li>

25 <li>JetBrains RubyMine,</li>

26 <li>JetBrains GoLand,</li>

27 <li>Android Studio,</li>

28 <li>Brackets,</li>

29 <li>Notepad++,</li>

30 <li>RStudio,</li>

31 <li>Aptana Studio.</li>

32 </ul>А теперь - к более полезным интеграциям.

33 В целом начать работать с GitHub можно сразу же: достаточно перейти в боковой панели на вкладку"Проводник"или"Система управления версиями", нажать на кнопку"Клонировать репозиторий", вставить правильную ссылку на него и выбрать место для сохранения папки на вашем ПК.

34 Клонирование удалённого GitHub-репозитория стандартными средствами в Visual Studio CodeСкриншот: Skillbox MediaРепозиторий скачается в эту папку и откроется на вкладке"Проводник".

35 Открытие клонированного удалённого GitHub-репозитория в проводнике Visual Studio CodeСкриншот: Skillbox MediaЧтобы внести в исходный код какие-либо изменения, открываем файл, делаем всё необходимое и сохраняем. Дальше на вкладке"Система управления версиями"появится уведомление о новых изменениях, которые нужно запушить - то есть синхронизировать с удалённым репозиторием.

36 Пушим изменения из локального GitHub-репозитория в удалённыйСкриншот: Skillbox MediaВыбираем вариант"Фиксация", вводим комментарий к изменениям и кликаем на "Синхронизировать изменения".

37 Внесённые правки отобразились и в веб-версии GitHub-репозиторияСкриншот: Skillbox MediaТеперь, если мы обновим страницу нашего репозитория в веб-версии, то увидим новые правки.

38 Всё это отлично работает, но что, если этих функций нам недостаточно? В этом случае<a>для более полной интеграции</a>VS Code с GitHub можно скачать в маркетплейсе Visual Studio официальное расширение<a>GitHub Repositories</a>. Оно позволяет работать с репозиториями напрямую, без клонирования, из функций: поиск, обзор, редактирование и коммиты (в общем, мастхэв).

39 Страница расширения GitHub Repositories для Visual Studio CodeСкриншот: Skillbox MediaУстановка расширения GitHub Repositories из VS CodeСкриншот: Skillbox MediaЕго можно установить как по ссылке, так и из самого редактора кода - во втором случае нужно перейти на вкладку"Расширения"в левой панели, ввести в строку поиска "GitHub", выбрать в списке нужный вариант и нажать"Установить".

40 Когда начнёте работу с расширением, оно попросит выполнить простую авторизацию.

41 Авторизация в расширении GitHub Repositories для Visual Studio Code (шаг 1)Скриншот: Skillbox MediaАвторизация в расширении GitHub Repositories для Visual Studio Code (шаг 2)Скриншот: Skillbox MediaАвторизация в расширении GitHub Repositories для Visual Studio Code (шаг 3)Скриншот: Skillbox MediaПосле установки расширения в проводнике появляется опция"Открыть удалённый репозиторий".

42 Появилась новая опция: "Открыть удалённый репозиторий"Скриншот: Skillbox MediaТеперь выберите её и далее введите в строке поиска ссылку на нужный репозиторий (или выберите его из списка). Он откроется в проводнике без клонирования. Коммиты в него можно вносить так же, как мы показывали выше.

43 Если вам не хватило этих функций, есть ещё одно официальное расширение под названием<a>GitHub Pull Requests and Issues</a> - только для работы с пул-реквестами и блоком Issues, соответственно.

44 Страница расширения GitHub Pull Requests and Issues для Visual Studio CodeСкриншот: Skillbox MediaУстановка расширения GitHub Pull Requests and Issues из VS CodeСкриншот: Skillbox MediaПроцесс установки расширения и авторизации аналогичный.

45 Авторизация в расширении GitHub Pull Requests and Issues для Visual Studio Code (шаг 1)Скриншот: Skillbox MediaАвторизация в расширении GitHub Pull Requests and Issues для Visual Studio Code (шаг 2)Скриншот: Skillbox MediaАвторизация в расширении GitHub Pull Requests and Issues для Visual Studio Code (шаг 3)Скриншот: Skillbox MediaЧерез несколько секунд на боковой панели появится гитхабовский значок с котом, который ведёт в меню со списком pull requests и issues.

46 В IDE от JetBrains поддержка GitHub есть<a>по умолчанию</a>, остаётся лишь подключить свой аккаунт, причём во всех "родственниках" IDEA эти функции работают почти одинаково. Мы рассмотрим их на примере PyCharm - вот так вот мы хотим :)

47 Чтобы попасть в нужный раздел настроек, перейдите по путиFile → Settings → Version Control → GitHub.

48 Настройки PyCharm с выбором системы контроля версийСкриншот: Skillbox MediaЗдесь надо выбрать единственный вариантAdd account, и IDE сразу перенаправит вас на страницу подтверждения авторизации.

49 Авторизация на GitHub в PyCharm (шаг 1)Скриншот: Skillbox MediaАвторизация на GitHub в PyCharm (шаг 2)Скриншот: Skillbox MediaКогда закончите с авторизацией, можно будет просматривать GitHub-репозитории прямо из PyCharm. Вообще, способ будет зависеть от того, вошли вы в какой-нибудь проект или ещё нет, а также от того, связан ли уже проект с системой контроля версий.

50 Клонирование репозитория в PyCharm на этапе создания нового проектаСкриншот: Skillbox MediaЕсли находитесь в стартовом меню выбора проекта, нужно выбрать в правом верхнем углу вариантGet from VCS(сокращение от version control system). Длявыбора из списка своих репозиториев нужно выбратьGitHub, а для клонирования репозитория по ссылке - вариантRepository URL(авторизоваться на GitHub можно и на этом этапе).

51 Если какой-то проект уже открыт, нужно перейти в менюVSC → Get from Version Control(для локального проекта) илиGit →Clone(для удалённых репозиториев и проектов, у которых выбрана система контроля версий).

52 Меню Git в PyCharmСкриншот: Skillbox MediaКогда выбран нужный метод работы, должен появиться пункт менюGit, а не VSC: если в открытом проекте отображаетсяVSC, нужно связать его с системой контроля версий, выбравVSC→Enable Version Control Integration → Git→OK.

53 Когда проект связан с Git, из соответствующего меню можно полноценно работать с GitHub - делать коммиты, пуши, переключаться между ветками и так далее. Также внизу справа появится значок ветки, через него тоже можно работать с репозиторием.

54 Под капотом современной Android Studio уже знакомая нам IDE от JetBrains, так что интерфейс почти идентичен PyCharm.

55 Авторизация в расширении GitHub для Android Studio (шаг 1)Скриншот: Skillbox MediaАвторизация в расширении GitHub для Android Studio (шаг 2)Скриншот: Skillbox MediaЗдесь тоже можно настроить интеграцию и клонировать проект уже на стартовом экране: для этого достаточно выбратьGet from VCS.

56 Авторизация в расширении GitHub для Android Studio (шаг 3)Скриншот: Skillbox MediaДля существующих проектов список шагов также ничем не отличается: выбираем систему контроля версий, логинимся и улыбаемся пушим, клонируем, коммитим.

57 Чтобы работать с GitHub-репозиториями внутри некогда суперпопулярной, а ныне утратившей свои позиции IDE Eclipse, нужен официальный Git-плагин<a>EGit</a>, который ставится по умолчанию - при установке самого приложения. После настройки из него будет доступен и GitHub.

58 Проверка установки плагина EGit в Eclipse IDEСкриншот: Skillbox MediaПроверить доступность плагина можно в разделеHelp → Eclipse Marketplace(в строке поиска нужно вбить "EGit"), а документацию вы найдёте<a>здесь</a>.

59 Поиск вкладки с Git в Eclipse IDE. Первый способ (шаг 1)Скриншот: Skillbox MediaНужную менюшку потребуется включить: она спрятана по путиWindow → Perspective → Open Perspective → Other → Git. Выбираем вариантGitи жмёмOpen, после чего в интерфейсе появится необходимая панель. Второй способ доступа:Window → Show View → Git Repositories.

60 Поиск вкладки с Git в Eclipse IDE. Первый способ (шаг 2)Скриншот: Skillbox MediaЖеланная панель Git Repositories в Eclipse IDEСкриншот: Skillbox MediaЧтобы клонировать публичный GitHub-репозиторий, выберите на новой панели вариантClone a Git repositoryи вставьте полную ссылку. Выбираем локальное расположение - и готово (указывать логин и пароль необязательно).

61 Клонирование удалённого GitHub-репозитория в Eclipse IDE (шаг 1)Скриншот: Skillbox MediaКлонирование удалённого GitHub-репозитория в Eclipse IDE (шаг 2)Скриншот: Skillbox MediaС приватным репозиторием чуть сложнее: для его клонирования понадобитсяв качестве пароляуказать токен, который нужно создать в настройках аккаунта GitHub:Settings → Developer settings → Personal access tokens → Tokens (classic) → Generate new token → проставляете разрешения для токена → Generate token.

62 Коммит в Eclipse IDE (шаг 1)Скриншот: Skillbox MediaЧтобы сделать коммит из локальной версии репозитория, файл-исходник должен лежать в рабочей директории (или быть уже скачан в неё). Перейдите на вкладкуGit Stagingи убедитесь, что изменённый файл указан в полеUnstaged Changes("Неустановленные изменения").

63 Коммит в Eclipse IDE (шаг 2)Скриншот: Skillbox MediaДальше его нужно добавить в полеStaged Changesнажатием на плюсик, указать сообщение и нажатьCommit and Push.

64 Конечно, возможность использовать GitHub<a>есть</a>и в нативной эппловской IDE.

65 Для начала задаём дефолтные имя и email, которые будут использоваться во всех ваших проектах: это делается в Preferences → Source Control →вкладкаGit(если её нет, нужно выбрать опциюEnable Source Controlна вкладкеGeneral).

66 Настройка данных "автора коммитов"Скриншот:<a>developer.apple.com</a>Чтобы одновременно с созданием нового проекта создать и локальный репозиторий, просто поставьте галочку в пунктеCreate Git repository on my Mac.

67 Создаём локальный репозиторийСкриншот:<a>developer.apple.com</a>Как и в предыдущих случаях, если вы не кулхацкер, для работы с удалёнными GitHub-репозиториями понадобится залогиниться:Preferences → Accounts →нажмитекнопку добавления (+) →выберитетип аккаунта → Continue. В новом диалоге создаёте токен GitHub(Create a Token on GitHub)или вставляете уже существующий.

68 Авторизуемся на GitHub и подключаемся к репозиториюСкриншот:<a>developer.apple.com</a>Теперь для копирования репозитория с GitHub достаточно пройти по пути Source Control → Cloneи выбрать нужный репозиторий (или вставить ссылку на него).

69 Клонируем удалённый репозиторийСкриншот:<a>developer.apple.com</a>Синхронизация локального и удалённого репозитория делается следующим образом:

70 <ul><li>Связываете существующий репозиторий с удалённым, кликнув с зажатымCtrlна папкеRemotesвнутри вашего проекта и выбравAdd Existing Remote.</li>

71 <li>Указываете название и URL удалённого репозитория.</li>

72 <li>НажимаетеAdd.</li>

73 </ul>После этого можно подтягивать изменения в удалённом репозитории, выполняя<a>pull</a>- или<a>fetch-запросы</a>соответственно (Source Control → PullилиSource Control → Fetch Changes). Для пуша изменений из локального репозитория в удалённый потребуется выбратьSource Control → Push.

74 Конечно, это далеко не все доступные варианты интеграции GitHub с IDE - да и внутри уже перечисленных IDE есть куча дополнительных функций для продвинутой работы с самым популярным хостингом проектов. Для других, менее популярных, IDE и редакторов кода метод работы с GitHub будет почти таким же. А если какие-то нюансы будут непонятны, то последуйте совету RTFM - почитайте доку :)

75 <a>Бесплатный курс по Python ➞Мини-курс для новичков и для опытных кодеров. 4 крутых проекта в портфолио, живое общение со спикером. Кликните и узнайте, чему можно научиться на курсе. Смотреть программу</a>