Для контроля версий и быстрого доступа к файлам из любой точки, в которой есть Интернет, обычно используют GitHub. На локальном компьютере для этой цели используют программу Git. Поскольку сейчас самым популярным редактором кода является Visual Studio Code, рассмотрим, как подключить Git к этой программе и отправлять данные в репозиторий на GitHub.
Установка Git, регистрация на GitHub
Для начала нужно скачать Git , установить ее на свой компьютер (следуйте предлагаемым опциям) и зарегистрироваться на GitHub в качестве нового пользователя.
Затем, залогинившись под своей учетной записью, создать первый репозиторий.
На компьютере вы запускаете Git Bash и вводите глобально свои данные, которые указывали при регистрации на GitHub.
|
1 2 3 |
$ 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 по типу 
(хотя это не настолько принципиально, но удобно), а затем напечатайте команду:
|
1 |
$ git init |
Знак $ терминал поставит без вашего участия. Ваша задача - правильно напечатать команду ))
Кстати, для привычных нам Ctrl+С => Ctrl +V в Git Bash есть замена:
копирование: Ctrl + Ins, а вставка: Shift + Ins
В терминале вы увидите примерно такую строку:
Initialized empty Git repository in _____путь к вашей папке с проектом_____/.git
В вашей папке с проектом при этом появится скрытая папка .git, в которой Git, как программа, складывает свои файлы для управления версиями вашего проекта.
Теперь вы можете клонировать ваш репозиторий, созданный на GitHub, с помощью команды
|
1 |
$ 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 отследила, что изменения есть, но пока вы ничего не записали об этих изменениях. С одной стороны, если вы добавили несколько символов, то это уже некое изменение, с другой - сохранять в репозитории каждый мелкий шаг вряд ли имеет смысл.
Тут нужно сделать некоторое отступление, чтобы объяснить, что Git и GitHub - это не одно и то же, как и репозиторий на вашей локальной машине и репозиторий на GitHub .
Дело в том, что Git - это программа, которая позволяет вам сохранять изменения во всех ваших файла проекта на локальном компьютере. Но при этом, как и любая другая программа, сама она ничего делать не будет. Ваш браузер ведь тоже не ищет сайты без вашего участия? Поэтому для начала вам нужно сказать (в терминале) или показать (в VSCode) программе Git на вашей машине, что именно вы хотите записать в виде версии ваших файлов. Для этого и существуют коммиты (commit). И, кстати, это все изначально будет сохраняться именно на вашем компьютере, а не в сети. Уйдут файлы в сеть тоже только после того, как вы это запишите в виде команды в терминале или выполните в VSCoode.
GitHub - это облачное хранилище ваших данных, которое позволяет отправлять и хранить все версии вашего проекта в Интернете. Однако само по себе это тоже не случится. Вам нужно будет опять-таки набрать команду ручками в терминале или сделать это с помощью определенных опций в VSCoode.
Создаем коммит визуально
Чтобы изменения появились и на Github, нужно создать первый коммит. Коммит (commit) - это сохранение конкретной версии файла внутри Git. В переводе с английского commit означает «фиксировать». Обычно говорят "закоммитить в Git" - значит отправить в Git определенную версию файла, к которой потом можно будет вернуться.
Для этого переходите в VSCode на вкладку Source Control и записываете некий осмысленный для ваших действий комментарий в поле Message, добавляете с помощью кнопки "+" ваш комментарий и изменения для отправки, и нажимаете кнопку Commit. Если вы передумали добавлять какой-то файл в репозиторий, нажмите кнопку "-" рядом с ним.
Если нужно отправить или удалить все помеченные в качестве измененных файлы, нажмите на "+" или "-" в строке Changes. Там же можно отменить выбор.
Для того чтобы ваши изменения "улетели" к тому же и на 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 считает измененными. Для проверки этого существует команда
|
1 |
$ git status |
В случае ее использования вы можете получить что-то вроде такого сообщения (зависит от названий файлов в вашем проекте и изменений в них):
|
1 2 3 4 5 6 |
Untracked files: (use "git add <file>..." to include in what will be committed) script.js index.html nothing added to commit but untracked files present (use "git add" to track) |
То есть здесь видно, какие файлы были изменены и есть подсказка, какую команду использовать в терминале. Например, для того, чтоб отправить коммит только об index.html, нужно написать
|
1 2 3 4 5 |
$ git add index.html //добавляем только файл index.html $ git add css/style.css //добавляем файл из папки css $ git add . //добавляем все файлы из папки |
После указания, какие файлы подлежат коммиту, нужно сделать этот самый коммит командой:
|
1 |
$ git commit -m "First commit" |
Внутри Git создастся состояние файла, которой вы в него таким образом отправили (закоммитили). У него будет определенный хеш (что-то вроде id), по которому Git его всегда может "узнать". Поэтому вы можете вернуться к этому файлу в его "закоммиченном" состоянии.
Чтобы объединить добавление файлов с отправкой коммита, можно записать команду
|
1 2 3 4 |
$ git commit -a -m "Message" //например: $ git commit -a -m "Change readme" |
Коммитов можно сделать много, при любых ваших изменениях отправляя версию файла в Git командой commit. Git хранит всю историю ваших коммитов, поэтому вы можете к любому из них вы можете вернуться, когда потребуется.
Кстати, для отмены команды git add используется команда git reset.
Просмотр коммитов
Для просмотра истории коммитов существует команда
|
1 |
$ git log |
После этого вам Git вам выдаст список коммитов, в котором для каждого будет указан номер (хэш), автор, дата/время и ваш комментарий. Именно хэш вы можете использовать для возврата к какому-либо состоянию вашего файла + команда
|
1 |
$ git checkout [commit_id] |
Удаление коммита
Отменить определённый коммит в git нужно командой:
|
1 |
$ git revert [commit_id] |
Например, вы через $ git log узнали, что хэш вашего коммита d909363396f6345e451c1960713ccb0f6c70bc85. Теперь вы можете отменить этот коммит командой git revert с указанием его хэша:
|
1 |
$ git revert d909363396f6345e451c1960713ccb0f6c70bc85 |
Отправка файлов на GitHub
Для того чтобы загрузить коммиты из локального репозитория на удаленный, т.е. на GitHub, нужно из "запушить", т.е. выполнить команду
|
1 |
$ git push origin main |
В данном случае origin - это основная ветка удаленного репозитория, main - название современной главной ветки в репозитории (ранее обычно было master).
Однако тут можно получить ошибку. Дело в том, что если вы клонировали файлы с определенного удаленного репозитория, как описывалось в самом начале, то все ок - ваши изменения уйдут на GitHub и отобразятся там в скором времени. Но, если вы делали изменения лишь на локальной машине, например, в абсолютно новом проекте, хоть и создали удаленный репозиторий, ничего никуда не отправится, т.к. что такое origin Git неизвестно.
Для того чтобы ваш проект был связан, как origin с репозиторием на GitHub, нужно сначала указать ссылку на него в команде
|
1 2 3 4 |
$ git remote add origin url_repository //например $ git remote add origin https://github.com/user_name/repo_name |
Причем очень желательно сделать это в самом начале, еще до первого коммита. А потом уже выполнить push
|
1 |
$ git push origin main |
Для того чтобы проверить путь к вашему удаленному репозиторию, наберите команду
|
1 |
$ git remote -v |
Если есть какие-либо проблемы с определением удаленного репозитория, используйте команду
|
1 2 3 4 |
$ git remote set-url origin main_branch_name //например: $ git remote set-url origin https://github.com/user_name/user_repo |
Получение последних коммитов из удаленного репозитория
Поскольку над одним проектом в разное время может работать несколько человек, перед внесением своих изменений необходимо убедиться, что в у вас на компьютере содержатся последние изменения из удаленного репозитория. Чтобы посмотреть изменения и получить данные о последних коммитах, выполните команду $ git fetch.
Команда fetch загружает данные из удаленного репозитория изолировано от ваших файлов, не применяя изменений для вашего проекта, т.е. позволяет безопасно просмотреть коммиты, перед тем как интегрировать их в локальный репозиторий.
В случае, если нужно загрузить и использовать все изменения, появившиеся на Github, нужно выполнить команду $ git pull .
Ветки репозитория. Создание новой ветки
В том случае, когда вы работаете не один, а в команде или вам нужно внести какие-либо изменения в существующий уже проект, но вы не уверены, что эта версия будет лучше того, что уже есть, имеет смысл сохранять все денные в новой ветке(-ах).
Под веткой принято понимать независимую последовательность коммитов в хронологическом порядке. Однако конкретно в Git реализация ветки выполнена как указатель на последний коммит в определенной ветке. После создания ветки уже новый указатель ссылается на текущий коммит.
Имя основной ветки Git-проекта по умолчанию — master (однако на GitHub часто это main), и она создается сразу при инициализации репозитория. Эта ветка ничем не отличается от остальных и также ее можно переименовать, но по договоренности master (main) принято считать главной веткой в проекте.
Используем терминал
Для того чтобы создать ветку из терминала, нужно написать команду
|
1 2 3 4 |
$ git branch new_branch_name //например $ git branch endfiles |
Переключиться на новую (или любую созданную) ветку можно командой git checkout:
|
1 2 3 4 |
$ git checkout branch_name //например: $ git checkout testing |
Можно не только создать ветку, но и сразу на нее переключиться, немного модифицировав команду checkout:
|
1 |
$ git checkout -b new_branch_name |
После внесения изменений в новой ветке необходимо сделать коммит, чтобы сохранить код. Для этого используйте команды: git add . А затем можно "запушить", т.е. отправить добавленные файлы в новую ветку, но уже на удаленном репозитории:
|
1 2 3 4 |
$ git push origin your_branch_name //например: $ git push origin testing |
Вы можете проверить свой репозиторий на Github - там должна появиться новая ветка со всеми файлами, которые вы в нее добавили.
Визуальное создание веток в Visual Studio Code
То же самое можно проделать с помощью программы Visual Studio Code, причем находясь в любой вкладке Visual Studio Code.
Вам нужно кликнуть по названию текущей ветки (тут тоже обычно это main или master) в нижней строке Visual Studio Code и ввести название новой ветки, а затем выбрать пункт меню Create new branch.
Затем вы каким-то образом меняете свои файлы, добавляете их для коммита знаком "+", как это описывалось ранее, вводите комментарий и выполняете первый коммит уже для новой ветки. Если вам нужно отправить файлы на Github, а там эта ветка еще не существует, то при выборе опции Commit & Push вы получите запрос, который предложит вам эту ветку опубликовать. Нажимайте "Ок" и через некоторое время проверяйте ее на сервере.
Переключение между ветками
Через терминал
Для переключения между ветками Git существует команда
|
1 |
$ git checkout branch_name |
где branch_name - это имя нужной вам ветки.
Визуально
Вам нужно сделать клик по названию ветки слева внизу в VSCode и в выпадающем списке сверху выбрать нужную ветку. Внизу стоит все время контролировать, в какой ветке в данный момент вы находитесь.
Переименовываем ветку
Для локальной ветки (только на вашем компьютере)
Прежде чем вы что-то будете переименовывать, убедитесь, что вы выбрали ветку, которую хотите переименовать:
|
1 |
$ git checkout old_branch_name |
Если вы хотите посмотреть все локальные ветки, используйте следующую команду:
|
1 |
$ git branch --list |
Чтобы переименовать текущую ветку Git, добавьте к команде флаг -m:
|
1 |
$ git branch -m new_branch_name |
Вы также можете переименовать локальную ветку, находясь на другой ветке, используя следующие две команды:
|
1 2 |
$ git checkout master $ git branch -m old_branch_name new_branch_name |
Для ветки в репозитории Github
Для начала нужно проделать все шаги выше, чтоб переименовать локальную ветку. Затем удалите старую ветку и запуште новую. Сделать это можно с помощью следующих простых команд:
|
1 2 |
git push origin --delete old_branch_name git push origin :old_branch_name new_branch_name |
Выгрузите новую ветку и «закрепите» её за локальной командой
|
1 |
git push origin -u new_branch_name |
Визуально в VSCode
Переименовать ветку вы можете, нажав Ctrl + Shift + P (вызов окна команд из меню Help → Show All Commands), введя часть слова Rename или полностью и выбрав команду Rename Branch. Вводите нужное имя и контролируете, что оно появилось в строке VSCode внизу слева.
Слияние веток - merge
Для слияния веток, как вы догадались уже, наверное, используют команду
|
1 |
$ git merge branch_name |
Однако процесс может пройти просто и не очень просто в том случае, если история веток шла разными путями, например, правки вносились разными разработчиками. Возможно сначала вам нужно будет выполнить команду $ git pull для того, чтобы забрать изменения с удаленного репозитория, а потом уже выполнять слияние.
Временами имеет смысл сначала сделать $ git rebase branch_name для того, чтобы выравнять историю изменений, а потом уже совмещать ветки.
Удаление ветки
В терминале
Для удаления локальной ветки служит команда
|
1 2 3 4 |
$ git branch -D branch_name //например: $ git branch -D testing |
С репозитория на Github
Тут команда несколько длиннее:
|
1 2 3 4 |
$ git push --delete origin branch_name //например $ git push --delete origin testing |
Визуальное выполнение команд в Visual Studio Code
Находясь на вкладке Source Control (контроль версий) в Visual Studio Code, вы можете в верхней строке меню этой вкладки выбрать любую команду, которая вам необходима на данный момент. Некоторые наиболее часто используемые команды вынесены в виде кнопок в строку меню этой вкладки.
Вам нужно только правильно понимать, что именно вы хотите сделать, а в случае, если у вас существует еще и несколько веток, следить за тем, в какой из них вы сейчас находитесь.
Пункт меню Show Git Output покажет вам консоль Git-команд в отдельном терминале. При желании вы можете с ними подробнее разобраться в каждом отдельном случае.
