---
# System prepended metadata

title: HOW TO BUILD YOUR FIRST WEBPAG

---

# HOW TO BUILD YOUR FIRST WEBPAGE USING HTML AND GIT
what is HTML? HTML (Hypertext Markup Language) is a text-based approach to describing how content contained within a HTML file is structured. This markup tells a web browser how to display text, images and other forms of multimedia on a webpage. It is also the basic structure for any website or webpage

**Why is Git important in this process?**

Git is a version control tool that would help you in managing your projects.

**steps to take in setting up a project**

Create a folder with the name of the project you want to build 

I'll be talking about how to do it using the Terminal.

when you open your terminal (ctrl+alt T), you type in command `mkdir <your_foler_name>`

then you create a file with the following commands `touch <file_name>` 

make sure to end the file with a .html extension, since you'll be building a web document. 

When you are done open the file with a text editor or code editor like VS code. 

To do this with the terminal when you have a code editor like VS code, you'll open the terminal in that directory and type the command `code .`

this should take you to VS code.

open the terminal and initialize a git repository by entering the command `git init`

<hr>

**CREATING YOUR HTML DOCUMENT**


Document type declaration
The first line of an HTML document must include a document type declaration. 
The declaration tells the browser which version of HTML the page is written as. `<!<DOCTYPE html>` 
HTML element
The `<html>` element tells the browser that the page is formatted in HTML. 
* The HTML document begins with `<html>` and ends with . `</html`
Head element
The `<head>` element contains meta-information about the HTML document, such as the title, styles, and scripts. 
Most of the elements in the `<head>` element are not displayed directly on the page. 
Title element 
The `<title>` element sets the title of the HTML document.
The title is displayed in the browser's title bar or tab.
Body element
The `<body>` element contains the content of the HTML document, such as text, images, links, and other elements. 
The visible part of the HTML document is between `<body>` and `<body>`. 
Tags 
HTML tags are enclosed in < element >.
A tag should have an opening tag and a closing tag.
HTML tags are not case-sensitive.


this should be a basic web structure 


```
<!DOCTYPE html>

<html>

<head>

    <title>I Love Blockfuse Labs </title>

</head>

<body>

    <h1>The greatest place to learn !</h1>

    <p>I LEARNED THAT NETWORKING IS POWERFUL!.</p>
    <a href="Blockfuse-labs.img" alt="image">

</body>

</html>

```

<hr>

**Initializing a git repository**

I have an another article explaining step by step the process of using git l, but for this article I'll take you through the basic steps.

you'll set this folder as a git repository, so that git can track changes to your file and help you with the management.
using the `git init` command. 
This folder is not yet tracked by git unit you add it to files that should be tracked by using the command `git add <file_name>` if you'd like all to be tracked you'll use the command `git add .` to add all files in that directory to be tracked by git.

for these changes to be documented you'll need to commit those changes by entering the command `git commit` though this command won't go through because it needs to be saved with a message so you'll add `-m "<your_message>"`

```
git commit -m "<your_message>"
```
you'll have to write meaningful commit messages to any changes you'll be making to that project to keep good track of the process.

**PUSHING YOUR CODE TO GITHUB**

if you're a total beginner you'll have to go back to my previous article on Git and GitHub.

<hr>

after setting up your local repository you will push this code to your remote repository eexample github. by pushing it to the remote upstream origin (which is your GitHub account) with the commands seen above. After setting your remote origin this is only done once except you switch to another branch.

all this is explained in my previous article, For more insights read through Git and GitHub.

Ater setting this up once you see your code on your GitHub if you'd like to host, there are platforms where you can connect your GitHub account and host for free such as Vercel.

Conclusion:
So basically the aim of this article is to help beginners leverage on their html knowledge, applying git and GitHub for scaling production 


To master all these things practice would be the main thing you'll have to be on...I can tell you that as a developer in this space consistency is the only thing that would keep you going. no matter how much you know keep practicing, finding a Community and staying consistent. That's the key to being a successful programmer. 



