웹개발의 기초

이희수·2024년 12월 12일

우리 눈에 보이는 부분을 담당하는 프론트엔드에서 사용하는 언어로 가장 기본적인 것이 HTML, CSS, Javascript 이 세가지이다.

  1. HTML

가장 먼저 기본적인 뼈대를 짤 수 있는 언어가 HTML이다.
제목, 소제목, 본문 등 웹페이지를 구성하는 기본적인 구조 아래에서
텍스트, 입력 박스, 버튼, 이미지 등등을 개발자가 원하는 위치에 배치시킬 수 있다.

부트스트랩(Bootstrap)이라는 곳에서 이미 만들어져 있는 다양한 요소들을 가져와 활용하면, 더욱 풍부한 페이지를 만들 수 있다.

  1. CSS

HTML을 이용해서 단순히 구조만 짤 수 있다면, 이후에 눈에 보이는 화면을 예쁘게 꾸며주는 역할을 CSS가 한다.

글자의 크기, 색깔, 폰트, 배경이나 이미지의 크기, 위치, 투명도, 테두리 등등 꾸미기를 할 수 있는 언어이다.

  1. Javascript

예쁘게 꾸며진 화면이 가만히만 있으면 그림과 다를바가 없을 것이다. 멈춰있는 화면에 동적인 움직임을 넣어주는 프로그래밍 언어가 Javascript이다. 자바와 자바스크립트는 마치 인도와 인도네시아처럼 서로 아무 연관 없는, 전혀 다른 프로그래밍 언어이다.

아이디와 비밀번호를 입력하거나, 버튼을 클릭했을 때 특정 작업을 수행하는 등의 동적인 작동을 가능하게 한다.

jQuery(제이쿼리)라는 자바스크립트 라이브러리 모음집을 활용하면, 보다 쉽고 간편한 방식으로 다양한 자바스크립트 코드를 짤 수 있다.

HTML, CSS, Javascript로 만들어진 웹페이지를 열면, 해당 코드 내용이 브라우저에 올라온다고 할 수 있다. 한 번 브라우저 위에 올라온 뒤에는 그 브라우저 개인의 소유가 된다고 이해할 수 있을 것이다. 브라우저에서 어떤 동작들을 수행하고 변화가 있어도, 그 변화 내용들은 오직 해당 브라우저에만 해당된다. 때문에 수많은 사람들이 같은 웹페이지를 사용하면서도 각자의 브라우저에서 각자의 작업을 수행할 수 있는 것이다.

0개의 댓글