Start from main

Every new feature should begin from the latest version of the main branch.

In this guide, the main branch represents the version of the project intended for production. Starting feature work from main gives the new branch a known starting point.

git switch main

This switches your working directory to the local main branch.

Pull the latest main

Before creating a new feature branch, update your local main branch with the latest changes from GitHub.

git pull origin main

This retrieves the latest commits from the main branch on the GitHub repository and integrates them into your local main branch.

Why?

Starting from the latest main reduces the chance of developing a feature from an outdated version of the project.

Create a feature branch

Create a separate branch for the feature you are going to develop.

git switch -c feature/homepage

The command creates the feature/homepage branch and switches to it immediately.

From this point onward, your feature work and commits are made on the feature branch rather than directly on main.

BranchPurpose
mainProduction-ready code.
feature/homepageDevelopment of the homepage.
feature/navigationDevelopment of navigation.

Develop locally

Once the feature branch is created, make your changes on your local computer.

For example, you might create a new homepage section, add a component, or modify an existing stylesheet.

Keep your changes focused on the purpose of the feature branch. Avoid mixing unrelated work into the same branch.

Tip

Keep each feature branch focused on one logical piece of work.

Test locally

Before committing your changes, run the project locally and verify that the feature works as expected.

If your project uses a Node-based development server with an npm run dev script, you can start it with:

npm run dev

Check the feature in the browser and look for layout problems, broken links, console errors, or other unexpected behavior.

The exact command for running a project locally depends on the project’s development setup.

Commit changes

Once you have a meaningful set of changes that you have tested, save those changes in Git with a meaningful commit message.

git status
git add .
git commit -m "Add homepage section"

A commit creates a checkpoint in the project’s local Git history. You can make multiple commits while developing a feature.

Commit messages should briefly describe the change represented by that checkpoint.

Push the feature branch

Send the feature branch to GitHub so the remote repository contains your feature commits. The branch can then be used for preview deployment and eventually reviewed through a pull request.

git push -u origin feature/homepage

A commit saves changes in your local Git repository. A push sends those commits to the remote GitHub repository.

Important

At this stage, the feature branch has been pushed to GitHub. The changes have not been merged into main yet.

Repeat the cycle

Development often requires several rounds of changes. You can continue editing, testing, committing, and pushing the same feature branch as the work progresses.

01Start from mainBegin from the latest production code.
02Create featureCreate an isolated feature branch.
03DevelopBuild and test the feature locally.
04CommitSave meaningful checkpoints.
05PushSend the feature branch to GitHub.

After pushing, you can continue making changes on the same feature branch. Each new commit can be pushed to GitHub as the feature develops.

When the feature is ready, the branch can move into the preview and pull request workflow covered in the next chapters.

Support PageDeploy with a coffee