본문 바로가기
HTML-CSS

[HTML-CSS] HTML- CSS 공부 시작 전 환경세팅

by eigen96 2022. 8. 27.
728x90

HTML과 CSS를 알긴 알지만 숙련도가 거의 0에 수렴하는 상태...

이번 기회에 공부를 해보고자 

얄코님의

'제대로 파는 HTML & CSS 강좌-웹 개발 퍼블리싱 끝장내기' 강의를 들으며 정리해보고자 합니다.

절반 분량(약 5시간)인 기본개념은 무료라고 해요!

 

https://www.youtube.com/watch?v=TrC2x4N0XqY 

 

익스플로러 설치 (Chrome으로 진행)

일단 개발 환경부터 세팅해야겠죠?

세팅하기전에 익스플로러는 피해달라고 합니다.

이미 크롬과 Safari만 쓰고 있었기에 상관없었지만요.

현재 최신기술이 적용되고 있는 웹표준을 따르지 않는 익스플로러는 사용하지 않는 게 좋다고 합니다.

웹에서의 적폐라고 하시더라구요 ㅋㅋㅋㅋ.

코드 에디터 설치 (VS Code)

다음은 아래 링크에서 코드 에디터 VS 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

처음 VS Code를 열게 되면 자동 줄바꿈과 탭 사이즈를 설정해줍니다.

아래 단축키를 통해 설정에 들어갈 수 있습니다.

Command +

tab size를 검색하여 2로 바꾸어줍니다. 그 이유는 크기가 디폴트인 4로 되어있을 때는 오른쪽으로 많이 치우쳐지기때문이라네요.

다음은 word wrap을 On으로 설정해줍니다. 

이 속성은 창이 좁아질 때 자동으로 줄을 짧게 정리해서 보여주는 거라고 합니다. 그럼 왼쪽오른쪽으로 스크롤할 필요가 없어지죠.

코드 에디터 설치 (VS Code)

다음으로 플러그인을 설치해줍니다.

추가 기능을 아래 버튼을 통해 들어가셔서 원하는대로 검색해서 설치가 가능하다고 합니다.

 

 

728x90

댓글