How to Set Up an HTML Editor


What You Need

  • A code editor (like VS Code, Notepad++, Sublime Text)
  • A web browser (like Chrome, Firefox)


Step-by-Step Guide


Install a Code Editor


We recommend VS Code (Visual Studio Code) because it's free and beginner-friendly.
Download from: https://code.visualstudio.com/
  • Install it like any normal software.
  • Open it once installation is complete.


Create Your First HTML File

In VS Code, click on:

  • File → New File
  • Name it: index.html


Now you can type your HTML code:

<!DOCTYPE html>
<html>
<head>
  <title>My First HTML Page</title>
</head>
<body>
  <h1>Hello, world!</h1>
  <p>This is my first HTML page.</p>
</body>
</html>


Open HTML File in Browser

  • Right-click the file in your computer’s folder.
  • Choose "Open with" → Your Browser (Chrome, etc.)
Now you’ll see your webpage live!

Optional: Add Extensions in VS Code


To make HTML editing easier, install these extensions:
  • Live Server – instantly preview your HTML changes
  • Prettier – auto-formats your code nicely
To install:
  • Click Extensions icon on the left sidebar in VS Code.
  • Search and install Live Server.
  • Now right-click your index.html file and choose "Open with Live Server".