Visual Studio Code is a free, beginner-friendly code editor. Choose your operating system, install it, then add Live Server to preview your HTML instantly.
Follow each step carefully. Do not skip any step.
Click the button for your operating system above. The installer will download automatically.
Open the downloaded file. On Windows, click Next → Install. On macOS, drag VS Code into Applications. On Linux, open the .deb package with Software Install.
Launch the editor. You will see a welcome screen with buttons like Open Folder and New File.
Click Open Folder. Create a new folder on your desktop (for example, my-website) and open it.
Click New File in the welcome page. Save it as index.html in your project folder.
Copy the starter code below, paste it into index.html, and press Ctrl+S (or Cmd+S) to save.
Click the Extensions icon in the left sidebar (four squares). Search for Live Server, then click Install.
Open index.html and click the Go Live button at the bottom-right. Your page will open in the browser and update automatically every time you save.
Copy this starter code into your index.html file. It already includes Bootstrap via CDN, so you can paste any component from CodeShikhi inside the <div class="container">.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My First Website</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container py-5">
<h1 class="display-5 fw-bold text-primary">Hello, CodeShikhi!</h1>
<p class="lead">This is your first HTML page running with Bootstrap.</p>
<a href="#" class="btn btn-primary">Get Started</a>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
This is how the starter code looks in a browser. Anything you paste inside will render like this.
Follow these quick checks. If any step fails, jump to the troubleshooting list below.
The Live Server extension is not installed. Click the Extensions icon on the left sidebar, search for "Live Server" by Ritwick Dey, and click Install. Reload the window after installing.
You opened a single file, not a folder. Go to File → Open Folder and select the folder that contains your index.html file.
Live Server did not start. Look at the bottom-right — the button should say "Port: 5500" when running. Click Go Live again, or restart VS Code.
Another program is using the port. Close other VS Code windows, or change the port: File → Preferences → Settings → search "Live Server Port" → set 5501 and click Go Live again.
Your file is not named index.html, or you opened the wrong folder. Rename your file to index.html and make sure it sits directly inside the opened folder.
You forgot to save. Press Ctrl+S (Cmd+S on Mac). Also make sure the browser tab opened by Go Live is the one you are looking at — not a manual localhost tab.
Click "Allow access" so Live Server can start the local server. It only serves your own computer, nothing goes to the internet.
Ask a beginner-friendly question on our Learn page — reply comes back in Bangla, English or Banglish, step by step.