▶ html의 개념과 설치&사용방법 ( 아파치 톰캣 다운로드 / 설치방법 )
● HTML이란?
: HTML(Hyper Text Markup Language)은 가장 단순한 웹언어입니다.
웹 문서를 만들기 위하여 사용하는 기본적인 프로그래밍 언어의 한 종류로써, 하이퍼텍스트를 작성하기 위해 개발되었습니다. 확장자를 .html 또는 .htm을 가집니다.
● HTML 구성요소
- 요소(Elements) : 시작 태그와 종료 태그로 이루어진 모든 명령어.
- 태그 (Tag) : 요소의 일부, 시작 태그(요소를 시작)와 종료 태그(요소를 끝냄)가 있음.
- 속성 (Attributes) : 명령을 구체화 시키는 것으로 요소의 시작 태그 안에서 사용됨.
- 변수 (Arguments) : 속성과 관련된 값.
HTML을 하기위해 "이클립스"와 "아파치 톰캣"을 다운로드를 하고, 사용방법을 알아보겠습니다. (순서대로 따라와주세요!)
* 이클립스는 프로그래밍언어를 쉽게 다룰수있게 해주는 하나의 Editor입니다.
* 아파치는 웹으로 연결해주는 역할을 하고, 톰캣은 웹으로 연결해줄때 번역해주는 번역기라고 생각하시면 됩니다.
↓ HTML을 사용하기위한 에디터 다운방법 ( 이클립스 )
우선, 이클립스 다운로드편에서 다운을 인터넷에서 받으시고, 실행하다보면 위 사진처럼 나타나게됩니다.
그러면 빨간색으로 되어있는 부분을 클릭해줍니다. ( Web을 이용하기위해서 EE를 사용합니다. )
https://choseongho93.tistory.com/12 ( 이클립스 다운로드편 참고 )
빨간색은 앞으로 작업할 폴더경로를 지정해줍니다.
동의를 눌러주고 다운로드를 끝까지해주면 됩니다.
여기까지 HTML을 하기위한 에디터인 이클립스를 다운받았습니다.
이제는 아래 "아파치 톰캣"을 다운로드 받는 방법을 알려드리겠습니다.
↓ 아파치 톰캣 다운로드(설치)방법
구글에서 "아파치 톰캣"을 검색한후, 빨간네모를 클릭해줍니다.
http://tomcat.apache.org/ ( 혹시 안되시는 분들을 위해 링크달겠습니다. )
위와 같은 창이 뜨면 왼쪽 중간에 Tomcat 8 이라는 것을 클릭해줍니다.
버전이 다양하게 있지만, 저는 8버전을 다운로드하겠습니다.
8버전을 다운받기위해 "8.0.53"이라는 곳에와서 Core안에 자신의 OS버전에 맞게 다운로드해줍니다.
제 PC는 윈도우10 64비트이기에 빨간네모를 다운로드했습니다.
다운로드 경로는 위에서 했던 경로에 똑같이 해줬습니다. ( 다른곳에해도 무방합니다. )
이로써, 모든 설치가 완료되었습니다.
↓ HTML 사용방법
처음 설치한 이클립스를 실행해줍니다.
실행이 되었다면 좌측 상단에 "File"->"New"->"Dynamic Web Project"를 순서대로 클릭해줍니다.
프로젝트 명은 임의대로 html이라고 입력하겠습니다.
그다음, New Runtime버튼 클릭하면 오른쪽창이 뜹니다.
Apache Tomcat v8.0을 클릭하고 아래 "Create a new local server"를 체크해줍니다.
(8버전을 다운로드받았기에 8버전을 클릭했습니다.)
Next를 클릭해줍니다.
오른쪽처럼 창이 뜨면 Browse버튼 클릭한후, 왼쪽에서 아파치톰캣을 다운받았던 경로를 찾아가서
"apache-tomcat-8.0.53"이라는 폴더(디렉토리)를 클릭해서 경로를 넣어줍니다. (무조건 폴더 선택하셔야합니다.)
"apache-tomcat-8.0.53"폴더 안에는 bin이라는 폴더가 존재하기때문입니다.
Finish를 클릭해줍니다.
이제 이클립스에서 좌측에 사진처럼 생성이 되었을텐데 "WebContent"폴더를 우클릭한후, New클릭하고
Other클릭해줍니다.
html이라고 위처럼 검색해주면 HTML File이라고 뜨면 그걸 클릭하고, Next해줍니다.
파일명은 test01으로 임시로 입력해주고 Finish해줍니다.
여기까지 HTML을 사용하기위한 모든 준비가 완료되었습니다.
다음편에서는 본격적인 HTML을 실습하겠습니다.
'Dev. Front-End > HTML' 카테고리의 다른 글
[HTML] ul / li / ol / dl / dt / dd 사용법 (0) | 2019.08.08 |
---|---|
[HTML] img태그 (이미지넣기) 사용법 (0) | 2019.08.07 |
[HTML] a태그 (주소 링크 달기) 사용법 및 속성 (0) | 2019.08.06 |
[HTML] table / caption / tr / td / th / colspan / rowspan / cellpadding / cellspacing 테이블만들기 (0) | 2019.08.05 |
[HTML] h / font / br & 주석처리 (0) | 2019.08.04 |
[HTML] dfn/ strong / strike / b / i / u / center / sup / sub / br / p / pre / hr 사용법 (0) | 2019.08.03 |
[HTML] Problem Occurred('Starting Tomcat v8.0 Server at localhost' has encountered a problem) 에러 해결 (0) | 2019.08.02 |
[HTML] 아톰(atom)설치방법 및 설정 & 출력해보기 (무료 웹 에디터) (1) | 2019.08.01 |