2. 이클립스에서의 서버 설정, HTML 환경, 기본 구성

이클립스에서 HTML을 작성하기 위한 기본 설정과 HTML 기본구성 태그의 종류와 이용방법을 알아보겠습니다.

1. 프로젝트 생성과 HTML개발환경 설정

1) Dynamic Web Project 생성

Dynamic Web Project 생성

HTML을 작성하기 위해서 Dynamic Web Project를 생성해줍니다.

프로젝트 이름을 적고 Next를 두번 누른 후에 generate web.xml deployment descriptor 체크박스를 체크하고 Finish를 눌러줍니다.

2) 서버생성 & 프로젝트에 서버 연동

프로젝트 생성을 확인하였다면 서버를 생성하고, 프로젝트와 서버를 연동하여야 합니다.

이클립스 환경을 Java EE로 변경하고 Quick Access에서 server을 클릭하여 서버창을 열어줍니다.

서버생성을 누르고 자신에 맞는 서버를 선택하여 생성해줍니다.

저의 경우 Tomcat 9.0을 이용하여 9.0 선택

위처럼 서버가 잡혀있다면 정상적으로 진행된겁니다.

프로젝트와 서버를 연결하려면 해당 Dynamic Web Project 우클릭 후 properties -> targeted runtimes를 검색하고 맞는 서버를 체크, Apply합니다.

톰캣이 프로젝트와 정상적으로 연결됨을 확인할 수 있습니다.

3) 기본 브라우저 설정 및 CSS, HTML, JSP파일 인코딩 형식 변경

이클립스에서도 브라우저를 지원하지만 다양하게 웹을 이용하기 위하여 브라우저를 변경합니다.

Preferences 에서 Web Browser을 선택하여 크롬으로 설정하였습니다.

UTF-8 인코딩 형식은 한글까지 원활하게 출력해주고 여러 웹페이지들의 디폴트 형식이기 때문에 개발하는 환경의 인코딩 형식을 UTF-8로 변경해줍니다

Preferences - Web - CSS, HTML, JSP의 인코딩 형식을 모두 UTF-8로 설정하고 Apply합니다.

2. HTML의 기본 구성

생성한 프로젝트의 WebContent폴더에 HTML File을 만들어줍니다.

<!DOCTYPE html>

<title>Insert title here</title>

</head>

</body>

</html>

HTML File을 열면 기본적으로 틀이 잡혀 나오게 됩니다.

이 틀에 맞춰서 각각의 태그를 알아보면

위처럼 정리할 수 있습니다.

실행시 창은 위처럼 나오며 아직 아무런 내용도 입력하지 않았기 때문에 <title> Insert title here </title> 코드로 인해 창 이름만 입력된 것을 볼 수 있습니다.

[HTML] HTML의 요소 (0)	2021.02.03
[HTML] 테이블, table (0)	2021.02.03
[HTML] <a>태그, 하이퍼링크 이용하기 (0)	2021.02.03
3. HTML 태그의 종류와 이용방법(List 태그, Divisioin, 특수문자) (0)	2021.01.19
1. HTML의 시작, Tomcat설치, 환경설정 (0)	2021.01.19
1. JSP시작 개념 (0)	2021.01.19

수학하다 개발하기