How to Hosting a Website on GitHub 2024, Step by Step - Mytips.id

How to Hosting a Website on GitHub 2024, Step by Step

mytips.id
mytips.id


Mytips.id - With GitHub Pages, you have the ability to host your website directly from your GitHub repository. 

It's fast, easy, and completely free. Simply follow the steps outlined in this quick tutorial. GitHub Pages is a free service provided by GitHub that allows you to host your website directly from your GitHub repository and make it accessible on the internet. You can find GitHub Pages at https://pages.github.com/.

GitHub Pages is a fantastic service for hosting websites, and we're here to show you just how easy it is to get started and make your website available online. Let's dive right in:

Step 1: Create your free GitHub account

In order to host your website on GitHub Pages, you'll need a free GitHub account. You can create an account at https://github.com/. 

This account will be necessary for creating your first GitHub repository in the next step. The repository will be used to store the files for your website that need to be published. So go ahead and create your free account at https://github.com/ now.

Step 2: Create your GitHub repository

Once you've successfully created your free GitHub account, you'll need to create a repository in the next step. This is where your website files will be stored. 

Here, all you need to do is provide a name for your repository and you're ready to go. Important note: The name must be in the format username.github.io, where "username" is your GitHub username (or organization name). Press the "Create repository" button to start the creation process:

Creating a new GitHub repository is as simple as pressing the "Create repository" button

After the creation is complete, you'll be redirected to a page that looks similar to the following:

A sample GitHub Pages website after the repository is created:


Step 3: Create a local folder and clone the remote GitHub repository

With the availability of the GitHub repository, we transition to the command line and create a new empty folder that will be used to store the website files that need to be hosted on GitHub pages.

$ mkdir my-website

We are now ready to clone this repository into our local project folder using the following command:

$ git clone https://github.com/[username]/[username].github.io

Git informs you that you are cloning an empty repository. This is true because we haven't added any files yet.

To clone the repository, navigate to the newly created subfolder.

Step 4: Add your website files to the folder

Now it's time to add some content to our folder. To simplify things, our testing website will consist of just one simple HTML file - index.html.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>My Website</title>
  </head>
  <body>
    <main>
        <h1>Welcome to My Website</h1>  
        <p>This is my new website which is hosted on GitHub Pages!</p>
    </main>
  </body>
</html>

Push the local repository's application status to GitHub.

Step 6: Access the implemented website in the browser

By adding your website file to the GitHub repository, the deployment is done automatically. No further steps are needed. The website is now online and can be accessed in a browser using the URL https://[username].github.io/

This website is hosted and accessible online.

That's it, only 6 simple and easy steps to make your website available online using GitHub Pages.

Posting Komentar