Git-Intro

Learn Git by making a simple visual change. A beginner friendly repo for designers.

The full designer Git workflow (GitHub Desktop)

This repo is designed to be used without the terminal. You will design in your editor and manage Git in GitHub Desktop.

1. Open the repo in GitHub Desktop

On this GitHub page:

• Click Code
• Select Open with GitHub Desktop
• Choose a location on your computer
• Click Clone

You now have a local copy of the project.

2. Open the project in your editor

In GitHub Desktop:

• Click Open in Cursor (or VS Code)

You should now see the files:

• index.html
• styles.css
• README.md

3. Create a new branch

Never work directly on main.

In GitHub Desktop:

• Click Current Branch
• Click New Branch
• Name it after what you are doing
  • Example: center-card
• Click Create Branch

This is your safe space to experiment.

4. Make a visual change

In your editor:

• Open styles.css
• Make the required visual change
• Save the file

GitHub Desktop will automatically detect the changes.

5. Commit your work

In GitHub Desktop:

• Write a short summary
  • Example: Center card on screen
• Click Commit to center-card

This saves a checkpoint of your work.

6. Push your branch

Still in GitHub Desktop:

• Click Push origin

This shares your work with GitHub so others can see it.

7. Open a Pull Request

After pushing, GitHub Desktop will prompt you to:

• Create Pull Request

Click it and open the PR on GitHub.

This is the review step.

That's it

This is the full Git loop you will use every time:

1. Open with GitHub Desktop
2. Clone
3. New branch
4. Make visual change
5. Commit
6. Push
7. Open Pull Request

If you can do this, you can work professionally with Git.