비주얼 스튜디오 코드에서 html사용 시 불편한 점은 입력한 코드가 화면에 어떻게 구현되는지 실시간 확인이 힘들다는 점이다. 반면 아톰 에디터는 아래 영상처럼 html 코드를 입력한 뒤 바로 옆 창에서 그 코드가 실제로 어떻게 구현되는지 확인할 수 있다는 장점을 가지고 있다. 따라서 CSS 작업을 해야 할 때 효율적으로 사용 가능한 에디터 중 하나라고 생각한다 :)
무료로 사용가능한 아톰 에디터(Atom editor) 설치 방법
1. 아톰 공식홈페이지에 접속한다.
A hackable text editor for the 21st Century
At GitHub, we’re building the text editor we’ve always wanted: hackable to the core, but approachable on the first day without ever touching a config file. We can’t wait to see what you build with it.
atom.io
2. Download를 눌러 설치 파일을 다운로드한다.
- 공식 홈페이지에 접속 시 자동으로 사용하는 운영체제에 맞는 버전을 추천해준다.
아톰 에디터에서 html 미리 보기(옆에 같이 띄우기)
1. 아톰에서 html 파일을 실행한다.
- html 파일이 없다면 새로 생성한다.
- html 파일 생성 방법: ①파일 탭에서 새로운 파일(New File) > ②다른 이름으로 저장(Save As) > ③파일명. html 저장
2. 단축키 "shift + ctrl + H"을 누른다.
'IT' 카테고리의 다른 글
[excel]엑셀 If, left함수를 이용하여 특정 텍스트로 시작하는 값 추출 (0) | 2022.05.28 |
---|---|
[excel]엑셀 필터, 텍스트 나누기(글자 나누기)로 네이버 멤버쉽 혜택 계산하기 (0) | 2022.05.28 |
[Visual Studio Code]비주얼 스튜디오 코드에서 Flask 설치 및 실행하기 (0) | 2022.04.14 |
[Visual Studio Code]비주얼 스튜디오 코드에서 파이썬 설치 및 실행하기 (0) | 2022.04.10 |
[Visual Studio Code]비주얼 스튜디오 코드 설치방법 (0) | 2022.03.02 |
댓글