Deploying Projects on GitHub Pages

GitHub Pages allows us to easily and freely generate static or serverless websites from our published GitHub repositories.

To get started, you need a GitHub user account and Git installed on your machine.

Creating a Repository

In this example, we will create a new repository at github.com/new.

We can either clone the project or go to our code editor, create a directory, add content, and upload the changes to the new repository. Let’s go with the second option.

We create a new directory for our project and navigate into it.

Adding Content to the Project

				
					> mkdir desplegar-en-githubpages
> cd desplegar-en-githubpages

For this example, we will create an index.html file from our code editor, where we will quickly add a basic HTML5 structure using Emmet.

We get the following structure, to which we will add a «Hello World» message that will be displayed on the screen.

We return to the terminal and initialize git.

				
					> git init

We include our changes for the first time.

				
					> git add index.html
> git commit -m "First Commit"
> git branch -M main
> git remote add origin https://github.com/[usuario]^*/[repositorio].git
> git push -u origin main

Enable GitHub Pages and deploy project

We return to the GitHub page and access the Pages section in the repository’s Settings. We select a branch to enable GitHub Pages.

In the sidebar of our repository, we can now see the Environments section and GitHub Pages deploying.

If we click on the GitHub Pages environment option, we access the history where we can check if the deployment has been completed and view the deployed project at [username].github.io/[repository].

Facebook
Twitter
LinkedIn