# How to set up GitHub pages.

GitHub Pages is a service by GitHub that allows you to host static websites for free, and it's super easy to set up. All you need is a GitHub account and a project that you wanna host. So if you already have a GitHub account that is great! but if not let's create one. 


## Creating a GitHub Account

Creating a GitHub account is very easy, you can create one by visiting this [link](https://github.com/signup) you will see this page. 

![Screen Shot 2022-11-08 at 12.14.33 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667848481056/QaoXlChYr.png align="left")


Enter the required information and Viola you have a GitHub account.

## Creating a Repository

There are two ways you can go creating a Repository on GitHub, but as this is beginner-focused I'd recommend you to download [GitHub Desktop](https://desktop.github.com/). This makes your interactions with the GitHub Repository very easy. 

Once you have downloaded it and connected your account with it you might get something like this yours might look a bit different as you won't have any **Repositories** yet, but we are going to change that 😅

![Screen Shot 2022-11-08 at 12.20.16 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667848823358/Zql-7GPsQ.png align="left")

Click on the top left where you can see RayanAbid Portfolio in the screenshot or an add new repo button. 

![Screen Shot 2022-11-08 at 12.23.17 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667849055731/Sqe4jwOIr.png align="left")

Press that **Add** button it will open a dropdown.

![Screen Shot 2022-11-08 at 12.25.58 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667849198815/YZoiCKhrR.png align="left")

Now just click the **Add Existing Repository** 

![Screen Shot 2022-11-08 at 12.27.21 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667849275049/cDRCmBG9z.png align="left")

You will see this Modal click choose and navigate to the path of your project.

![Screen Shot 2022-11-08 at 12.28.53 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667849338568/aAl0DMdNu.png align="left")

Once you have opened the folder that you want to push to GitHub you will see this **create a repository** link as you can see below click that. 

![Screen Shot 2022-11-08 at 12.29.41 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667849411195/yWr-FnCuO.png align="left")

Enter the required information and click create a repository

![Screen Shot 2022-11-08 at 12.31.12 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667849477774/ozVd0G2mx.png align="left")

Once done you will see this button on the top center of the screen as shown in the image below click the **Publish Repository** button

![Screen Shot 2022-11-08 at 12.31.58 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667849578264/C4ozOl7fO.png align="left")

Enter information accordingly but make sure to uncheck the **Keep this code private** checkbox as shown in the image below.

![Screen Shot 2022-11-08 at 12.33.28 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667849614090/JyUjGaeUD.png align="left")

Congrats on creating your first repository

![Celebration](https://media.giphy.com/media/IwAZ6dvvvaTtdI8SD5/giphy.gif)

You can press the **View on GitHub** button to open it on GitHub.

![Screen Shot 2022-11-08 at 12.37.32 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667849875361/5fhYc2ikj.png align="left")

It should look something like this. 

![Screen Shot 2022-11-08 at 12.39.07 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667849953508/2QUV7RUnH.png align="left")

Now that we have the repo let's get to the part about why we all are here. 


## Hosting your project on GitHub Pages.

Hosting your project on GitHub Pages Is very easy. Navigate to the Settings tab and open the pages from the center-right of the screen. 


![Screen Shot 2022-11-08 at 12.41.37 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667850157743/_MOt1kANN.png align="left")

and just in case your repo is private you'll have to change its visibility to the public which you can do by scrolling to the bottom and changing your repo's visibility to Public. 

![Screen Shot 2022-11-08 at 12.43.01 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667850188305/RAOVyL0Fp.png align="left")

Now that we are on the pages section click the branch button and choose the branch you want to host it will be the main branch for most users but you can choose any branch you'd like to host click **Save**

![Screen Shot 2022-11-08 at 12.45.29 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667850406087/_eMBynZ0K.png align="left")

and it will start running an action which you can see on the **Actions tab**

![Screen Shot 2022-11-08 at 12.47.43 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667850486726/N7u_Ez4gV.png align="left")


Once that is finished processing you can click the action and get the link to the hosted project. 

![Screen Shot 2022-11-08 at 12.48.56 AM.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1667850566764/BBsKgfIV3.png align="left")

Congrats 🎉 on hosting your first project using GitHub Pages

![Winking Michael](https://media.giphy.com/media/oyIpShY494JVe/giphy.gif)

The project that I've hosted you can visit it [here](https://rayanabid.github.io/threejs/) 

![ezgif-4-18d7f2dc5e.gif](https://cdn.hashnode.com/res/hashnode/image/upload/v1667850872150/omlBSEBXT.gif align="left")

Check out my GitHub. 

%[https://github.com/RayanAbid/RayanAbid]

Follow if you found it useful. Feel free to ask any questions. Thank you for reading

