Як ви можете вивчити Git та GitHub під час навчання коду

У цій статті я підкажу вам, як стати ніндзя Git / GitHub. Крім того, як бонус я покажу вам, як користуватися терміналом (оболонкою)під час кодування. Отже, якщо ви новачок, ця публікація повинна допомогти вам зрозуміти цю технологію. А якщо ви вже ніндзя, подивіться, щоб допомогти запам’ятати речі, про які ви могли забути.

Короткий вступ

Git та GitHub є надзвичайно важливими інструментами нашої роботи як розробників програмного забезпечення. Але, як ми можемо навчитися їм, так як у нас так багато всього, коли ми вивчаємо код?

Я Яго Родрігес, бразилець. Я студент системної інформації, стажист розробника програмного забезпечення та фрілансер. Я на початку своєї кар’єри, і я хотів поділитися з вами деякими знаннями, які я набув. Отже, візьміть каву і давайте рубати!

Якщо ви португальський читач, будь ласка, йдіть сюди.

Ви можете використовувати цей план для вивчення будь-якої мови програмування, наприклад JavaScript, Python, Node, а також HTML та CSS. Неважливо, яку технологію ви вивчаєте - встановлення версій вашої роботи за допомогою Git є способом програмування за замовчуванням.

Підготовка середовища

Перш ніж розпочати, нам потрібно створити середовище для збереження нашого коду та прикладів того, що ми вивчаємо.

Для цього ми повинні виконати деякі вимоги:

  • встановіть Git на нашій машині
  • створити обліковий запис GitHub
  • створити робочу область на нашій машині

Якщо ви вже це зробили, ви можете перейти безпосередньо до робочого процесу GitHub та розділу Термінал .

Встановлення Git на вашій машині

Встановлення Git відрізняється в кожній операційній системі. Перевірте офіційний сайт Git, щоб побачити, який шлях вам підходить.

Але якщо ви використовуєте Windows (і говорите португальською), я рекомендую цю статтю.

Після встановлення Git нам потрібно створити обліковий запис GitHub і налаштувати його на своєму комп'ютері.

Створення облікового запису на GitHub

Щоб створити обліковий запис, перейдіть на веб-сайт GitHub і заповніть основну форму.

Я рекомендую вам вибрати справжнє і приємне ім’я користувача тут, щоб ви могли використовувати обліковий запис у резюме або свій обліковий запис LinkedIn.

Вам потрібно повідомити GitHub, який план ви хочете використовувати. Виберіть безкоштовний варіант. Єдина відмінність полягає в тому, що ви можете налаштувати приватні сховища з платним планом.

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

Після завершення всього ми можемо розпочати наш проект.

Однак перед тим, як створити наш репозитарій, давайте налаштуємо свою електронну адресу GitHub та ім’я користувача в нашій машині.

Налаштування нашої системи за допомогою даних GitHub

Відкрийте свій термінал. У Windows потрібно відкрити меню « Пуск» і ввести cmd. Потім натисніть клавішу Enter.

Або ви можете встановити cmder (що є хорошим варіантом), щоб використовувати його замість cmd , який є стандартним терміналом Windows.

З цим ми повинні виконати таку команду оболонки в cmder:

git config --global user.name "our_GitHub_user_name"

Тепер введіть свою адресу електронної пошти в GitHub:

git config --global user.email "our_GitHub_user_email"

Налаштування ключа доступу GitHub

Кожного разу, коли ви отримуєте доступ до сховища через оболонку, вам потрібно мати дозвіл на доступ. Це надається, коли ви входите у свій обліковий запис GitHub. Але кожного разу, коли ви надсилаєте щось у своє сховище (репо), ви повинні передавати свої облікові дані.

Щоб цього уникнути, використовуйте ключ SSH. Це ключ доступу, яким GitHub обмінюється з ключем, налаштованим на нашій машині.

Щоб створити цей ключ, дотримуйтесь процесу, описаного в документації GitHub.

З усім, що все налаштовано, ви готові!

Робочий процес GitHub і термінал

Давайте встановимо тут правило :

Кожного разу, коли ви створюєте проект для вивчення чогось, наприклад, створення сторінки HTML або гри в командному рядку за допомогою Node.js або чого-небудь іншого, ви створюєте сховище, клонуєте його у своїй машині, працюєте над ним за допомогою гілок і робите маленькі зобов'язується надіслати на GitHub .

Угода ?!

Це гарантуватиме вам певний досвід, який вам знадобиться для освоєння цих інструментів.

Тож давайте почнемо.

Створіть новий проект

Повернемося до вашої сторінки GitHub і натисніть на значок плюса (+) у верхній частині сторінки.

Клацніть на Нове сховище .

Скажімо, ви створюєте проект для вивчення HTML, тож назвіть свій репозиторій learning-html . Це може бути ім'я сторінки, яка створюється або будь-якого проекту, такі як: куррікулума- в-HTML , мало-змії , хрестики-нулики , або що - небудь ще , добре?

Опис проекту необов’язковий. Але я думаю, що важливо ввести там корисний текст, оскільки він визначатиме сферу вашого проекту. Якщо інші люди хочуть вам допомогти, вони можуть коротко зрозуміти ваш проект через опис. У вашому випадку ви можете ввести щось на зразок сховища вивчення мови HTML .

Вам слід також створити файл README та визначити тип ліцензії, яку ви будете використовувати в проекті. Погляньте на ці хороші приклади README, а також ліцензію на використання в проекті.

Файл README - це більш повний опис вашого проекту, тому корисно додати туди корисну інформацію. Дотримуйтесь прикладів за посиланням.

Незважаючи на те, що ліцензія є необов’язковою, її визначення є гарною практикою. У ліцензії буде вказано, що інші люди можуть робити з вашим кодом. Ліцензія MIT є однією з найпопулярніших і дозволяє вам (та іншим) робити багато речей із проектом. Витратьте трохи часу на пошук інших типів ліцензій, якщо хочете.

Створіть свою робочу область

Після створення сховища ви можете клонувати його на своїй машині. Але перед цим вам потрібно створити папку, куди ви клонуватимете всі майбутні сховища, над якими ви працюєте.

За допомогою терміналу створіть папку, яка буде вашим робочим простором . Ви робите це для підтримки організованої системи, інакше в підсумку ви розкидаєте свої проекти навколо (і ви можете втратити їх так само, як втратили ті gif-кошенята, які ви зберегли на своєму комп'ютері ...).

Якщо припустити, що ви вже встановили cmder, тепер ми можемо його відкрити (якщо ви цього не зробили, зараз сприятливий час), і ми будемо в C:/Users/your_computer_name.

Якщо ви не на цьому шляху, скористайтеся командою:

cd %home%

Запустіть команду, mkdir folder_nameщоб створити робочу область. Наприклад:

mkdir workspace

Це воно! Тепер у вас є папка за замовчуванням для ваших проектів, і ви можете клонувати свої сховища там.

Клонуйте свої сховища

Клонування сховища означає, що ви скопіюєте всі файли та каталоги на сервері GitHub на свою машину, щоб можна було працювати з ними.

Тепер вам потрібно клонувати проект, який ви створили на GitHub, у свою робочу область. Для цього перейдіть до папки, яку ви щойно створили. На cmder введіть:

cd workspace\

Порада : якщо ви створили папку або хочете отримати доступ до такої, яка вже існує, ви можете почати вводити її ім'я та натиснути TAB, і cmder автоматично заповнить ім'я для вас.

Після цього перейдіть на сторінку вашого проекту на GitHub і отримайте посилання, яке потрібно для клонування сховища.

Посилання знаходиться в тій зеленій кнопці з назвою Клонувати або Завантажити :

Перейдіть із HTTPS на SSH, оскільки ви вже налаштували ключ доступу у своєму обліковому записі.

Тепер ви можете запустити git cloneкоманду та передати отримане посилання. Ось так:

git clone [email protected]:our-username/learning-html.git

І ваше сховище буде клоновано, як на малюнку нижче:

Ви можете отримати доступ до папки сховища, яка була створена у вашій робочій області під час клонування.

Введіть команду: cd learning-html/

Увага : Я припускаю, що ви зараз знаходитесь у workspaceкаталозі. Якщо ви цього не зробите, вищевказана команда не буде працювати. Використовуйте, cd %home%\workspace\а потім вищевказану команду.

Створити гілку

Кожного разу, коли ви щось змінюєте в проекті з версією Git, вам слід створити гілку з назвою завдання, над яким ви працюєте. Це охоронить вас від псуючи «основний» код , розташований на головній гілці. Для цього ви можете використовувати таку команду:

git checkout -b task_name

Гілка , як гілка дерева. Це частина стовбура дерева. Таким чином, ви можете вносити зміни паралельно з основною частиною проекту, не впливаючи на це.

Наприклад:

Після цього ви можете автоматично перейти до нещодавно створеної гілки та кодувати як божевільний.

Зафіксуйте зміни

Після того, як ви закінчите зміну свого проекту, вам слід здійснити зміну у віддаленому сховищі (на серверах GitHub).

Для того, щоб зробити що - то сказати Git , що ви ставите свої зміни в черзі для штовхання (пересилаються) в віддаленому сховище.

Уявіть, що ви щойно створили сторінку HTML і додали на неї кілька заголовків та тексту. У вас є перша версія цього документа зараз, тому вам слід скопіювати його.

Для цього виконайте деякі команди, щоб Git зрозумів, що ми хочемо надіслати наші зміни, щоб зробити віддалене репо. Біжіть, git add file_nameщоб сказати Git індексувати файл.

Крім того, ви можете запустити, git add --allщоб надіслати всі файли, до яких ви внесли деякі зміни. За допомогою git statusкоманди ви можете побачити, які змінені файли ви передасте на сервер.

У наведеному вище прикладі створено файл index.htmlі було запущено команду git status, щоб побачити, що змінилося. Потім файл було додано за допомогою git add і знову запущено статус git, щоб побачити, який файл був доданий до робочої області Git.

При тому , що тепер ви можете зробити зміни. Просто запустіть команду git commit , як git commit -m "commit_message". Не забудьте включити описове повідомлення про те, що було додано до коміту.

Об’єднання змін

Після того, як ви внесли зміни, тепер у вас є гілка з модифікаціями, випереджаючими ті, що є у гілці master . Це означає, що у вас інша версія проекту, і вам потрібно об’єднати ці зміни з основною версією проекту. Перш ніж це зробити, перевірте, в чому різниця між гілками. На вашій гілці виконайте команду:

git diff master

Вихід буде приблизно таким:

Git показує вам найновіший зроблений коміт, які файли були додані або змінені, а також що було змінено.

Оскільки ви знаєте, що у вас є відмінності між вашою гілкою та майстром, вам потрібно об'єднати їх, щоб приєднати нові коміти, які ви зробили у вашій гілці, з кодом у майстрі. Для цього потрібно перейти до гілки master на cmder і запустити команду git merge.

Щоб повернутися до майстра, біжи git checkout master. Щоб об’єднати коміти, запустіть git merge our_branch_name.

Git покаже вам результат, що підтверджує додане.

Надсилання на GitHub

Після того, як ви внесли та об’єднали всі зміни, тепер ви можете надіслати їх у віддалене сховище на GitHub.

Ви будете використовувати git push origin masterдля цього.

Ви також можете просто використовувати git push. Це матиме той самий результат. Але коли ви вперше натискаєте зміни на робочій області, вам потрібно це зробити, git push origin masterщоб Git знав, що ваша робоча область є початком натискання.

Тепер ваш коміт з’явиться на сторінці вашого сховища GitHub:

Висновок

У цьому підручнику ви дізналися, як створити проект на GitHub, щоб ви могли відстежувати свій прогрес кожного разу, коли вивчаєте щось нове. Це допоможе вам ознайомитись із командним рядком (терміналом), командами Git та GitHub. Крім того, це допоможе вам створити гарне портфоліо, яке ви зможете показати на співбесіді.

Подібна практика також допоможе вам краще зрозуміти, як використовувати Git із віддаленими сховищами (сховища, розміщені на певній платформі, такі як GitHub ). Ви також підвищите свої знання та вміння в Терміналі.

Не забувайте основні правила, які ви встановили:

  • завжди створювати новий проект навчання
  • робота на гілках
  • фіксуйте зміни, поки не настане час надсилати їх на GitHub

В порядку? :)

Повертайтесь сюди і дотримуйтесь цього покрокового керівництва кожного разу, коли щось забудете!

Мене звуть Яго Родрігес. Я стажуюся в Бразилії, в місті Белем.

Ви можете стежити за мною в соціальних мережах. Завжди приємно допомагати, чим можу.

Яго Родрігес (@iagokv) | Twitter

Останні твіти від Яго Родрігеса (@iagokv). Front-End Developer | Vue.js падаван | Нуб про життя. Белен, Бразилія twitter.com

Ага! Я знаю. Моє твіттерне фото - це щось ...