HTML โครงสร้างก่อนสวย

เช็กลิสต์โครง

DOCTYPE, lang, charset, title

• หัวข้อโปรเจกต์หนึ่งอัน (h1)

• ส่วนอินพุต (form หรือ input+button)

• ส่วนผลลัพธ์ (ul / กล่องคะแนน / พื้นที่คำถาม)

• พื้นที่สถานะสั้น ๆ (#status)

• ลิงก์ CSS และสคริปต์ท้าย body

<body>
  <h1>สมุดบันทึกสั้น</h1>
  <p id="status">ยังไม่มีโน้ต</p>
  <form id="noteForm">...</form>
  <ul id="list"></ul>
  <script src="js/app.js"></script>
</body>
เทคนิค: id ของโหนดหลักให้ตรงกับที่ query ใน JS และตั้งชื่อให้สื่อหน้าที่