Як читати diff і користуватися blame на GitHub

Alex Tutor

Минулого разу ми знайшли зміну ціни через список файлів. Сьогодні зробимо це як слід, так, як ти розбиратимешся з будь-яким питанням «хто це змінив і навіщо?».

Відкрий config/prices.json. У правому верхньому куті файлу є кнопка History. Вона показує всі коміти, які будь-коли змінювали саме цей файл.

Ви

Лише одинадцять комітів, згрупованих за датами. І найновіший угорі, як ти й попереджала.

Alex Tutor

Так: GitHub показує історію від найновішого, а наші схеми від найстарішого. Розробники бачать той самий список у терміналі через git log.

У всьому репозиторії сотні комітів, а історія файлу коротка й предметна. Зазвичай це найшвидший шлях до відповіді.

Alex Tutor

Питання 1

Тобі потрібні всі зміни в config/prices.json за цей рік. Що відкрити?

Оберіть одну відповідьЛічильник 412 Commits на сторінці репозиторію, а потім читати кожен комітСам файл, а потім його кнопку HistoryREADMEВкладку Actions

Alex Tutor

Ось чому перегляд файлу такий зручний. Це останні шість комітів у main; лише два виділені зачепили config/prices.json.

Alex Tutor

Останні шість комітів у `main`History файлу показав би лише два виділені коміти, від найновішого.

5b8f3a2Update cat food photos
77c1e90Add express delivery price
9d04e61Fix typo in footer
a41c09eRaise delivery price to 59 UAH
e7c3b19Add summer promo banner
f02a6d4Update FAQ answersmain

Ви

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

Alex Tutor

Саме так: ті самі коміти, просто інакше відфільтровані. В історії гілки є ще фільтри за автором і за датою, коли знаєш, хто чи коли, але не знаєш де.

Alex Tutor

Натисни на коміт у цьому списку, і побачиш його diff: що змінилося порівняно з попередньою версією. Ось diff коміту a41c09e.

Alex Tutor

Diff файлу `config/prices.json` у коміті a41c09e

   "currency": "UAH",
-  "delivery": 49,
+  "delivery": 59,
   "freeDeliveryFrom": 800

Рядок із - на початку (на GitHub червоний) видалено, рядок із + (зелений) додано. Рядки без знака не змінювалися, це контекст.

Ви

Тобто рядок не редагували, а видалили й додали заново?

Alex Tutor

Саме так diff показує редагування: стара версія червоним, нова зеленим, а GitHub ще й підсвічує конкретні символи, які відрізняються. Сірі рядки навколо це контекст, щоб було зрозуміло, де ти у файлі.

Над кожним файлом GitHub також показує лічильники на кшталт +1 −1: скільки рядків додано й видалено. А режим Split ставить стару версію ліворуч, а нову праворуч, якщо так легше читати.

Alex Tutor

Питання 2

Зістав кожну частину diff з її значенням.

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

Червоний рядок, що починається з -
Оберіть відповідь
Зелений рядок, що починається з +
Оберіть відповідь
Сірий рядок без знака
Оберіть відповідь
+12 −3 над файлом
Оберіть відповідь

Alex Tutor

Ціни це зміни на один рядок. Зміни текстів виглядають багатше. Ось справжній приклад із FAQ про доставку, про який маркетинг просив минулого місяця.

Ви

Показуй. Хочу перевірити, чи зможу прочитати без підказок.

Alex Tutor

Уперед. Спершу читай рядки з мінусом, потім із плюсом, а тоді порахуй, що нового.

Ви

Спершу мінуси, потім плюси, тоді рахуємо. Зрозуміло.

Alex Tutor

Одна порада: назва файлу над diff важлива. Те саме речення може жити у двох місцях, а diff завжди належить одному файлу.

Alex Tutor

Питання 3

Ось diff файлу pages/faq/delivery.md:

 ## Delivery
-Orders arrive in 2–3 days.
+Orders arrive in 1–2 days in Kyiv and 2–4 days elsewhere.
 Free delivery from 800 UAH.
+Express delivery: 99 UAH.

Які твердження правдиві? Познач усе, що підходить.

Оберіть усі правильні відповідіРечення про терміни доставки переписалиРядок про безкоштовну доставку змінилиЗаголовок ## Delivery видалилиДодали новий рядок про експрес-доставкуЛічильники файлу показали б +2 −1

Ви

Історія працює, коли я знаю файл. А якщо я дивлюся на конкретний рядок і хочу знати його історію?

Alex Tutor

Тоді перемкни вигляд файлу з Code на Blame. Біля кожного рядка GitHub покаже останній коміт, що його змінив: автора, повідомлення й дату, а ще кольорову смужку від старіших змін до новіших.

Ви

«Blame» звучить трохи агресивно як для командного інструмента.

Daniel

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

Alex Tutor

Сприймай його як «звідки взявся цей рядок?». У терміналі це git blame, а на GitHub одна кнопка.

Alex Tutor

Питання 4

Що GitHub показує біля кожного рядка в режимі Blame?

Оберіть одну відповідьЛюдину, яка першою створила файлХто схвалив цей рядок на рев'ю кодуСкільки клієнтів бачили цей рядокОстанній коміт, що змінив цей рядок: автора, повідомлення й дату

Alex Tutor

Тепер увесь ланцюжок для нашої ціни. Blame на рядку "delivery": 59 показує коміт a41c09e. Його повідомлення закінчується на (#128), це pull request. А в PR написано «Closes #120», тобто issue, яке відкрив фінвідділ.

Alex Tutor

Від одного рядка до причини

a41c09e Raise delivery price to 59 UAH
Що змінилося, хто і коли (знайдено через Blame)
Raise delivery price after courier rate change#128
Обговорення: навіщо, хто робив рев'ю, коли змерджили
Courier rates up from 1 June#120
Звідки прийшов запит: фінвідділ

Ви

Рядок, коміт, pull request, issue. Чотири кліки, і в мене вся історія разом з поясненням фінвідділу.

Alex Tutor

Ось і весь прийом. Коміт каже, що і коли; pull request та issue кажуть, навіщо і хто погодив.

Daniel

Саме тому я закінчую повідомлення комітів на (#128) і пишу Closes #120 у pull requests. Без цих посилань слід обривається на коміті, і доводиться знову всіх розпитувати.

Alex Tutor

Питання 5

Розташуй кроки по порядку, щоб з'ясувати, чому рядок у config/prices.json саме такий.

Торкніться пункту, а потім місця, куди його поставити. Можна перетягувати або користуватися стрілками.

Daniel

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

Скажімо, я перевирівняю відступи в усьому файлі з цінами. Тоді blame покаже мене на кожному рядку з «Reformat prices.json», хоча жодної ціни я не змінював.

Ви

І як тоді дістатися глибше?

Alex Tutor

Біля кожного коміту в режимі blame є маленька іконка View blame prior to this change. Вона показує той самий файл у стані безпосередньо перед цим комітом. Або відкрий History файлу й подивись на крок раніше.

Alex Tutor

Питання 6

Blame на рядку "freeDeliveryFrom": 1000 показує коміт «Reformat prices.json», який лише змінив відступи. Як знайти коміт, що справді встановив значення 1000?

Оберіть одну відповідьСкористатися View blame prior to this change або піти назад по History файлуВирішити, що значення встановив автор переформатуванняПошукати «1000» у READMEЦе неможливо знайти: blame пам'ятає лише останній коміт

Alex Tutor

Час закрити тікет підтримки. Питання було таке: чому доставка тепер коштує 59 грн, а не 49?

Ви

І я можу відповісти фактами, а не здогадками: коміт, pull request та issue.

Alex Tutor

Напиши так, щоб співробітник підтримки міг просто скопіювати це клієнту. Коротко, дружньо, без Git-слів.

Daniel

І якщо згадуватимеш дату, бери її з PR, а не з пам'яті. У мене вона жахлива.

Alex Tutor

Питання 7Коротка відповідь · Завдання з перевіркою ШІ

Ось що вдалося знайти в історії: коміт a41c09e «Raise delivery price to 59 UAH» (змерджено 3 червня), PR #128 «Raise delivery price after courier rate change», issue #120 «Courier rates up from 1 June», відкрите фінвідділом. Напиши відповідь на 2–3 речення, яку підтримка може надіслати клієнту, що питає, чому доставка тепер коштує 59 грн, а не 49.

Напишіть відповідь і отримайте оцінку та відгук від нашого ШІ-рецензента.

Увійдіть, щоб отримати відгук ШІ

Коротко про твій набір інструментів: History, щоб побачити всі зміни файлу, diff, щоб побачити, що саме змінилося, Blame, щоб знайти, звідки взявся рядок, а пов'язані pull request та issue, щоб зрозуміти навіщо.

Якщо розробник колись надішле тобі команду для термінала, як-от git blame, наша шпаргалка з Git перекладе її на ці самі кнопки.

Справу закрито, і модуль 1 пройдено: ти вмієш читати репозиторій, коміт та його історію. Наступний модуль про гілки, де живе паралельна робота.

Ви

І де Daniel зламав кнопку оформлення замовлення, підозрюю.

Daniel

Це ще треба довести. І полагодили її за десять хвилин, історія охоче це підтвердить.

Alex Tutor

На цьому все. Ви відповіли на всі завдання — чудова робота.

Наступний урок: Гілки: паралельні версії проєкту