Steps to Create a HTML Project

As a beginner we sometimes face some difficulties to create a basic HTML project. It is very easy to get started with HTML. In this blog you will get to know how to deal with these problems.

Step-1:

Create a Project Directory
It is always better to create a directory while working in a new project. So, just create a new directory in your system according to your project name. If you'r a Linux or Mac user you can create the directory using terminal and for Windows user you just right click from your mouse and create new folder.

mkdir folderName

Step-2

Navigate to the New Directory
Now you need to go to the directory which you have created in Step-1. Windows user just double click to the folder you will reach the directory.
For Mac and Linux user will follow the following commands

cd folderName

Step-3

In this step you need to open your preferred Text Editor. I recommend everyone to use VS Code Editor. If you are a Windows user just open the code editor and then open the folder that you have created in Step-1. In VS code you just need to navigate File > Open Folder and select the right folder. If you are a Linux or Mac user you can start the VS code using the command below:

code .

Step-4

Create a New HTML File
In this step just create a new html file. Remember while you have created the html file you need to add .html extension at the end of the file. Otherwise your browser will not recognize the html file. In the naming convention your home page name always should be index.html and the files name must be contain small letter and have no spaces in the file name. Windows user can create a html file by right click to the mouse or they can create the file using VS Code. On the other hand Linux and Mac user can do this by using their terminal

touch index.html

Step-5

Write Your HTML Code
It is the most awaited time to write the HTML code. Here everyone need to write the html code according to their needs. Here, I want to mention that after writing the code you need to save the file before go to see the output. Or you can enable auto save option from the VS code. Most of the beginner faces this problem. So be careful and do not forget to save your code.

Final Step

Show the Output
It's time to show the output in the browser. Windows user can go to their folder and double click to their preferred html file and they will see the output to their default browser. Linux and Mac user also do that same as the Windows user or use Terminal to open the HTML file in their default browser by executing the command below:

start index.html

Now you know how easy to start a new HTML project as beginner. Happy Coding..👍