2024_06_19 오늘의 강의노트(요약)

개발 환경 설정

브라우저 실행 단축키 설정

1. 이클립스에서 브라우저 실행 단축키 설정 방법:
   • 브라우저 실행 단축키 설정을 통해 개발 효율성을 높이기 위해 이클립스에서 단축키 설정 방법을 설명.
2. 단축키 설정 단계별 설명:
   • 단계별로 브라우저 실행 단축키를 설정하는 방법을 구체적으로 제시함.

이클립스 프로젝트 생성

1. Dynamic Web Project 생성:
   • 프로젝트명: eduHtml
   • WEB-INF 하위에 파일 및 폴더 생성:
     • index.html 파일 생성
     • layout 폴더 생성 후 그 하위에 content.html, header.html, footer.html 파일 생성
2. WEB-INF의 역할:
   • 접근 제한:
     • 클라이언트로부터 직접 접근할 수 없는 디렉토리로 웹 애플리케이션의 보안성을 높임.
   • 구성 요소 보호:
     • 웹 애플리케이션의 구성 요소와 리소스를 보관하여 안정성을 제공함.
3. 프로젝트 생성 과정:
   • hello html 작성 후 실행:
     • hello html 작성 후 ctrl + b를 사용해 브라우저에서 실행.
     • 브라우저에서 출력 화면을 확인하며, 기본적인 HTML 파일 구조를 이해하고 테스트함.

HTML 기초

HTML 문서의 트리 구조

• 문서 노드:
  • HTML 문서의 최상위 노드로, HTML 문서 전체를 나타냄.
  • 모든 다른 요소들은 이 문서 노드의 자식으로 구성됨.
• 요소 노드:
  • HTML 문서의 요소(태그)를 나타내며, 다른 요소 노드나 텍스트 노드를 자식으로 가질 수 있음.
  • 예: <div>, <p>, <a> 등.
• 속성 노드:
  • HTML 요소의 속성을 나타냄.
  • 속성은 요소에 추가 정보를 제공하며, 속성 노드는 요소 노드의 일부로 포함됨.
  • 예: class="example", id="main", href="link" 등.
• 텍스트 노드:
  • HTML 문서의 텍스트 내용을 나타냄.
  • 텍스트 노드는 요소 노드의 자식으로 포함되며, 실제로 사용자에게 보이는 텍스트 내용을 표시함.
  • 예: <p>이것은 텍스트입니다.</p>에서 "이것은 텍스트입니다."