Skip to content

Tools: GitHub Desktop, gh CLI, VS Code

Tools: GitHub Desktop, gh CLI, VS Code

Overview

These tools cover different needs: GitHub Desktop for visual workflows, gh CLI for GitHub integration from the terminal, and VS Code for in-editor operations (diffs, conflict resolution, PR reviews). Use the right tool for the right job.

GitHub Desktop (quick tips)

  • Best for visual diffs, staging hunks, and quick branch management.

  • Common workflows:

  • Clone a repo via File -> Clone repository.

  • Create a branch: Branch -> New branch.
  • Stage hunks or entire files, write a commit message, and commit.

  • Push your branch and click "Create Pull Request" to open a PR on GitHub.

  • Use the "History" view to inspect commits and revert if needed. It's a friendly UI for learning Git concepts.

gh CLI (examples and workflows)

  • Install from https://cli.github.com. Authenticate with gh auth login.

  • Common commands:

  • Create a PR from your current branch (auto-fill title/body from commits):

    gh pr create --fill

  • Check out PR #123 locally:

    gh pr checkout 123

  • List open PRs:

    gh pr list

  • Create an issue:

    gh issue create -t "Fix login bug" -b "Steps to reproduce..."

  • View repo in browser:

    gh repo view --web

Tips: - Use gh in CI scripts or local workflows to automate PR creation, merging, and issue management.

VS Code (practical guidance)

  • Built-in Source Control: use the Source Control view to stage files, create commits, and push/pull.
  • Inline diffs: click gutter markers to see changes and revert lines.

  • Merge conflict resolution:

  • When a conflict occurs, open the file in VS Code. You will see conflict regions with options like Accept Current Change, Accept Incoming Change, Accept Both Changes, and Compare Changes.

  • Use the editor to make the final decision, remove conflict markers, then stage the resolved file.

  • Run git commit to complete the merge.

  • Useful extensions:

  • GitHub Pull Requests and Issues — review PRs, view issues, and run checks from VS Code.
  • GitLens — rich history, blame, line-by-line authorship, and visualization tools.
  • Prettier / ESLint integrations — make formatting and linting automatic.

Hooks and quality gates

  • Pre-commit hooks: use husky + lint-staged to run formatters and linters before committing. Example package.json snippet:
"husky": {
  "hooks": {
    "pre-commit": "lint-staged"
  }
},
"lint-staged": {
  "*.js": ["eslint --fix", "git add"]
}
  • Server-side checks: require CI passing and at least one review before merging via branch protection rules on GitHub.

Tips

  • Use GitHub Desktop for quick visual work and newcomers.
  • Use gh for scripting and fast terminal workflows.
  • Use VS Code for day-to-day development, resolving conflicts, and in-editor PR reviews.
  • Configure pre-commit hooks to keep commits clean and consistent.