Vs Code Github Integration

Welcome to the NZRT Wiki Podcast. Today we’re looking at VS Code and GitHub Integration.

If you work at NZRT as a developer, VS Code is your home base. And when you pair it with GitHub, you get a setup that handles everything from writing code to reviewing pull requests to spinning up full cloud environments. Let’s walk through how it all fits together.

First, the key concepts. VS Code has a built-in Source Control panel. Think of it as a visual git client sitting right inside your editor. It shows you what files have changed, lets you compare versions side by side, and gives you a full commit history. Alongside that, you authenticate with your GitHub account directly inside VS Code, so all your repository access flows through securely without juggling tokens manually.

A handful of extensions make this really powerful. The GitHub Pull Requests and Issues extension lets you review, comment on, and approve pull requests without ever leaving your editor. GitHub Copilot gives you AI-powered code suggestions as you type, though that one requires a subscription. GitLens supercharges your git history view, showing you who changed what and when, right inline in your code. Then there are practical ones like Markdown All in One for writing notes and docs with live preview, PHP Intelephense and the PHP Extension Pack for server-side work, and the Remote SSH extension, which we’ll come back to in a moment.

To install these, you run a command in your terminal starting with the word “code” followed by “install-extension” and the extension identifier. You do that once for each extension. The wiki shows eight of them lined up in sequence.

Now let’s talk about the day-to-day workflow when you’re working on a feature. You start by cloning a repository. In VS Code, you press Control, Shift, and P to open the command palette, search for Git Clone, and paste in the repository URL. Once it’s open, you create a feature branch from the integrated terminal. As you make changes, the modified files are highlighted automatically in the file explorer. When you’re ready to commit, you open the Source Control panel, click the plus icon next to each file to stage it, type your commit message, and press Control and Enter. Then you click Publish Branch to push it up to GitHub. Back in the command palette, you search for GitHub: Create Pull Request, pick your base branch, add a title and description, and you’re done.

Reviewing pull requests is just as smooth. You open the command palette, search for the GitHub PR option to fetch a pull request, find the one you want by title or number, and it opens in diff view right inside the editor. You can click any line to leave a comment, start a thread, request changes, or approve. Everything you’d normally do on the GitHub website, you’re doing without leaving VS Code.

If you want a full cloud-based development environment, GitHub Codespaces is worth knowing about. You go to the repository on github.com, click the Code dropdown, and choose to create a codespace on the main branch. VS Code opens connected to a cloud machine that already has PHP, Composer, git, npm, and everything else ready to go.

For NZRT’s Dolibarr custom repository, there’s a configuration file in the devcontainer folder that tells GitHub exactly what environment to set up. It specifies a PHP 8.1 base image, adds Docker and Node version 18 as features, forwards ports for the web server and database so they’re accessible from your browser, runs Composer install and npm install automatically once the environment is created, and pre-installs the Pull Requests, PHP Intelephense, and GitLens extensions. You don’t configure any of that by hand. It just happens when the Codespace starts.

The last piece is SSH Remote development, which lets you connect VS Code directly to your local Laragon dev environment over your network. Your SSH settings point to the machine’s local IP address, specify the username, port 22, and the path to your SSH key file. Then in the command palette, you search for Remote-SSH: Connect to Host, select your Laragon Dev entry, and VS Code connects. From that point on, you’re editing files on the remote machine with the full IDE experience. Syntax highlighting, autocomplete, debugging, all of it works exactly as if the files were sitting on your own drive.

That covers the full picture: local development, cloud Codespaces, remote SSH connections, pull request reviews inside the editor, and the extension stack that ties it all together. Whether you’re committing a quick fix or spinning up an entire cloud environment, VS Code and GitHub have you covered at every step.

That’s it for this episode of the NZRT Wiki Podcast. Thanks for listening.