웹사이트 만들기, HTML,CSS,JAVASCRIPT,JQUERY 알아보기

웹사이트를 만들기 위해서는 크게 프런트엔드와 백앤드가 있어야 합니다. 프런트엔드 언어는 눈에 보이는 화면을 만드는 기술로 여러 가지가 있지만 HTML, CSS, javascript, JQUERY 정도가 기본입니다. 물론 이마저도 모두 알아야 시작할 수 있는 것은 아닙니다. 하지만 대략적인 내용을 알고 있으면 큰 도움이 됩니다.

 

그럼 앞에서 언급한 내용을 하나씩 다뤄보겠습니다.

 

1. HTML

HTML은 Hyper Text Markup Languate의 약자입니다. HTML은 웹페이지를 보여주는 언어입니다. Hyper Text는 이동이 자유롭다는 뜻입니다. 링크를 통해 다른 페이지를 마음대로 이동할 수 있는 특징을 말합니다. Markup은 태그로 이루어진 언어를 말합니다. 문서의 서식이나 기능들을 명시하는 것을 태그로 합니다. 태그는 <태그명>~</태그명>으로 이뤄져 있습니다.

 

 

2. CSS

CSS는 HTML서식을 지정하는 언어입니다. 태그를 이용해서 개별로 서식을 지정할 수 있지만, 관리하기도 어렵고 코드도 지저분해집니다. CSS는 미리 서식을 지정하고, 어떤 영역에 서식을 사용할지만 선택하면 됩니다. 서식을 사용할 영역을 선택하기 위해 클래스 선택자나 아이디 선택자를 이용합니다. 여러 곳에 적용할 서식에는 클래스 선택자, 개별로 적용할 때는 아이디 선택자를 이용합니다.

 

3. JAVA SCRIPT

JAVA SCRIPT는 프런트 앤드 개발 언어입니다. 프론트 엔드란 웹서버가 아니라 웹브라우저에서 처리가 발생하는 것을 말합니다. 동적으로 변화하는 웹페이지를 보여주기 위해서, 자바스크립트를 많이 이용합니다. 제이쿼리(JQuery), 앵귤러(Angular) JS, 리액트(React) JS, 노드(Node) JS, 폰갭(PhoneGap) 등 자바스크립트로 제작된 다양한 라이브러리가 등장하면서, 사용성이 더 커지고 있습니다. codepen.io에서 다양한 자바스크립트 예제들을 확인할 수 있습니다.

 

4. JQuery

JQuery는 자바 스크립트 함수들을 모아 놓은 라이브러리입니다. JQuery를 이용하면 쉽고 편리하게 애니메이션과 다양한 효과를 구현할 수 있습니다. 함수 형태로 되어 있기 때문에, 필요한 함수만 호출하면 쉽게 구현할 수 있습니다. 이미지 슬라이드 등을 할 수 있습니다.

이 외에도 Ajax(Asynchronouse JavaScrip and XML)을 이용하면, API를 호출하는 것도 가능합니다.