본문 바로가기
웹프로그래밍/HTML 독학

02. Visual Studio Code 다운로드(HTML 공부시작)

by 자유의지_-_- 2022. 2. 23.

내가 왜 HTML을 공부하려는지 스스로 생각을 끝냈다.

사실 내가 보기에도 앞에 써놓은 이유들은 불완전하고 부족한 이유다.

공부를 시작하는데 꼭 거창한 이유가 필요한 것은 아니지만, 기껏 왜 공부하려 했는지

고민하기로 해놓고 저렇게 끝내는 건 좀 애매하기도 하다.

 

 

근데 기억이 잘 안난다. 계속 생각하면 기억이 날 것 같기는 한데

이미 시작한 마당에 굳이 애써서 명분을 찾으려니 귀찮은 것도 사실이다.

나는 이미 시작했기에 덮고 넘어가지만, 혹시나 HTML을 독학으로 시작할지 말지

고민하는 사람들을 위해서 조금 도움이 되는 정보도 같이 올리겠다.

 

 

해당 영상은 내가 코딩공부를 시작하기 전부터 자주 참고하는 노마드 코더 Nomad Coders 님의 영상이다.

 

본인이 아직 코딩공부를 시작하지 않았거나 뭐부터 시작해야 할지 모르겠다면 이 분의 영상을

천천히 보는 것을 추천한다. 이미 현업에 종사하고 있는 전문가의 냉정하고 솔직한 의견을 참고할 수 있다.

꼭 이 영상말고도 충분히 도움이 되고 흥미로운 영상이 많기 때문에 시간들여 보는 것을 추천한다.

 

 

앞으로 자주 보게 될 친구다.

 

 

이제 다른 이야기는 마무리하고 본격적으로 HTML 공부에 대해서 얘기해보겠다.

나를 비롯해서 행여나 나중에 내 블로그에 방문하여 이 글을 읽을 사람들 모두, 각자의 이유와 목적을 가지고

HTML을 배우려고 할 것이다. 그렇다면 HTML을 능숙하게 다룰 수 있다고 치면

우리는 어디에다가 HTML 문서를 작성하고 편집하게 될까?

 

 

HTML은 정확하게 얘기하면 프로그래밍 언어가 아니다.

일명 마크업 언어라고 하는데 프로그래밍 언어와는 다소 차이점이 있다.

(이것은 나중에 더 정확하게 알아보겠다.)

 

 

그래서 꼭 코드를 짜는 프로그램이 따로 없어도 문서를 만드는 것이 가능하다.

심지어 우리가 지금 당장 바탕화면에 너무나 쉽게 만들 수 있는 메모장을 이용해서도 가능하다.

다만, 실제로 해보면 알겠지만 메모장을 이용해서 HTML 문서를 작성하는 것

생각보다 귀찮은 점이 많다.

 

 

지금이야 우리는 HTML이라는 언어를 막 배우기 시작했고 익숙해져가는 단계이기 때문에,

어느정도 불편한 점을 감내할 수 있을지 모른다. 하지만, 우리가 좀 더 본격적인 작업에 들어가기 시작하면

사소한 불편함도 점차 누적이 되며 무시할 수 없는 비효율을 만들어낼 것이다.

 

 

다행히도 이러한 문제를 겪는 것은 우리가 처음이 아니기에 해결책 역시 이미 존재한다.

이렇게 단순한 방식으로 거대한 작업을 해나가는 것은 한계가 있다. 그래서, 우리의 HTML 학습과 작업을 도와줄

에디터라는 프로그램을 오늘 직접 설치해볼 것이다.

 

 

구글이나 네이버에 Visual Studio Code라고 검색하면

정식 사이트에서 누구나 쉽고 안전하게 다운받아서 실행할 수 있다.

 

 

https://code.visualstudio.com/

 

Visual Studio Code - Code Editing. Redefined

Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications.  Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows.

code.visualstudio.com

 

 

먼저 해당 링크를 클릭해서 들어가면 영어가 가득 써있고

좀 전문적인듯한 느낌을 풍기는 사이트가 열릴 것이다. 영어가 가득하다고 해서

혹시나 겁먹을 것 같다면 걱정 안해도 된다.

 

 

프로그램을 실행시키면 한글버젼으로 업데이트 할 수 있도록 팝업이 뜨며,

나중에 실무적인 부분까지는 몰라도 우리가 공부하는 수준은 유튜브나 인터넷에 한글로 친절하게

잘 설명이 되어있기 때문에 문제 없을 것이다.

 

 

Visual Studio Code 공식 사이트

 

 

이것이 링크를 눌러 들어간 Visual Studio Code의 정식사이트이다.

여기서부터 다운로드를 받고 설치를 해서 실제로 키는 모습까지 쭈욱 알아보겠다.

 

 

 

 

빨간색 네모로 표시해놓은 버튼을 누르면 된다.

윈도우가 아닌 다른 운영체제를 이용하는 사람이라면 버튼 오른쪽의 화살표를 눌러

자신의 컴퓨터에 맞는 것을 다운받으면 된다.

 

 

 

 

윈도우 말고도 macOS, 리눅스까지도 지원한다. 행여 그 외의 운영체제를 사용하는 사람은

밑의 Other downloads를 눌러 확인해보기를 바란다.

 

 

 

 

 

자신에게 맞는 운영체제를 선택하여 다운로드 버튼을 누르면

자동으로 해당 페이지로 이동하게 되며 프로그램이 받아진다. 다운로드가 끝나면

바로 눌러서 프로그램을 실행해보자.

 

 

 

 

잘 확인해보고 동의합니다에 체크를 하고 다음으로 넘어가면 된다.

동의하지 않습니다를 체크할 경우 더 이상 설치를 진행할 수 없게 된다.

 

 

 

 

다운로드 폴더는 설정된대로 해도 무관하고 자신이 원하는 곳으로

위치를 바꿔도 상관없다. 나는 그냥 설정된대로 설치를 진행했다.

 

 

 

 

여기에서 몇 가지 체크하는 게 나오는데 웬만하면 전부 다 체크하는 것이 좋다.

"바탕화면에 바로가기 만들기" 같은 옵션은 기능에 영향을 주지 않지만, 나머지 4가지는

상황에 따라서 프로그램이 작동되는데 방해가 될 수 있기 때문에 전부 체크하는 편을 추천한다.

 

 

 

 

설치 버튼을 누르면 바로 설치가 시작된다.

 

 

 

 

컴퓨터마다 다르겠지만 크게 오래 걸리지 않으니 잠깐 기다리자.

 

 

 

 

Visual Studio Code 실행을 체크하고 종료하면

바로 프로그램이 실행될 것이다. 처음 실행한 사람은 아마 영어로 설정되서

프로그램이 켜질 것이다. 이 때 보통 오른쪽 하단에 한글버젼으로

변경할지 선택할 수 있는 팝업이 뜬다.

 

 

그렇게 한글버젼 패치를 마치면 이런 화면이 뜰 것이다.

 

 

 

 

여기까지 무사히 켜졌다면 우리는 이제 HTML을 공부할 준비가 다 끝난 것이다.

만약 한글패치가 자동으로 진행되지 않았거나 팝업을 실수로 꺼버린 사람들을 위해서 직접

한글버젼으로 업데이트 하는 방법은 링크로 달아놓겠다.

 

 

학교를 다니는 학생이 공부를 할 때는 보통 서점에 가서 참고서나 교과서를 산다.

그리고 공부하면서 정리를 하거나 필기를 하기 위해서 공책과 필기구를 준비한다.

 

 

HTML 역시 마찬가지다. 학원을 다니는 사람이라면 선생님이 있겠지만,

독학으로 공부하기로 한 나는 선생님이 없다. 당연히 누군가 교재를 정해주지도 않는다.

 

 

대신 독학을 하는 사람들은 인터넷과 유튜브라는 더 큰 교과서를 이용해서

그리고 HTML을 공부하는 우리는 Visual Studio Code라는 공책을 이용해서

훨씬 더 자유롭게 공부를 할 수 있을 것이다.

 

 

오늘도 제멋대로인 블로그를 읽어주시는

여러분을 존중하고 존경하며

보람찬 하루가 되기를 바라겠다.

'웹프로그래밍 > HTML 독학' 카테고리의 다른 글

04. HTML 기초문법  (0) 2022.07.05
03. HTML 기본 개념  (1) 2022.02.25
02-1. VS Code 한글화  (0) 2022.02.24
01. 시작  (1) 2022.02.21
HTML 독학  (0) 2022.02.21