웹언어의 기본인 "HTML5 = HTML"을 이용하여 원하는 웹을 얻기 위해서 사용되는 기본 환경을 구성하기 위해 필요한 프로그램을 설치하고 한국어 패치를 통해 조금 더 쉽게 접근하는 방법을 설명해 드리도록 하겠습니다.
읽으시는 분들의 인터넷 브라우저 종류와 상관없이 홈페이지 주소를 입력하여 보다 쉽게 다운로드를 받아볼까 합니다.
홈페이지 주소는 <code.visualstudio.com/>와 같습니다. 해당주소를 입력하여 홈페이지로 이동하시면
Code editing. Redefined. 의 왼쪽 문구와 함께 파란색으로 표시된 Download for windows stable build 버튼을 확인하실 수 있으실거에요. 해당문구를 클릭하여 설치를 해주시고 HTML을 사용할 준비를 해 주시면 됩니다.
설치 하실때는 따로 설정할 필요가 없고 계속 다음버튼을 눌러주시고 설치버튼까지 눌러주셔서 설치를 완료하시면 됩니다. 설치된 비주얼 스튜디오 항목을 확인하신 뒤 실행하시게 되면 이제 영어의 늪에서 헤어나오기 위해 친히 한글패치를 해주시면 되겠습니다. 비주얼 스튜디오를 보시게되면 왼쪽 메뉴에 아래와 같은 조각모음 모양이 보이는데요. 이부분을 클릭하시고 "korean"이라고 검색을 해 주시면 맨 아래 korean language Pack 나옴니다. 저는 벌써 설치하여 제거 버튼이 한글로 보이는데요. 문구를 클릭하시면 홈페이지로 이동하고 Install 버튼을 클릭하여 설치를 진행해 주시면 되겠습니다.
모든 설치가 완료되었다면 재시작하기 "Restart Now"를 선택해 주시면 한글패치가 완료된 비주얼 스튜디오를 만나 보실 수 있게 됩니다. 한글패치가 완료되었지만, HTML로 작성하기 위해서는 한글반 영어반이 되어야 하기 때문에 작성 시 구별하기 어려운 대문자 아이, 숫자 일, 대문자 오와 숫자 영과 같은 문자를 구별하기 위해서 글꼴을 다운받아 적용시켜 주는 작업을 해보도록 하겠습니다.
깃허브에서 받을 수 있는 "D2 coding 글꼴"을 적용해 보도록 할텐데요. 깃허브의 주소도 소개해 드리도록 하겠습니다. <github.com/naver/d2codingfont> 주소를 입력하고 홈페이지로 이동하게 되면 다운로드 Ver 1.3.2(2018.06.01 배포)가 파란색 글씨로 보이실 겁니다. 이 부분을 클릭하시면 D2Coding-Ver1.3.2-2018.05.24.zip 파일이 보이실 거에요 이 파일을 받아 압축을 풀어주시고 풀려진 파일을 선택 오른쪽 버튼을 누르시고 메뉴의 설치를 선택하셔서 설치를 완료해 주세요.
다시 비주얼 스튜디오로 돌아오셔서 설정버튼을 누르시고 설정항목을 클릭하시고 텍스트 편집기의 글꼴 메뉴로 이동하여 D2Coding이라고 입력해 주시면 글꼴이 적용이 됩니다. 설정항목 안에는 정말 많은 기능을 에디팅할 수 있도록 구성해 놓았습니다. 여기까지는 기본적인 항목이라 하더라도 추후에 사용자의 편의를 높이기 위한 다양한 부분을 설정할 수 있도록 비주얼 스튜디오에서 인터페이스를 제공하고 있으니 훑어보고 넘어가 보세요.
'교육이야기' 카테고리의 다른 글
웹개발의 기본언어 HTML 양식 폼, input 태그 및 속성 2편 (0) | 2021.05.14 |
---|---|
웹개발의 기본언어 HTML 다양한 양식 폼, Input 태그 및 속성 (0) | 2021.05.12 |
웹개발의 기본 언어 HTML 멀티미디어 오디오 비디오 파일 태그 (0) | 2021.05.09 |
웹개발의 기본 언어 HTML 구조 구성을 위한 시맨틱 텍스트 이미지 태그 (0) | 2021.05.06 |
웹개발의 기본 언어 HTML 기본구조와 태그의 이해편 (0) | 2021.05.05 |