[HTML] 2. 웹 개발 환경 만들기

1 minute read

2. 웹 개발 환경 만들기

HTML 학습을 위해서는 2가지가 먼저 필요합니다.

웹 개발은 웹 편집기로 소스를 작성하고 웹 브라우저에서 결과를 확인하는 식으로 진행한답니다!

그럼, 웹 브라우저와 웹 편집기가 무엇인지부터 간략하게 볼까요?

웹 브라우저란, 웹 사이트 방문 시 웹 편집기로 작성한 문서를 화면에 나타내는 프로그램을 말하며, 대표적으로 크롬, 엣지, 파이어폭스 등이 있습니다.

앞으로의 실습은 크롬 브라우저를 이용합니다. (다들 많이들 쓰고 계시겠죠?ㅎㅎ)

그러니 다른 웹 브라우저 사용자분들은 크롬을 설치하고 와주세요!

웹 편집기란, HTML, CSS, Javascript 등으로 소스를 입력하여 웹 문서를 만드는 데 사용하는 프로그램을 말합니다.

사실 윈도우의 메모장, 리눅스의 vi 편집기 등으로도 소스 작성이 가능하지만 웹 편집기 사용에 따른 이점이 많기 때문에 웹 편집기를 이용합시다!

앞으로의 실습에서는 VS Code(Visual Studio Code)라는 에디터를 사용할 것입니다. (이 또한 많이들 사용하고 계실거라고 생각합니다ㅎㅎ…)

VS Code가 없으신 분들은 설치하고 와주세요!

뭐 사실 실습이랄 것도 없긴 하지만… 다음 포스트로 가기 전에 웹 편집기에서 작성된 소스 문서가 웹 브라우저에서 어떻게 나타나는 지 보고 갑시다!

아래 브라우저 화면을 누르시면 소스코드를 볼 수 있습니다.

<!DOCTYPE html>

웹 문서 만들기

HTML

CSS

자바스크립트

자! 이것으로 본격적인 학습을 진행하기 전 기본적인 개념과 알아야 할 사항들에 대한 설명을 마칩니다.

다음 장 부터는 본격적으로 html 문법에 대한 설명이 진행되니 기대해주세요 ㅎㅎ

그럼 안녕!