[eclipse] HTML5를 이클립스로!

---

HTML5를 코딩할때 사용할수 있는 다양한 툴이 있지만 저는 eclipse를 사용해보겠습니다!

​

우선 UTF-8로 텍스트타입을 설정해주시고 tomcat과 oracle database를 연결해주세요!

(eclipse_03, eclipse_05, eclipse_06)

​

이와 같은 화면이시라면 왼쪽의 영역에서 빈화면에 우클릭을 하여 프로젝트를 만듭니다.

우클릭후 new - Dynamic Web Project를 만들어주세요!

(Dynamic web Project가 없다면 new - other을 누른 후 찾아주시면됩니다)

​

​

프로젝트 이름이 HTML00_Hello로 나와있지만 저는 UI01_HTML로 만들었습니다.(크게 중요하지 않아요!)

그리고 Generate wen.xml deployment descriptor에 체크를 했습니다!

​

​

HTML프로젝트가 생성되었습니다.

여기서 html파일을 만들떄 주의해야 할 점이 WenContent폴더에 만들어주셔야합니다.

META_INF와 WEB_INF에 만들게 되면 실행이 되지 않습니다.

반드시 WenContent폴더에 만들어주시기바랍니다.

만드는 방법은 우클릭하여 html파일을 만들면됩니다.

만약 목록에 html이 없다면 other에서 찾아주시면됩니다.

​

​

저는 index.html파일을 만들겠습니다!

​

​

이렇게 html파일이 만들어 집니다. 이와 같이 기본 태그는 이클립스에서 자체적으로 제공을 해줍니다. 하지만 EUC-KR을 UTF-8로 매번 바꾸어야 한다는 약간의 번거로움이 있습니다!

UTF-8로 바꿔주세요!

​

​

Hello, World를 출력시켰습니다!

근데 HTML을 실행시키는 방법이 두가지가 있습니다.

위에 주소를 보면 차이를 알수 있습니다.

컨트롤 f11로 실행할경우 이후 하이퍼링크 태그를 걸었을때 페이지간 이동이 되지않을 경우가 있습니다.

조금 번거롭더라도 이왕이면 프로젝트 우클릭 해서 Run as - Run on server로 실행시켜주세요!

​

​

또한, Window - Web Browser - 3. Chrome 으로 설정하게 되면 실행시 크롬에서 실행결과가 나오게 됩니다.

(실행할때 tomcat 연결 되어있어야 합니다!)