#2 초간단 개발환경 세팅하기 - 웹 코딩 강좌

웹 디자이너를 위한 웹 코딩 강좌 두 번째 시간입니다.
웹 코딩에 대한 이해와 실제 작업을 하기 전에 최소한의 준비물이 있습니다. 바로 에디터 툴! 마치 포토샵과 같은 거죠.
물론 그림판으로 그림을 그리듯, 메모장으로도 코드를 작성할 수는 있지만... 개인적으로 굳이 그렇게 해야하나 싶어요.
저는 개인적으로 비주얼 스튜디오 코드를 사용합니다. 브라켓, 아톰, 서브라임 텍스트, 스톰 등등의 좋은 에디터 툴들도 있습니다. 기존에 사용하시던 툴이 있다면 따로 설치하실 필요는 없습니다.

비주얼 스튜디오 코드 사이트 바로가기 https://code.visualstudio.com/

추가로 작업에 능률을 올려줄 Extension을 설치해줘야 합니다.
Auto Close Tag - 자동으로 태그를 닫아주는 기능
Auto Rename Tag - 시작태그를 수정하면 종료태그를 같이 바꿔주는 기능
HTML Snippets - 효율적인 태그 작성을 도와주는 기능
Autoprefixer - 크로스 브라우징을 위해 접두사를 넣어주는 기능
Live Server - 로컬서버를 만들어 브라우저에서 실행되고 저장하면 바로 적용을 보여주는 기능

🌟예제 다운은 멤버십 회원 전용 커뮤니티에 올린 링크에서 받으실 수 있습니다.🌟

🚀 디자인베이스 멤버십 가입하면 다양한 고급 강좌와 예제 파일을 받아볼 수 있어요 🚀
┗    / @designbase  

*디자인베이스 강좌는 Mac OS를 기준으로 해서 윈도우 사용자와 일부 차이가 있을 수 있습니다. 제가 사용하는 툴은 비주얼 스튜디오 코드(Visual Studio Code)를 사용하며 여러분이 다른 툴을 사용한다면 환경이 다를 수 있습니다. 하지만 언어는 똑같기 때문에 작업하는 데 문제는 전혀 없습니다.

누구나 손쉽게 배우는 디자인 강좌, 디자인베이스입니다. 디자이너로서 웹 코딩 공부의 첫단추는 디자인베이스에서 시작하세요. 열정만 준비하시면 다 따라 할 수 있습니다.

☞ 디자인베이스 소개 : http://designbase.co.kr/about/
☞ 공식 웹사이트 : http://designbase.co.kr/
☞ 네이버블로그 : https://blog.naver.com/designbasekorea


*BGM 사용 출처

Track: Syn Cole - Gizmo [NCS Release]
Music provided by NoCopyrightSounds.
Watch:    • Syn Cole - Gizmo | House | NCS - Copy...  
Free Download / Stream: http://ncs.io/Gizmo

Track: NIVIRO ft. PollyAnna - Fast Lane [NCS Release]
Music provided by NoCopyrightSounds.
Watch:    • NIVIRO ft. PollyAnna - Fast Lane | Ho...  
Free Download / Stream: http://ncs.io/FastLaneYO