Skip to content
Azril Hakim
LinkedInGitHub

Environtment Setup

Before you start creating web pages with HTML, it’s essential to set up your development environment. This section will guide you through the necessary steps to get started.

1. Choosing a Text Editor

The first decision you’ll need to make is choosing a text editor for writing your HTML code. While you can use any plain text editor, many developers prefer code editors that offer features like syntax highlighting, autocompletion, and code organization. Here are some popular choices:

  • Visual Studio Code: A free, open-source code editor by Microsoft with a large community and a wide range of extensions for web development.

  • Sublime Text: A lightweight and customizable code editor known for its speed and simplicity.

  • Atom: An open-source code editor developed by GitHub, featuring a user-friendly interface and extensive customization options.

  • Brackets: An open-source code editor created for web development, with a live preview feature.

  • Notepad++: A free, Windows-based code editor that is simple and efficient.

Choose the text editor that suits your preferences and install it on your computer.

2. Creating Your First HTML File

Once you have a text editor in place, it’s time to create your first HTML file. Here’s how:

  1. Open your chosen text editor.
  2. Create a new file by selecting “File” > “New” or using the keyboard shortcut (e.g., Ctrl + N or Cmd + N on macOS).
  3. In the new file, save it with an “.html” file extension, like “index.html.” The “.html” extension indicates that this is an HTML document.

3. Understanding the HTML Document Structure

Every HTML document follows a specific structure. Understanding this structure is crucial as you begin writing HTML code. Here’s a basic outline of an HTML document:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Your Page Title</title>
</head>
<body>
    <!-- Your content goes here -->
</body>
</html>