Contribute To This Project

Внести свой вклад в этот проект

Логотип создан? От Candiddeer

---

Объявление:

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

---

Индекс быстрого доступа

• Введение
• Цели
• Для кого это?
• Зачем мне это делать?
• Что я собираюсь внести?
• Переводы
• Настраивать! :)
• Способствовать
  • Шаг 1: разветвляется этот репозиторий
  • Шаг 2: клонировать репозиторий
  • Шаг 3: Создайте новую ветку
  • Шаг 4: Откройте файл index.html
  • Шаг 5: Скопируйте шаблон карты
  • Шаг 6: Примените свои изменения
  • Шаг 7: совершите свои изменения
  • Шаг 8: Вставьте свои изменения в GitHub
  • Шаг 9: отправьте PR (запрос на вытягивание)
  • Шаг 10: Празднуйте
• Следующие шаги
• Благодарности
• Лицензия
• 100 лучших участников

---

Введение

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

Цели

• Внесите вклад в проект с открытым исходным кодом.
• Получите удобнее использования GitHub.

Для кого это?

• Это для абсолютных начинающих. Если вы знаете, как писать и редактировать якорный тег <a href="" target=""></a> тогда вы сможете это сделать.
• Это также для тех, у кого есть немного больше опыта, но которые хотят внести свой первый вклад с открытым исходным кодом или получить больше вкладов для большего опыта и уверенности.

Зачем мне это делать?

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

Если вы новый разработчик, и вам интересно, нужно ли вам выучить GIT и GitHub, то вот ответ: вы должны были выучить вчера.

Что я собираюсь внести?

Вы собираетесь внести карту, как и эта, на веб -страницу этого проекта. Он будет включать ваше имя, вашу ручку в Твиттере, краткое описание и 3 ссылки на полезные ресурсы для веб -разработчиков, которые вы рекомендуете.

Вы сделаете копию шаблона карты внутри файла HTML и настроите ее с собственной информацией.

---

Переводы

Этот урок также доступен на других языках

Арабский (عربي)	Бангла (বাংলা)	Китайский (традиционный) (繁體中文)	Голландский	Английский (английский)
Французский (Français)	Немецкий (Deutsch)	Хинди (हिंदी)	Итальянский (Итальян)	Японский (日本語)
Корейский (한국어)	Польский (Польски)	Португальский (португальский)	Русский (Русский)	Сербский (Српски)
Испанский (Эспаньол)	Турецкий (Туркч)	Украинский (ukraїncaka)	Норвежский (Норск)	Malyalam

Перевод для проектов документации приветствуются. Прочитайте Translation Guide , чтобы внести свой вклад.

---

Настраивать! :)

Примечание

Этот учебник основан на Github PC. Если вам удобно с терминалом перейдите в этот урок (нажмите здесь)

Сначала давайте настроим на работу

1. Войдите в свою учетную запись GitHub. Если у вас еще нет учетной записи, присоединяйтесь к GitHub. Я рекомендую вам сделать учебник GitHub Hello World, прежде чем продолжить.
2. Скачать приложение настольного компьютера GitHub.
   • В качестве альтернативы, если вам удобно использовать GIT в командной строке, вы можете сделать это, вот ссылка на учебник CLI.
   • Если вы используете код VS, он поставляется с интегрированным GIT и позволяет вам делать то, что нам нужно прямо от редактора.
   • Однако самый простой и простой способ следовать этому учебному пособию - использование настольного компьютера GitHub.

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

↑ Перейти к вершине ↑

---

Способствовать

Станьте участником с открытым исходным кодом в 10 простых шагах.

Расчетное время: менее 30 минут .

Шаг 1: разветвляется этот репозиторий

• Цель здесь состоит в том, чтобы сделать копию этого проекта и поместить его в свою учетную запись.
• Репозиторий (репо) - это то, как проект вызывается на GitHub, а вилка - это копия.
• Убедитесь, что вы находитесь на главной странице этого репо.

Нажмите кнопку вилки

• Теперь у вас есть полная копия проекта в вашей собственной учетной записи.

↑ Перейти к вершине ↑

---

Шаг 2: клонировать репозиторий

• Теперь мы хотим сделать местную копию проекта. Это копия, сохраненная на вашей собственной машине.
• Откройте приложение GitHub Desktop. В приложении:

Нажмите на файл , затем клон репозиторий

• Вы увидите список ваших проектов и вилок на GitHub.
• Выберите <your-github-username>/Contribute-To-This-Project .
• Нажмите клон

↪ Разветвленный проект будет иметь символ вилки слева. Ваша вилка будет иметь свой собственный пользователь GitHub

• Это займет минутку, так как проект скопирован на ваш жесткий диск. Я рекомендую вам сохранить путь по умолчанию, который обычно является ..DocumentsGitHub .
• Теперь у вас есть локальная копия проекта.

↑ Перейти к вершине ↑

---

Шаг 3: Создайте новую ветку

• Как только репо клонирован, и вы открыте его на рабочем столе Github, пришло время создать новую ветку.
• Ветвь - это способ сохранить ваши изменения отдельно от основной части проекта под названием Master . Например, если что -то пойдет не так, и вы не довольны своими изменениями, вы можете просто удалить филиал, и основной проект не будет затронут.

↪ Нажмите на Current branch , затем нажмите на New
↪ Дайте вашей ветви имя, затем нажмите Create branch
↪ опубликовать свой новый филиал в GitHub

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

Не работайте над master филиалом

↑ Перейти к вершине ↑

---

Шаг 4: Откройте файл index.html

• Теперь нам нужно открыть файл, который мы собираемся редактировать с вашим любимым редактором кода.
• Найдите папку проекта на своем компьютере. Если вы сохранили по умолчанию, это должно быть что-то вроде your-computer > Documents > GitHub > Contribute-To-This-Project
• Файл index.html находится непосредственно в папке Contribute-To-This-Project .
• Откройте свой редактор кода (Sublime, VS Code, Atom..etc) и используйте команду Open file и найдите файл index.html в основном каталоге проекта

↪ В качестве альтернативы вы можете найти файл на жестком диске, щелкнуть правой кнопкой

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

↑ Перейти к вершине ↑

---

Шаг 5: Скопируйте шаблон карты

• Мы сделаем копию шаблона карт, чтобы начать работать над ним
• Прямо внутри <body> вы найдете раздел <div class="container"> . Это содержит много других разделов.
• Первые 2 раздела точно такие же: <div class="row"> . Обрушитесь на них, нажав на стрелку по бокам в вашем редакторе кода VS, как показано на рисунке ниже. (Если вы используете другого редактора, вы не сможете использовать эту функцию. Вам просто нужно прокрутить вниз). Корлапс позволяет легко скрыть некоторые компоненты кода, которые вам не нужно будет изменяться.
• Теперь вы должны увидеть раздел, в котором размещаются все карты взносов: <div class="grid" id="contributions">

• В этом разделе вы найдете раздел с надписью == TEMPLATE ==
• Скопируйте все на красном квадрате на изображении, от Contributor card START до комментариев Contributor card END

• Вставьте все это непосредственно под комментарием, указывающим его; прямо на вершине самой последней карты участника.
• Убедитесь, что между концом вашей карты и началом последней карты есть одна линия места. Также добавьте линию места между началом вашей карты и строкой с комментарием === Paste YOUR CARD directly BELOW this line === . Это хорошая практика, чтобы сохранить наш код как можно более четким
• Никогда не используйте лантер или форматеры стиля. Проект имеет красивую настройку

• Теперь это ваша карта, чтобы вы могли настраивать и редактировать.

↑ Перейти к вершине ↑

---

Шаг 6: Примените свои изменения

• Теперь мы начнем редактирование HTML, изменяя настраиваемые поля в нашей карте.

↪ Замените «имя» на ваше имя

• Примечание: не меняйте class="name"

↪ Вставьте URL вашей учетной записи Twitter href="Insert URL here" , введите свою ручку в текстовое поле

• Если вы предпочитаете использовать контакт, отличный от Twitter, вам нужно будет заменить значок Twitter <i class="fa fa-x-twitter"></i> , отправившись на шрифт удивительных значков, ищет правильный значок и заменив только часть fa-x-twitter на новую иконку, например fa-facebook например. Затем выполните те же шаги выше.

↪ Расскажите нам что -нибудь о вас. Держите его коротким и сладким. Подумайте об этом больше как о твите, чем о сообщении в блоге
↪ Поделитесь с сообществом 3 ссылки на ресурсы, которые полезны для веб -разработки. Это может быть что угодно, видео, разговор, подкаст, статья, ссылка или инструмент. Если вы новичок, не пугайте это, поделитесь тем, что знаете, даже если вы думаете, что это основное. Вы будете удивлены, сколько людей выиграет.

• Ссылка: вставьте ссылку href="here" заменить # . Пожалуйста, воздержитесь от использования сокращений URL или URL -адресов, которые не с сайта, который вы публикуете!
• Название: Напишите краткое описание title="here" .
• Имя: Напишите имя ресурса в текстовом поле >here</a> .
• Убедитесь, что вы сохранили все свои изменения .
• Проверьте свои изменения . Это важно! Откройте HTML -файл в вашем браузере (например, дважды щелкнув по нему) и посмотрите, как будет выглядеть ваша карта на сайте. Посмотрите, что вся страница все еще выглядит так же, и ничего не сломано. Нажмите на свои ссылки и убедитесь, что они работают. Откройте консоль (Ctrl + Shift + J (Windows / Linux) или CMD + Opt + J (Mac)) и убедитесь, что сообщения об ошибках нет.
• Отлично, вы закончили редактировать свой код! Следующие шаги отправят ваши изменения в GitHub, а затем отправят их для объединения с основным проектом.

↑ Перейти к вершине ↑

---

Шаг 7: совершите свои изменения

• Вернитесь в приложение GitHub Desktop.
• Ваши изменения будут добавлены автоматически в зону постановки.
• Это означает, что GIT записал все сохраненные изменения.
• Вы можете увидеть это отраженное в приложении. Все, что вы добавили в файл, будет зеленым, а делеции будут показаны как красные.

↪ Следующий шаг называется Commit . Это приблизительно означает confirm the changes
↪ Это то, как должен выглядеть ваш заголовок настольного компьютера GitHub. Обратите внимание на символ вилки рядом с именем проекта в Current repository , в вашем Current branch будет имя, которое вы дали на шаге 3
↪ Commit вы должны заполнить в Summary поле. Это сообщение о коммите, объясняющее, что вы изменили. В этом случае "Add my card information" будет разумным сообщением. При желании вы можете добавить более подробное Description . Нажмите кнопку Commit . Ваша кнопка скажет что-то Commit to "your-branch-name"

↑ Перейти к вершине ↑

---

Шаг 8: Вставьте свои изменения в GitHub

• Ваши изменения теперь сохраняются или совершены. Но они сохраняются только локально, то есть на вашем компьютере.
• Синхронизация локальных изменений с вашим хранилищем на GitHub называется толчком . Вы «продвигаете» изменения от местного хранилища в удаленный репозиторий на GitHub.

↪ Нажмите Push

• Через несколько секунд операция завершена, и теперь у вас есть точно такая же копия этой ветви на вашей машине, а также на GitHub.

↑ Перейти к вершине ↑

---

Шаг 9: отправьте PR (запрос на вытягивание)

• Это тот момент, когда вы ждали; отправка запроса на вытяжение (PR).
• До сих пор вся работа, которую вы проделали, была на вилке проекта, которая, как вы помните, проживает в вашем собственном аккаунте GitHub.
• Теперь пришло время отправить ваши изменения в основной проект, чтобы быть объединенным с ним.
• Это называется запросом на притяжение, потому что вы просите оригинального сопровождающего проекта «втянуть» свои изменения в свой проект.
• Перейдите на главную страницу вашей вилки на GitHub (у него будет значок вилки и ваше собственное имя пользователя вверху).
• В верхней части репо вы увидите выделенное сообщение запроса на вытяжение с зеленой кнопкой.

↪ Нажмите на Compare and pull request
↪ Это то, на что выглядит страница Open a pull request .

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

↪ Создайте запрос на привлечение: напишите заголовок, добавьте дополнительную информацию в описание и нажмите Create pull request

• Не смущайтесь всеми вариантами. Вам нужно сделать только эти три шага на данный момент.
• Оставьте вариант Allow edits from maintainers .
• Теперь запрос на привлечение будет отправлен аподотирующему проекту. Как только он будет рассмотрен и принят, ваши изменения появятся на веб -странице проекта.

↑ Перейти к вершине ↑

---

Шаг 10: Празднуйте

Вот и все. Вы сделали это! Теперь вы внесли свой вклад в открытый исходный код на GitHub.

Вы добавили код на живую веб-страницу: https://syknapse.github.io/contribute-to this-project

Ваши изменения не будут видны сразу ; Сначала они должны быть рассмотрены, приняты и объединены со стороны проекта. Как только они объединены, ваша карта должна быть видна и жить на странице.

Для рецензента очень нормально просить об изменениях на PR. Думайте об этом как о хорошей практике, если это произойдет с вами. Следите за комментариями и запрошены изменения. После того, как вы внесете запрошенные изменения (обратно в вашу филиал), все, что вам нужно сделать, это совершить и продвинуть свои изменения. PR автоматически обновляется с новыми изменениями.

Я обещаю, что постараюсь пересмотреть и слияние как можно скорее, но я делаю это в свободное время, поэтому задержка на несколько дней неизбежна.

↑ Перейти к вершине ↑

---

Следующие шаги

• Вернитесь через некоторое время, чтобы проверить, чтобы проверить свой запрос на объединение.
• Вы должны получить электронное письмо от GitHub, когда ваши изменения были утверждены, или если запрошены дополнительные изменения. И когда PR наконец объединен с мастером, и ваша карта была добавлена.
• Вы также можете узнать, как внести свой вклад из этой бесплатной серии: как внести свой вклад в проект с открытым исходным кодом на GitHub
• Если вы нашли этот проект полезным, пожалуйста, дайте ему звезду в верхней части страницы и напишите об этом, чтобы помочь распространить информацию
• Вы можете присоединиться к нашему серверу Discord
• Вы можете следовать за мной и связаться? (Twitter) или использование любого из этих других вариантов
• Это проект с открытым исходным кодом, поэтому, помимо того, что вы внесли свой вклад в вашу карту, вы можете помочь исправить ошибки, улучшения или новые функции. Откройте проблему или отправьте новый запрос на привлечение
• Чтобы улучшить наше сообщество, взгляните на вкладку Degvingions Github, расположенную рядом с запросами. Эта область - это место, где можно представить себя, вступить в более глубокие дискуссии об открытом исходном коде и общаться с активаторами проекта. Вы поможете нам создать эту функцию и улучшить наше сообщество?
• Спасибо за вклад в этот проект . Теперь вы можете пойти дальше и попробовать внести свой вклад в другие проекты; Ищите Этикетка для для начинающих вариантов вклада.
• Я также ищу сотрудников, чтобы дать мне руку в обзоре и слиянии PRS. Если вы хотите получить более продвинутую практику GIT, прочитайте руководство по сопровождающему, присоединяйтесь к нашему серверу Discord и попросите присоединиться к команде от сопровождающих проекта.

↑ Перейти к вершине ↑

---

Благодарности

На этот проект сильно влияет великий проект Рошана Жосси с первым выпуском с отличным учебником.

Это также особенно вдохновлено великим сообществом вокруг #GoogleUdacityScholars стипендия Google Challenge: Front-End Web Dev, Европа класса 2017 года.

Лицензия

Этот проект лицензирован по лицензии MIT.

100 лучших участников

Вернуться к вершине ↑