YouMind
Sign in

Git Explained with Diagrams: A Beginner's Guide for High Schoolers

@dan_pro_man
JAPANESEOct 10, 2026
106K
205
23
0
674

TL;DR

A beginner-friendly guide explaining the essential GitHub workflow, including creating repositories, submitting pull requests, reviewing diffs, and reverting changes, specifically tailored for users leveraging AI coding assistants.

Are you using GitHub without knowing what you're doing?

Using it blindly leads to breakage.

There are only three green buttons on GitHub.

There is only one place to look before pressing them.

This article shows every place to look and press on the GitHub screen, highlighted with red boxes.

Connect, submit, check the diff, merge, and revert.

We will go through this full cycle using 10 actual screenshots.

AI does the typing.

You do the looking and pressing.

I will explain difficult terms simply as they come up.

※ The GitHub screens and specifications in this article were verified as of October 2026. Screens may change.

Chapter 1: Connecting to GitHub | Create a Repository and Upload Local Records

The GitHub interface is in English.

But the places to press are fixed.

The red boxes on the screen show where to look and where to press.

In this chapter, there is only one green button to press.

First, create one repository.

A repository is like a locker where you store Git records online.

I wrote about the contents of the locker and four key terms in my previous post.

【With Diagrams】Git Explained for Middle School Students

https://x.com/dan_pro_man/status/2107224533099069671?s=20

Even if you haven't read that, you can complete the full cycle with just this article.

Log in to GitHub and select "New repository" from the "+" icon in the top right.

Opening https://github.com/new takes you to the same screen.

だん|AI×クラウドエンジニア - inline image

All you need to enter is a name.

Enter an alphanumeric name in "Repository name".

"git-practice" is fine.

Select "Private" under "Choose visibility".

This means non-public.

Leave the "Add README" switch off for now.

If you already have local records, it is easier to connect when creating an empty repository.

Press the green "Create repository" button at the bottom.

The screen immediately after pressing is the most important part of this chapter.

だん|AI×クラウドエンジニア - inline image

Near the bottom, there is a heading: "…or push an existing repository from the command line".

The three lines below that are the commands we will use today.

The seven lines above are for people who don't have local records yet, so you can skip them.

Here is what the three lines mean:

Line 1: Tell your local record the address of this locker.

Line 2: Align the main branch name to "main".

Line 3: Store the main branch in the locker.

Copy the address (red box) from this screen and send it to AI in one line.

text
1Upload the records in this folder to https://github.com/account-name/git-practice

Claude Code will type the three lines itself.

Claude Code is an AI that performs tasks on your computer based on instructions.

In my instruction manual, I require confirmation before pushing.

Pushing is the operation of storing local records in the locker.

So, it stops here once.

Answer "Yes", then refresh the browser screen.

だん|AI×クラウドエンジニア - inline image

Where the three commands were, your local files now appear lined up. Next to them is the commit message.

This is the sign that you are "connected".

Here is one thing I want you to notice.

The text "main" above the file list.

It indicates which bookmark you are currently viewing inside the locker.

A bookmark is a branch.

It marks which column you are stacking records in.

Do not touch this "main" directly going forward.

At first, I didn't pay much attention to this either.

I worked on main and wasted time finding where to return.

When connections fail, it is usually due to the address.

The trailing ".git" is missing.

The account name spelling is wrong.

If you see "not found", copy the address from Image ② again.

By now, your local records are connected to GitHub. Next is the daily cycle of merging via Pull Requests.

**

Chapter 2: Merging via Pull Request | Submit AI Work, Check the Diff, Then Press

From here begins the daily cycle.

A Pull Request is a submission asking "Please merge this".

In this chapter, there are three green buttons to press.

AI does the typing.

Your job is only to look and press.

だん|AI×クラウドエンジニア - inline image

First, send one line to AI.

text
1Create a new branch, add 3 lines of usage to the README, commit, and upload to GitHub

The README is the first file where you write the repository description.

Claude Code creates a branch.

It modifies the file and commits.

Finally, it stops before pushing and asks.

Answer "Yes", then open the locker in your browser.

だん|AI×クラウドエンジニア - inline image

A yellow banner appears at the top.

It notifies you: "I just stored this branch".

Press the green button "Compare & pull request" on the right.

This is the 'Submission'.

Like handing a draft notebook to the teacher.

Just submitting doesn't copy anything into the final version.

Copying happens after review.

だん|AI×クラウドエンジニア - inline image

There are three places to look on the submission screen.

1st: The arrow at the very top.

"base: main" and "compare: work-branch"

This shows where to merge from and to.

Just confirm that the left side is main.

2nd: The title in "Add a title".

If AI generates it, it includes a summary of changes.

If you submit manually, the commit message is pre-filled.

If submitting manually, write "what was done" in one line.

3rd: The green "Create pull request" button.

Pressing it accepts the submission.

After submission, human action is required.

Four tabs appear at the top of the screen.

Look only at the rightmost tab, "Files changed".

This means changed files.

だん|AI×クラウドエンジニア - inline image

Green lines are added lines.

Red lines are deleted lines.

This is the diff.

If the 3 lines you requested are green, it passes.

In the example screen, headings and blank lines were also added, making it 6 green lines.

If there are red lines you didn't ask for, do not merge.

In the example screen, there is 1 red line.

One memo line has disappeared from "Items placed".

If you didn't ask for this, stop here.

Ask AI: "Why did you delete this red line?"

This is the most critical 30 seconds when delegating work to AI.

Back when just seeing review notifications made my stomach heavy, I used to press without checking this.

Now, I count the red lines first.

If even one unrequested red line exists, I stop.

If there are no issues with the diff, return to "Conversation".

Near the bottom, there is a green "Merge pull request" button.

If "No conflicts with base branch" appears above it, you can merge directly.

だん|AI×クラウドエンジニア - inline image

Pressing it changes to "Confirm merge".

Press it again.

Now, the work branch records are merged into main.

だん|AI×クラウドエンジニア - inline image

The color turns purple and displays "Merged".

A box appears below saying "Pull request successfully merged and closed".

To its right is "Delete branch".

Feel free to press it.

Only the "bookmark" of the work branch inside the locker disappears.

Since records are already merged into main, nothing is lost.

Finally, update your local environment.

Send AI: "Switch to main and fetch the latest from GitHub".

That completes one cycle.

Start the next task from a new branch.

Do not work on main.

By now, you have completed the cycle of submitting, checking the diff, and merging. Next is about Revert, the button to undo mistakes after merging.

**

Chapter 3: Reverting | Undo Mistakes After Merging with One Button

Sometimes you notice mistakes after merging.

In Git, you "undo" stored records without deleting them.

GitHub's screen has a button for this.

It is called "Revert".

Open the Pull Request you just merged again.

There is a line that says "merged commit … into main".

On the far right of that line is "Revert".

だん|AI×クラウドエンジニア - inline image

What happens when you press it?

Records are not deleted.

A new Pull Request is created with opposite changes.

According to official documentation, the merge happens when you merge this new Pull Request.

So, reverting follows the same cycle as Chapter 2.

Check the diff, press the green button.

Instead of deleting, a record of "reverted" is added.

If asking AI, say: "Undo the Pull Request I just merged".

Claude Code does the same thing with git revert.

There is one more screen you might encounter.

だん|AI×クラウドエンジニア - inline image

"This branch has conflicts that must be resolved".

This is a conflict.

It occurs when the same line was modified differently in main and the work branch.

The green button turns gray and cannot be pressed.

Do not fix this on the screen; send one line to AI.

text
1Fetch main and show me both versions of the conflicting parts

You decide which one to keep.

Once AI fixes it and uploads again, the green button returns.

Conflicts are not failures.

They simply reveal the fact that the same line was edited twice.

Finally, one thing that doesn't appear on screen.

Keys.

Files containing passwords or API keys must never be uploaded to GitHub.

Even if you Revert, once a key is uploaded, it is considered compromised and must be regenerated.

Before uploading, send AI: "Exclude .env from records".

In my own workplace, I write AWS configurations in text files and follow this same cycle.

Configurations merged without checking diffs run directly in production.

Therefore, I do not delegate those critical 30 seconds before pressing to AI.

Humans press all the buttons on the screen.

Even as I expand what AI handles, this rule remains unchanged.

By now, the full cycle of connecting, submitting, merging, and reverting is complete.

Finally, I provide ready-to-use materials.

I have written out the steps to complete one cycle on the GitHub screen.

I have packaged the screens and prompts from this article into ready-to-use formats.

  • GitHub Screen Translation Poster (9 screens, 69 terms)
  • Recovery Map for When AI Breaks Things (6 scenarios)
  • 7 Prompts for One Full Cycle
  • Pre-Merge Checklist Sheet (8 items)

Delivered together as a 15-page PDF booklet.

With these alone, you can start completing cycles today.

To receive them, simply join the Open Chat below.

Follow the instructions after joining and send "Submit", and it will arrive automatically.

https://line.me/ti/g2/pEpZQdEyn1BM5Zi2wqLBT2rZYpC0ZaOncIWTag

だん|AI×クラウドエンジニア - inline image

Summary: Complete Just One Cycle Today

Do not put AI work directly into main.

Submit from a work branch, check the diff, and press the green buttons.

There were three green buttons to press in one cycle.

The day I pressed Revert myself for the first time, I realized records aren't deleted.

After that, I stopped being afraid to touch things.

You don't need to do everything at once.

Today, there is only one thing to do.

Open the repository created in Chapter 1 and send one line to AI.

Create a new branch, add 1 line to the README, and upload to GitHub

When the yellow banner appears, press the green button and open "Files changed".

If there is only one green line, it passes.

Look at that one line with your own eyes before merging.

That is the first step toward expanding what you can delegate to AI.

For engineers over 30, winning isn't about volume of work, but about design.

Rather than relearning tools every time they update, it is faster to define where to stop.

AWS and AI evolve rapidly.

Watching logs from people testing in real work is faster than trying to keep up alone.

I leave behind not just successful records, but broken and excluded ones too, in my AI × Engineering practice.

Please follow me to ensure you don't miss future insights! @dan_pro_man

One-click save

Use YouMind for AI deep reading of viral articles

Save the source, ask focused questions, summarize the argument, and turn a viral article into reusable notes in one AI workspace.

Explore YouMind
For creators

Turn your Markdown into a clean 𝕏 article

When you publish your own long-form writing, images, tables, and code blocks make 𝕏 formatting painful. YouMind turns a full Markdown draft into a clean, ready-to-post 𝕏 article.

Try Markdown to 𝕏

More patterns to decode

Recent viral articles

Explore more viral articles