홈페이지 만들기 HTML 강좌 1 - 웹 프로그래밍에 대해서

웹 프로그래밍이란 무엇일까?

# 웹 기반에서 동작하는 프로그래밍 방식을 뜻한다. 웹프로그래밍에 사용되는 언어는 여러가지다. 

# 웹 개발에는 크게 프론트엔드와 백엔드 개발로 나뉘어져있다.

간단하게 정리하자면 프론트 엔드 개발은 사용자에게 실질적으로 보여주는 화면을 개발하는 것이고 

백엔드는 이 프론트엔드와 상호작용을 하며 데이터베이스와 서버를 담당하고 있다.

최근 프론트엔드와 백엔드의 경계가 허물어지면서 (점점 좋아지는 개발자 라이브러리) '풀스택' 개발도 등장하고 있다.

풀스택이란 프론트와 백엔드 모두 교차적으로 작업할 수 있는 역할을 뜻한다. 

프론트엔드 언어는 HTML, CSS, JavaScript 로 구성되어 있다.

실제로 우리가 들어가는 웹 사이트 화면도 이 언어들로 구성되어 있다. 

크롬 프로그램은 웹 개발자에게 쉽게 소스코드를 확인할 수 있는 도구를 제공한다.

1. 크롬에서 아무 웹사이트나 접속한 후 사이트 빈 공간을 마우스 오른쪽 버튼 클릭 후 - [ 페이지 소스 보기 클릭 ] 선택

2. 의미모를 소스들이 나타난 것을 볼 수 있다. 이 소스들이 웹 브라우저 화면에 내용을 표시할 때 어떻게 해야 하는지 미리 

정해놓은 약속을 따른 것인데 이런 약속을 HTML과 CSS라고 생각하면 쉽다.

그러면 프론트엔드 언어들에 대해 간략하게 알아보도록 하자.

HTML

HTML은 하이퍼 텍스트 마크업 랭귀지(HyperText Markup Language)의 줄임말로 하이퍼텍스트를 마크업하는 언어이다. 하이퍼 텍스트는웹 사이트에서 링크를 클릭해 다른 문서나 사이트로 즉시 이동할 수 있는 기능을 말하고 마크업은 태크를 사용해 문서에 어느 부분이 제목이고 본문인지 표시하는 것을 말한다. 즉 웹 문서를 만드는 언어를 HTML이라고 정리 할 수 있다. HTML은 웹문서의 뼈대이며 이 후 설명할 CSS와 JavaScript가 살을 붙여준다고 생각하면된다. 현재 HTML5 버전이 이용되고 있다.

CSS

CSS는 연속되는 스타일 시트(Cascading Style Sheet)의 줄임말로 웹 문서의 디자인을 담당하고 있다. 텍스트 색상이나 이미지 크기, 위치,표 색상 등 웹 문서의 생기를 담당한다고 생각하면 된다. 현재 CSS3 버전이 이용되고 있다.

JavaScript

JavaScript는 웹 페이지를 동적으로 바꿔주고 멀티미디어를 처리할 수 있게 하는 프로그래밍 언어이다. 웹을 위한 인터프리터 언어이며 가장 큰 특징이라면 컴파일이 필요하지 않다. 그냥 스크립트를 삽입하면 웹 브라우저에 동작한다고 볼 수 있다. 최근 웹 개발자들의 프론트 백엔드 경계가 허물어지고 웹 개발을 하는데 시간이 단축되는 것은 자바스크립트의 라이브러리 덕분이다. 현재 웹 개발에 수많은 자바스크립트 라이브러리가 존재하며 2017년도에 ECMA 2017 버전이 출시되었다.

마무리

지금부터 우리가 살펴볼 내용은 프론트엔드에서 가장 기본적인 부분이 HTML을 살펴볼 것이다. 개인적인 생각으로 웹 개발에 가장 쉬우면서 기초가 되는 부분 인 것 같다. 차근차근 정리해보자.