코딩 공부를 시작하는 사람들이 필수적으로 학습하는 3가지에 대해 알아보겠습니다. 우리가 흔히 웹사이트를 개발할 때에는 반드시 알고 있어야 하는 3가지 언어가 있습니다. 바로 HTML, CSS, JavaScript입니다.
평소에 학습하면서 HTML, CSS, JsvsScript가 왜 기본적으로 알아두어야 할 언어일까?에 대해 생각해 본 적이 없었기 때문에 차이점을 학습해 보려고 합니다.
HTML (Hyper Text Markup Language, 하이퍼 텍스트 마크업 언어)
웹 브라우저에서 문서 및 웹 페이지가 표시되는 방법을 규정하는 언어로, 어떤 웹 사이트에서든 블록(block)을 구성하는 데 사용되는 언어입니다. HTML을 사용하여 웹 사이트의 구조를 생성합니다.
- Hyper Text : 다른 문서와 쉽게 연결이 되도록 한 '링크'의 모음으로 구성된 문서
- HTML은 마크업(표기)언어로, CSS와 JavaScript는 HTML을 보강하는 언어입니다.
- 웹 개발자와 운영자가 웹 사이트의 구조를 만들 수 있는 단순하고 강력한 언어입니다.
- 블로그에 있는 어떤 문장을 굵은 글꼴로 표시하고 싶은 경우, HTML을 통해 쉽게 작업할 수 있습니다.
- HTML을 사용하면 어떠한 텍스트 파일에서도 태그(tag)를 사용하여, 다양한 효과, 그래픽, 폰트, 색깔을 지정할 수 있습니다.
- HTML은 프로그래밍 언어를 배울 수 있는 좋은 시작점이 될 수 있는 언어입니다.
HTML로 무엇을 할 수 있는건가요 ?
HTML을 학습해야 하는 가장 큰 이유는 웹 사이트를 운영자가 사이트의 기본적인 구조를 만들 수 있기 때문입니다. 웹사이트의 기본 구조를 만들고 나면, 다른 코딩 언어를 사용하여 디자인이나 동작을 보강할 수 있습니다.
➡️ HTML에 대한 기본적인 이해도가 있다면, 웹 사이트에 대한 제어와 유연성을 크게 높일 수 있습니다.
CSS (Cascading Style Sheets, 케스케이딩 스타일 시트)
HTML로 만들어진 문서의 스타일을 지정하는 방식을 규정하는 스타일 시트 언어입니다. CSS는 웹사이트를 시각적으로 보다 매력적으로 만드는 기능을 제공합니다.
- CSS는 정적인 프로그래밍 언어이지만, 웹 사이트를 시각적으로 더욱 매력적으로 보이게 만드는 데에 사용될 수 있습니다.
- CSS에 대한 내용을 기본적으로 이해하고 있다면, 웹 사이트의 전반적인 디자인에 변화를 줄 수 있습니다.
CSS로 무엇을 할 수 있는건가요 ?
CSS는 주로 정적인 시각효과를 만드는 데 사용되지만, 간단한 동적인 시각효과 또한 애니메이션 효과를 통해 줄 수 있습니다.
➡️ HTML로 작성된 내용에 CSS를 사용하면, 웹 사이트의 레이아웃과 포맷을 변경할 수 있습니다.
JavaScript (자바스트립트)
웹 사이트가 로딩된 이후, CSS와 HTML 구성요소들을 변경할 수 있도록 해주며, 이를 통해서 웹 사이트를 보다 인터랙티브(interactive)하게 만들어주며, 사용자의 참여율 또한 높일 수 있습니다.
요즘 웹 사이트를 살펴보면, 어떤 버튼을 클릭하면 새로운 메뉴바가 펼쳐지며 사용자가 웹 사이트를 쉽게 이용할 수 있도록 만들어져 있습니다. 이러한 인터랙티브한 요소를 생성하는 것이 바로 JavaScript입니다.
- JavaScript에 대한 기본적인 내용을 이해하고 있다면, 여러가지 기능을 조작하여 다양한 범위의 작업을 수행할 수 있습니다.
JavaScript로 무엇을 할 수 있는건가요 ?
웹사이트를 통해 계산기 기능을 만들거나, 다양한 키보드 단축키를 생성하여 다른 페이지로 이동할 수 있는 기능 등 HTML과 CSS 구성요소를 자유롭게 변경하여 인터랙티브한 웹 사이트를 생성할 수 있게 됩니다.
➡️ HTML로 작성된 내용에 CSS를 사용하면, 웹 사이트의 레이아웃과 포맷을 변경할 수 있습니다.
웹 사이트는 다양한 코딩 언어와 프로그래밍 언어를 사용하여 개발할 수 있으며, 웹 개발에서 가장 많이 사용되는 대표적인 언어들로는 HTML, CSS, JsvsScript, PHP, Python, SQL.. 등이 있습니다. 웹 개발 언어들은 각자 다른 목적을 가지고 있습니다. 또한 프로젝트의 종류에 따라서 서로 다른 코드의 언어가 사용됩니다. 하지만 기본적인 언어인 HTML, CSS, JavaScript만으로도 웹 디자인과 개발에 대한 기초를 이해하기에 충분합니다. 따라서 각 언어의 역할과 사용법을 잘 숙지해두어야 앞으로 새롭게 나오는 언어를 학습하는 경우에도 수월하게 학습할 수 있을 것입니다.
