코딩교육/웹프로그래밍

웹 프로그래밍을 위한 Visual Code 다운로드 및 설정

욜로제이드 2022. 3. 13. 23:14

이번생에 웹 프로그래밍은 없을줄 알았는데 결국 웹 프로그래밍 분야까지 왔습니다. 

 

역시 IT 분야 자체가 계속 트랜드를 타고,

신생언어와 사장되는 언어,

신기술과 사장되는 기술들이 자주 있는 것 같습니다.

 

 

 

지금의 트랜드는 아무리 봐도 '웹' 기반 기술 인것 같네요.

 

 

 

 

꾸역꾸역 10년간 Windows 계열 언어와 어릴때 배웠던 Flash 기반으로 ActionScript 2.0 / 3.0 을 써서 잘 울궈먹었던 것 같습니다.

 

 

 

 

새로 시작하는 기분으로 Visual Code를 설치 해보고, 셋팅을 해보며 기록을 남깁니다.

 

 

 

웹 프론트앤드 개발시 사용 Tool -> HTML5 + CSS3 + Javascript 개발 진행시 주변에서 보니 Visual code를 많이 쓰길래 저도 설치를 해봅니다.

 

 

 

Visual 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

 

 

 

 

 

 

 

그리고나서 마켓 플레이스에서 Live Server 만 설치를 했습니다.

혹시 몰라서 찾아보니, 현업 프론트앤드 개발자들은 여러가지를 다 설치해서 쓰네요.

 

추천된 10개 목록을 한번 찾아서 설치 해볼까요?

 

 

아래의 유튜브는 제 유튜브는 아닙니다.... 그냥 딱 봤는데 괜찮은것 같아서 추천!

 

https://youtu.be/bS9yTI2fC0w

 

 

 

설치할 목록 정리

 

00:00 - Introduction

04:46 - Material theme

05:00 - Material icon theme

05:20 - Prettier

06:56 - bracket pair colorizer

07:28 - Indent-rainbow

08:00 - Auto rename tag

09:00 - CSS PEEK

09:43 - HTML CSS SUPPORT

10:00 - LIVE SERVER

 

 

 

저는 위에서 추가로 한국어 팩 Korean(사용법) Language Pack for Visual Studio Code 을 설치했어요.

처음에 한글로 visual code 를 썼더니 아무래도... 영어보다 한글이 편한 이 한국인이네요 :-)

 

 

 

처음 설치 하시는 예비 웹프론트앤드 개발자님들,

혹은 VisualCode 처음 설치 해보시는 분들께 도움이 되었으면 좋겠습니다.!!

 

 

 

 

 

 

반응형