Github: настройка и первая публикация проекта

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

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

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

Перейдите в каталог, в который мы хотим клонировать репозиторий, и затем используйте эту команду. Если ваше окно терминала поддерживает это, вы можете скопировать и вставить веб-адрес в команду. Нажмите Ctrl + Shift + V, чтобы вставить в окно терминала GNOME.

Git клонирует удаленный репозиторий и создает на вашем компьютере локальный. Он сообщает нам, что клонируется в каталог под названием «ящики».

Каталог боксов создается в каталоге, из которого вы запустили команду git. Если мы переключимся в каталог box и посмотрим на его содержимое, мы увидим тот же список файлов и папок, который мы видели на странице GitHub.

Большой! Мы успешно клонировали исходный код и другие файлы на наш компьютер. Теперь нам нужно создать приложение.

Create a new repository in Github.

1. Create an account on GitHub at www.github.com. Alternatively, sign-in if you already have an account.
2. Create a new repository by clicking on the + sign next to your account on the right top corner of the page or by navigating to https://github.com/new.
3. On the screen to create the new repository, choose a Repository name and if the repository is Public (free) or Private (available with paid subscription only). Do not tick the checkbox Initialize this repository with a README so that GitHub does not create a default master branch. It would conflict with Visual Studio Team Explorer which will want to create the master branch when publishing a solution for the first time. We can create a README as well as add any other files later on.
   Finally, click on the Create repository button.
4. We now have an empty repository. Take note of the git repository URL (which ends in .git) as it will be needed later on. As a reminder, refrain from the temptation of adding a README file or any other file right now as it would create a master branch which will conflict with Visual Studio when we sync Visual Studio’s local Git repository to the remote Git repository hosted on github.com.

Добавляем удалённый репозиторий

Репозиторий — это файловое хранилище проектов. На бесплатном тарифе можно загружать до 500 МБ данных и создавать неограниченное количество репозиториев.

Чтобы создать репозиторий, нажмите на кнопку New repository, назовите проект и кликните Create repository. Можно добавить описание проекта, сделать его публичным или приватным и прикрепить технические файлы:

• README file содержит подробное описание проекта — так другие разработчики узнают, какой репозиторий они смотрят и зачем он нужен.
• Gitignore позволяет сэкономить место и не заливать на GitHub лишние файлы. Например, можно исключить скрытые файлы Mac OS.
• License добавляет к коду ссылку на первоисточник и защищает права разработчика. Лицензия позволяет понять, как правильно использовать чужой код и можно ли его свободно внедрять в коммерческие проекты.

Мы создаём тестовый репозиторий, поэтому обойдёмся без лицензии — выберем только два дополнительных файла: README file и gitignore. Если вы пока не знаете, что писать в README file и что добавлять в gitignore, — оставьте эти файлы пустыми или посмотрите инструкцию в разделе Read the guide.

Мы создали публичный репозиторий и будем хранить файлы в папке test
Мы создали публичный репозиторий и будем хранить файлы в папке test

• Переходим на сайт gitignore.io.
• Добавляем macOS или другую операционку, с которой вы работаете.
• Жмём Create и получаем нужный служебный файл.
• Копируем данные и переносим их в файл gitignore на GitHub.

После редактирования gitignore делаем коммит — записываем в историю проекта факт того, что мы установили ограничение для файлов Mac OS.

Деплой сборки.

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

Я создам новый репозиторий на основе шаблона, в котором нет даже html файла. Опять не забываем что должен быть публичный репозиторий.

Тут я пойду другим путём и возьму уже готовый файлик из статьи коллеги

Прямо в интерфейсе репозитория создам файл:

1. Add file
2. Create new file

Как добавить новый файл

В появившемся окошке добавляю название папок и файла

Как создать новый файл

Вставлю код из статьи:

YMLкопировать

В действиях работы этого экшена стоит отметить следующее: Setup Node это настройка версии node.js. Если у вас последняя версия – можно удалить этот пункт или указать действующую. Так же есть возможность устанавливать несколько версий ноды

Так же в моём репозитории нет линтеров – по этому я удалю Run checks.

Установка зависимостей Install dependencies. Так как у меня нет package-lock.json, я вместо добавлю .

Далее сборка установки Build project. Для работы подобных задач необходимо проверить package.json: в разделе должна быть строка . (Замените на ваши команды.)

Ну и последний шаг работы: Deploy

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

Сохраняем файл и ждем выполнения экшена.

Если у вас ошибка как у меня: Если у вас ошибка как у меня — , то решить этот вопрос просто:

Заходим в настройки, Actions, General, и где Workflow permissions ставим точку Read and write permissions

Порядок действий

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

Настройки, Pages, выбераем ветку gh-pages, папка должна быть /(root), сохраняем папку и всё готово.

Порядок действий

Так же ждем появления ссылки, как и в первом варианте, и можем радоваться))

Create pull requests

To create a pull request after the changes in the local repository has been pushed to the remote repository on GitHub, you’ll need to do the following:

1. Click on the GitHub Pull Request tab to open the Pull Requests view.
2. Click on the + button.
3. Choose the target branch for the pull request and hit the Enter key.

If your branch hasn’t been published yet, the extension will do it for you. After completing the first three steps above, VS Code will prompt you to pick a name for the branch and hit the Enter key.

After publishing the branch, you’ll need to select a title for the pull request. From the menu, as seen in the screenshot below, you can use the latest commit message, the branch name, or specify a custom title.

Once you select the pull request title, your pull request will be created.
You can add a code reviewer and label if you want.

Получение исходных кодов из репозитория

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

1. Загрузка ZIP-архива

Самым простым и быстрым способом получения исходных кодов репозитория является загрузка ZIP-архива с GitHub. Для этого вам необходимо найти на странице репозитория кнопку «Code» и нажать на нее. В выпадающем меню выберите пункт «Download ZIP».

После этого начнется загрузка ZIP-архива с исходными кодами репозитория на ваш компьютер. Разархивируйте его в удобное для вас место. Теперь у вас есть все необходимые исходники для работы с программой.

2. Клонирование репозитория с использованием Git

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

Далее выполните команду:

Вместо «ссылка_на_репозиторий» вставьте ссылку на репозиторий, которую вы можете найти на странице репозитория на GitHub (кнопка «Code» -> «HTTPS» или «SSH»). После выполнения этой команды Git склонирует репозиторий на ваш компьютер.

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

3. Использование GitHub Desktop

Для более удобной работы с репозиториями на GitHub вы можете использовать GitHub Desktop. Это графический интерфейс для Git, который позволяет клонировать, редактировать и синхронизировать репозитории.

Скачайте и установите GitHub Desktop с официального сайта. После установки откройте приложение и войдите в свою учетную запись GitHub.

Затем нажмите на кнопку «Clone a repository from the Internet» и введите URL репозитория, который вы хотите склонировать. Нажмите «Clone» и выберите папку, в которую вы хотите склонировать репозиторий.

GitHub Desktop загрузит все исходные коды репозитория на ваш компьютер. Теперь вы можете легко работать с ними и делать необходимые изменения.

4. Получение исходных кодов через API GitHub

Если у вас есть опыт работы с API, вы можете использовать GitHub API для получения исходных кодов репозитория. Подробнее об этом можно узнать в документации GitHub API.

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

Создаём новую ветку и добавляем в проект внесённые изменения

Добавим к проекту пустой CSS-файл и подключим его к HTML. После этого в меню редактора появятся два цвета: HTML-файл подсветится оранжевым, а CSS-файл — зелёным. Оранжевый означает, что файл уже есть в удалённом репозитории и его нужно обновить. Зелёный — файла нет в репозитории. Переходим в GitHub Desktop и добавляем коммит для этого изменения.

Подсветка файлов в меню меняется после добавления или редактирования файлов — это подсказка, чтобы мы не забывали обновлять репозиторий

Если мы откроем созданную страницу в браузере, то это будет несколько строчек текста на белом фоне. Представим такую ситуацию: нам нельзя изменять код проекта, но нужно посмотреть, как будет выглядеть страница на красном фоне. Чтобы сделать это — добавим в репозиторий новую ветку:

• Переходим в GitHub Desktop.
• Открываем раздел Current Branch, нажимаем кнопку New Branch, пишем название новой ветки и кликаем Create New Branch.
• Возвращаемся в редактор кода и тестируем идею.

После создания новой ветки не забудьте нажать на Push origin, чтобы изменения попали в удалённый репозиторий на сайте GitHub.

Создаём новую ветку в GitHub Desktop
Тестируем изменения, добавленные в новую ветку. Основная ветка в этот момент находится в прежнем состоянии и сохраняет свой код

Предположим, наша идея с красным фоном оказалась удачной и код нужно залить в основную ветку. Чтобы это сделать, переходим сайт GitHub, нажимаем кнопку Сompare & pull request и подтверждаем изменения кнопкой Merge pull request. Последний шаг — переходим в GitHub Desktop, кликаем Fetch origin и синхронизируемся с удалённым репозиторием. Теперь код из дополнительной ветки попал в основную, а изменения есть на ПК и в облаке.

Основные операции для работы с git

Clone

Первое, чему стоит научиться – это снимать копию проекта из удалённого репозитория в локальный.
Делается это довольно просто:

Clone

Затем копируем ссылку репозитория, созданного на Гитхабе (шаг 2)

Ссылка на репозиторий

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

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

Commit

Репозиторий готов – пора приступать к работе.
Написанный код мы помещаем в локальный репозиторий  — папку .git (путь к которой мы указали в операции clone).

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

Если всё прошло успешно, в окошке SmartGit’а появится скопированный файл.

Новый файл в SmartGit

Для того чтобы зафиксировать изменения в локальном репозитории, нажимаем кнопку Commit.

Commit

В открывшемся окне пишем пояснительный комментарий к сохраняемому файлу и снова нажимаем кнопку Commit

Пояснения к Commit’у

Файл сохранён, а изменения внесены в журнал.

Файл отправлен в локальный репозиторий

Push

Теперь заглянем на Github.com в наш удалённый репозиторий. Там до сих пор нет ни одного файла. Нужно срочно менять ситуацию.Чтобы перенести изменения, внесённые в локальный репозиторий, в удалённый репозиторий, необходимо нажать кнопку Push.

Push

К слову, отправить изменения в удалённый репозиторий, нам предлагают ещё в точке Commit’а

Commit & Push

Pull

Возникает резонный вопрос: как получат изменения остальные участники разработки, если они клонировали проект в самом начале?
Для этого существует команда Pull, передающая в локальный репозиторий все изменения, происходящие в удалённом.

Pull

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

Перенос информации из сторонних репозиториев на Гитхаб  

Когда нужно собрать разрозненные кусочки кода в один проект, используйте кнопку Import repository и работайте с файлами в удобном репозитории Гитхаба.

Импортировать репозиторий

Кнопка New gist на этой панели предназначена для мгновенного обмена информацией.

А кнопка New organization открывает массу возможностей для командной разработки.

Тестирование и запуск программы

Перед тем, как запустить программу, рекомендуется протестировать её работу для проверки наличия ошибок и корректности выполнения задачи.

Для тестирования программы можно использовать следующие подходы:

1. Ручное тестирование:

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

Автоматизированное тестирование:

• Напишите тестовые сценарии с использованием тестовых фреймворков, таких как JUnit для Java или pytest для Python. Это позволит автоматически проверить работу программы на различных входных данных;
• Используйте инструменты для статического анализа кода, такие как SonarQube или PMD, чтобы проверить качество и соблюдение стандартов кода;
• Прогоните тесты после каждого обновления кода для обеспечения стабильности и корректности работы программы.

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

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

Теперь вы готовы приступить к тестированию и запуску программы! Удачи в вашем программировании!

Создание проекта с нуля

При помощи команды cd нужно найти нужную папку. Про часто используемые команды можно прочитать в статье про работу с терминалом.

Команда echo «# test-github» >> README.md добавляет новый файл в проект. Его также можно создать вручную в папке.

git init — инициализирует проект. После инициализации создаётся специальная скрытая папка для Git:

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

git add README.md — добавляет изменённые файлы к коммиту. Также это можно сделать при помощи команды git add . — в таком случае вы добавите не конкретные файлы, а все изменённые, если их много:

git status поможет проверить, что происходит с изменёнными файлами. В нашем случае, например, файлы не прикреплены к коммиту:

git commit -m «first commit» добавляет сообщение к коммиту — то, что будет отображаться в истории. В скобках можно указать любой текст. Как правило, в нём кратко описывают, что делали в коммите.

Теперь снова посмотрим, что скажет git status. Сейчас он пустой, так как все изменённые файлы мы прикрепили к только что созданному коммиту:

git log показывает историю коммитов:

git branch позволяет просмотреть ветки. В нашем примере текущая ветка называется master. Но с 2020 года GitHub выступает за то, чтобы главная ветка называлась main (по политическим причинам) и рекомендует переименовать ветку с помощью команды git branch -M main.

Команда git remote add origin https://github.com/test-github-04/test-github.git добавляет сервер, где origin — это имя сервера, а url — это адрес.

У вас может быть несколько удалённых серверов, с которыми работает проект. Проверить добавленные сервера можно командой git remote -v (fetch — откуда забирать, push — куда отправлять изменения).

git push -u origin main позволяет запушить (отправить) ветку main на сервер origin. Тут вам, скорее всего, потребуется связать приложение и GitHub, повторно залогинившись через браузер.

И теперь вас можно поздравить с первым опубликованным проектом!

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

Bonus tricks

There are multiple extensions to apply as we set up GitHub with visual studio code. Here are two of the most crucial ones.

1. GitHub Pull Requests and Issues — manage pull requests and related challenges
2. GitHub Repositories — view, search, edit and commit changes to any remote repos.

Head over to the Extensions tab and search the extensions’ respective names.

After installing the GitHub Pull Requests and Issues extension, you should see the GitHub icon. On the other hand, the GitHub Repositories extension creates a screen-like shape named Remote Explorer on hover.

Their friendly docs should guide you to use them smoothly. You can also find guidelines on how to use GitHub Repositories Visual Studio Code’s documentation.

Clone a project

We will clone by clicking on the Clone Repository button in the source control view. Click on the “Clone from GitHub” link as seen below.

You will see a dropdown asking if you want to enable authentication through GitHub. Click the Allow button. VS Code may redirect you to your browser, where you need to authorize GitHub for VS Code like we did when setting up; otherwise, you should see a dropdown with a list of the repositories you have on your GitHub account. You can search for and clone any repository on GitHub.

Select where you want the repository to be stored. If you already have a folder, select it and click the Select Repository Location button. You can also open your desired folder on VS Code and then clone into it.

Once it finishes, you will see a prompt on VS Code asking if you want to open your cloned file in the current window or a new window.

If you want to clone a repository belonging to someone else, you can click on the Clone Repository button in the source control view. Paste the URL of the repository in the search bar.

See the example below.

Fetch / Pull / Push: Modifying code locally, committing to local Git and publishing to remote Git.

When working in a team we should get updates of the code from the remote repository on a regular basis to make sure that the code we are developing integrates well with the work done by other members of the team. Moreover, it is not possible to commit our changes to the remote repository without having received the latest version of the code first (doing a Pull).

• Pull
  A Pull is the operation of getting the latest changes from the remote Git repository. It is good practice to Pull the code regularly so that we make sure the code we develop integrates well with the changes made by the team.
• Fetch
  A Fetch is the operation of getting the list of changes since the last time we Pulled the code. It is useful to Fetch before Pulling so that we can see what are the incoming changes.
  Hereunder is an example of the result of a Fetch, which shows the upcoming changes for the next Pull:
• Push
  A Push is the operation of pushing the changes committed on the local Git repository to the remote Git repository.
  Before doing a Push we first need to make sure that everything we want to Push is Committed locally:
  Once all the files we want to push are committed locally, we can Push the changes to the remote Git repository:

This ends the step-by-step tutorial of using with Visual Studio with GitHub repositories (or any other Git repository for that matter).

Example-2: Branching, merging, and pulling using Visual Studio Code

Creating, switching between, and pushing branches is simple after setting up GitHub with Visual Studio Code. Click on Source Control (), the ellipsis followed by Branch, then choose a target option.

We can also create a branch by clicking on the current branch, main, then follow prompts till we make and check out a branch. I have created one called .

Let’s modify by appending the line «modified».

And follow the example-1 steps above to push the changes.

Lastly, we can merge branches and pull changes by checking out the branch, clicking Source Control (), the ellipsis followed by Branch and choosing Merge branch, picking then pushing the changes to synchronize the remote repo with the local one.

Необходимое программное обеспечение

Перед тем, как собирать программу из исходников на GitHub, вам понадобятся следующие программы и утилиты:

• Git — программное обеспечение для управления версиями исходного кода. Вы можете скачать Git с официального сайта: https://git-scm.com/downloads. Установите Git на ваш компьютер.
• GitHub аккаунт — чтобы скачать исходный код с GitHub, вам потребуется аккаунт на GitHub. Вы можете создать его на официальном сайте GitHub: https://github.com/. Зарегистрируйтесь и войдите в свой аккаунт.
• Командная строка — утилита, с помощью которой вы будете выполнять команды для работы с Git и сборки программы. На Windows вы можете использовать командную строку Git Bash, которая будет установлена вместе с Git. На MacOS и Linux вы можете использовать встроенную командную строку Terminal.

Когда у вас будет установлено необходимое программное обеспечение, вы будете готовы приступить к сборке программы из исходников на GitHub.

Клонировать репозиторий GitHub в GitHub

Если вы уже открыли проект в GitHub, но хотите клонировать другой репозиторий GitHub, есть несколько способов сделать это.

Ты можешь используйте команды Git для клонирования репо на вашем диске а затем откройте эту папку репо в VS Code.

В качестве альтернативы, если вы не хотите использовать командную строку, вы можете придерживаться VS Code.

Это просто. Откройте новое окно в VS Code.

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

В противном случае перейдите на вкладку «Управление версиями» на левой боковой панели и нажмите кнопку «Клонировать репозиторий».

Он откроет видлет сверху. Ты можешь просто скопируйте URL репозитория GitHub. Он может автоматически получить от него ссылку клона.

Клонируйте любой репозиторий GitHub в VS Code

Он спросит вас, где разместить клонированное репо.

Выберите место для клонированного репозитория GitHub в VS Code.

Он спросит, хотите ли вы открыть клонированное репо в VS Code. Сделайте это, если вы хотите работать над этим немедленно.

Откройте только что клонированный репозиторий GitHub в VS Code.

Не только для клонированного репо, VS Code спрашивает вас, доверяете ли вы автору любой папки, которую вы добавляете к нему.

Доверьтесь автору

Что ж, вы клонировали репозиторий GitHub в VS Code. Давайте посмотрим, как изменить и отправить ваши изменения на GitHub.

Создание файла рабочего процесса

В репозитории GitHub добавьте новый YAML-файл в каталог .github/workflows . Выберите понятное имя файла, которое будет четко указывать на назначение рабочего процесса. Дополнительные сведения см. в разделе .

Важно!

GitHub требует, чтобы файлы композиции рабочего процесса размещались в каталоге .github/workflows .

Файлы рабочего процесса обычно определяют композицию одного или нескольких действий GitHub с помощью . Дополнительные сведения см. в статье Синтаксис рабочего процесса для GitHub Actions.

Создайте файл с именем build-validation.yml, скопируйте и вставьте в него следующее содержимое YML:

В предыдущей композиции рабочего процесса:

• Определяет имя , «сборка» будет отображаться в индикаторах состояния рабочего процесса.

• Узел обозначает события, запускающие рабочий процесс:

  Активируется при push возникновении или pull_request в main ветви, в которой все файлы изменяются с расширением CS или CSPROJ .

• Узел определяет именованные переменные среды (env var).

  Переменной DOTNET_VERSION среды присваивается значение ‘6.0.401’. Позже ссылка на переменную среды будет указана dotnet-version для указания действия actions/setup-dotnet@v3 GitHub.

• Узел создает шаги для рабочего процесса.

  • Существует одно задание с именем , где — это имя операционной системы из . Элементы и являются динамическими для каждого значения в . Он будет выполняться в последних версиях Ubuntu, Windows и macOS.

  • Действие GitHub требуется для настройки пакета SDK для .NET с указанной версией из переменной среды.

  • (Необязательно) В зависимости от рабочей нагрузки .NET могут потребоваться дополнительные действия. Они опущены в этом примере, но для создания приложений могут потребоваться дополнительные средства.

    Например, при создании приложения ASP.NET Core Blazor WebAssembly с компиляцией Ahead-of-Time (AoT) необходимо установить соответствующую рабочую нагрузку перед выполнением операций восстановления, сборки и публикации.

    Дополнительные сведения о рабочих нагрузках .NET см. в разделе .

  • Вызывается команда .

  • Вызывается команда .

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