Welcome

학습 패널

메뉴에서 항목을 누르면 이 패널에 해당 튜토리얼이 표시되고, 아래에는 직접 실습할 수 있는 HTML 에디터가 있습니다. 아래 리사이저 핸들을 드래그해 높이를 조절할 수 있으며, 위로 끌어 올려 헤더 뒤로 완전히 숨겼다가 다시 아래로 당겨 꺼낼 수 있습니다.

Bug Loop Editor

온라인 HTML 편집기

<header>
  <header>
  <h1>나의 첫 번째 웹페이지</h1>
  <nav>
    <ul>
      <li>홈</li>
      <li>소개</li>
      <li>연락처</li>
    </ul>
  </nav>
</header>

<main>
  <section>
    <h2>환영합니다!</h2>
    <p>이것은 아주 기초적인 HTML 예시입니다.</p>
  </section>

  <section>
    <h2>내가 좋아하는 것들</h2>
    <ul>
      <li>고양이</li>
      <li>코딩</li>
    </ul>
  </section>
</main>

<footer>
  <p>&copy; 2025 한동선의 블로그</p>
</footer>
</header>

Live Preview

bugloop://preview

Ready — Press Run to update preview ⌘/Ctrl+Enter: Run ⌘/Ctrl+B: Toggle Sidebar

한동선

두동선

세동선

학습 패널

온라인 HTML 편집기

학습 패널

온라인 HTML 편집기

Assets