Categories: 웹 프로그래밍

아톰(atom) 웹개발 에디터 다운로드와 플러그인 패키지 emmet 설치방법

저는 요즘 html과 css 공부를 하고 있는 중인데요. html문서는 윈도우에 기본 포함되어 있는 메모장으로도 만들 수 있습니다. 그러나 태그를 열고 닫는데 있어서 빠드리는것들도 있고 반복적으로 써야하는 내용들도 많이 있어서 내가 태그를 열면 프로그램이 알아서 닫아주면 좋겠다라는 생각을 많이 합니다. 그런데 좋은 웹개발도구 프로그램들은 그런 기능들을 지원하고 있었네요.
제가 설치한 웹개발 에디터는 아톰(atom)입니다. 무료프로그램이니 누구나 다 사용하실 수 있는데요. 아톰 홈페이지(atom.io)에 접속 후 화면에 보이는 Download Windows 64-bit Installer 버튼을 클릭하면 실행파일을 다운받을 수 있습니다. 다 받으면 설치를 시작하면 되죠.

아톰 패키지 플러그인 에밋(emmet) 설치하는 방법

에밋을 설치하면 내가 html만 입력하고 엔터를 쳐도 태그를 열고 닫는 것까지 자동으로 해줍니다. 그외 여러 태그들도 마찬가지고요. 그래서 저도 에밋을 설치했는데 그 방법을 모르는 분들이 많은 것 같아서 적어보려고 합니다.

  1. 아톰(atom) 실행
  2. file-settings 선택(맥MAC에서는 Preference)
  3. 왼쪽 메뉴에서 Install 선택
  4. Package 검색하는 곳에서 emmet 검색
  5. 검색 후 나오는 목록에서 Install 클릭

에밋 사용방법은 간단합니다. 더 많은 기능도 있겠지만 태그이름을 입력하고 엔터를 쳐보시면 됩니다. 혹시나 html을 쓰고 엔터를 쳤는데 아무 변화가 없다면 아톰을 껏다가 재실행해보시면 될 것입니다.

DDable

Share
Published by
DDable

Recent Posts

우울증 극복을 위해 노력하는 사람

나도 혹시 나중에 우울증 걸리면 이 영상 보며 극복해야지 그냥 청소하는 영상이지만 중간중간 웃기도하고 눈물도…

1개월 ago

아이폰16프로 액정강화필름이랑 케이스 만족

난 5년전부터 링케 케이스만 사용하고 있는데 그 중에서 오닉스만 사용하고 있어. 왜 오닉스인지는 모르겠지만 그립감이…

2개월 ago

로보폼(roboform)에서 비트워든(bitwarden)으로 갈아탐

5년이상 로보폼을 사용하고 있었음. 과거엔 결제해서 사용하다가 요근래 1년정도는 결제하지 않고 휴대폰에만 저장해서 사용하고 있었지.…

2개월 ago

로지텍 리프트 버티컬마우스 사용해본 후기와 mx마스터3s와 비교

로지텍 버티컬마우스를 샀다. 리프트라는 제품인데 아시아인의 손에 맞춰 좀 작게 나온 것이라고 한다. 전체적으로는 만족스럽다.(가격빼고)…

2개월 ago

제주 4.3 사건 관련된 내용들 김대중 cnn 인터뷰등

https://www.newdaily.co.kr/site/data/html/2014/04/04/2014040400090.html 김대중은 1998년 11월 23일 CNN과의 인터뷰에서 제주 4.3사건에 대해 이렇게 이야기하였다. "공산당의 폭동으로 일어났지만…

2개월 ago

문다혜 부동산 의혹

2018년4월 구기동 빌라 매입 3.5억원 (남편 서모씨가 문다혜에게 증여) https://www.greened.kr/news/articleView.html?idxno=88941 2018년7월 구기동 빌라 매도 5.1억원…

2개월 ago