BitWithBite
HTML Worksheet
🌐 Setting Up Your Environment
SCORE___ / 20
NameClassDate
After this worksheet you can
Install and use VS CodeCreate and save .html filesOpen pages in a browserUse Live Server📚 Quick Recap
A good development environment makes coding faster, catches errors before they matter, and previews your work instantly. In this lesson you'll install VS Code, configure the essential extensions, create your first HTML project, and learn to use browser DevTools — the most important debugging tool you'll ever have.
🧠 Section A · Concept Check ● BEGINNER 4 × 1 = 4
1A popular free code editor is:
2HTML files are saved with extension:
3Live Server gives you:
4To view your file you open it in a:
🧮 Section B · Problem Solving ● INTERMEDIATE 2 + 3×3 = 11
5The editor recommended in this course is VS .
6Save your first page as index..
7Why is index.html a special filename?
8Name two VS Code features that help beginners.
9How do you preview without Live Server?
🚀 Section C · Challenge ● CHALLENGE 5
10What does Emmet's ! shortcut generate?
💭 Reflection — the most useful thing I learned:
A ___/4 B ___/11 C ___/5 Total ___/20
Teacher's Signature
Parent's Signature
✂ answer key — fold or cut before handing out
1-A 2-B 3-A 4-A | 5 Code 6 html 7 = Servers serve it by default for a folder/site root 8 = Syntax highlighting, autocomplete (Emmet), extensions 9 = Double-click the file / open it directly in the browser | 10 = A complete HTML5 boilerplate document