js 기본 정리 시작 이유 + js 환경 조성

프로그래머스 어느덧 0단계,1단계, 2단계를 120문제 가량 풀어보면서 이런 모듈을 만드는것만 말고, 개발을 하고 싶었다.

짧은 js 개발 코드들을 타이핑 해보며 따라해볼려 했으나, 내가 그 코드를 이해하지 못했다.

 

같이 프로젝트를 해나가면서 설명해주는 강의도 있는데, 기본을 배울 수 있지만... 기본을 배우는데 초점을 맞추기보단 순서도를 익히는데 초점이 되어있어 내겐 무척 어려운 강의였다.

 

html, css 공부할 때처럼 나만의 이론 정리서가 필요함을 느낀다.

내 전용 정리서를 만드는게 먼저다. 그리고 나서 순서도를 익히는게 맞는듯 싶다.

왜 걷지도 못하는데 경보를 할려고 하는가?

 

---

지금 부터는 자바스크립트를 학습할 때 유용한 (혹은 제가 사용했던) 확장들을 소개 하겠습니다.

우선 좌측에 탭 중 사각형을 조립하는 듯한 탭을 클릭하거나 Ctrl + Shift + x를 누르면 확장 창이 나옵니다.

검색창에 직접 검색하셔도 되고 추천탭의 확장을 읽어보시고 설치하셔도 됩니다.

 

0. 테마변경 + 한국어

테마변경은 개인의 취향이므로 theme 검색하셔서 맘에드는 색조합이 있는 테마를 적용하시면 됩니다.

그리고 영어가 아직 익숙하시지 않은 분들은 korean을 검색하셔서

이 확장을 추가로 설치하셔서 한국어 환경을 이용하시면 됩니다.

 

1. Bracket Pair Colorizer 2

 한쌍을 이루는 괄호들을 다른 색상으로 색칠 해 주는 확장입니다. 코드가 너무 알록달록하면 오히려 눈아프고 가독성이 떨어져서 좋아하지 않는 분도 계시지만 저는 개인적으로 선호합니다. 또 자바스크립트는 괄호가 좀 복잡하게 나오는 경우가 많아서 개인적으로 추천드립니다.

 

 

 

2. Visual Studio IntelliCode

 빠른 코드 작성을 위한 확장입니다. 내가 지은 변수명 등을 빠르게 쓰도록 지원해 줍니다.

 

 

3. JavaScript (ES6) code Snippets

자바스크립트 코드에 대한 스니펫을 지원합니다. 스니펫이란 console.log()와 같은 명령어를 clg만 쳐도 해당하는 명령어가 나올 수 있게 작성을 도와주는 기능입니다.

 

4. Live Server

웹페이지의 변화를 실시간으로 보여줌과 함께 ALT+L+O단축키로 웹페이지를 바로 열 수 있는 단축키를 제공합니다.

단축키로 웹을 열고 페이지 변화를 보여준다는 강력한 기능때문에 필수로 추천드립니다.(자바스크립트 말고도 html/css개발에도 좋음!)