Brackets / Emmet 확장 기능 설치하는 방법

Emmet

  • Emmet는 HTML과 CSS 코딩을 빠르게 할 수 있도록 도와주는 플러그인입니다. 많은 텍스트 에디터에서 Emmet을 지원하고 있고, Brackets도 확장 기능을 통해 사용할 수 있습니다.
  • Emmet의 예전 이름은 Zen Coding입니다.

Brackets에 Emmet 확장 기능 설치

  • [확장 기능 관리자]를 엽니다.

  • Emmet로 검색한 후 설치합니다.

테스트

  • HTML 형식의 문서를 새로 만듭니다.
  • html>head+body를 입력하고 Tab 키를 누릅니다.

  • 다음과 같이 바뀌면 제대로 설치된 것입니다.

참고

같은 카테고리의 다른 글
Brackets / HTML, CSS 실시간 미리보기 사용하는 방법

Brackets / HTML, CSS 실시간 미리보기 사용하는 방법

Brackets의 장점 중의 하나는 실시간 미리보기입니다. HTML, CSS 등을 만들 때 유용합니다. 만약 실시간 미리보기가 안되는 상황이라면, 문서를 편집하고 저장하고 웹브라우저에서 새로 고침을 해야 하는데, Brackets의 실시간 미리보기를 이용하면 입력 또는 저장만 해도 바로 웹브라우저에 반영됩니다. 실시간 미리보기를 하려면 오른쪽에 있는 번개(?) 모양 아이콘을 클릭합니다. 실시간 미리보기를 처음 실행하는 거라면 다음과 같은 메시지가 ...

엣지 / 다운로드 하는 방법

엣지 / 다운로드 하는 방법

Windows 11, Windows 10 최신 설치 이미지, Windows Server 2022애는 마이크로소트 엣지가 포함되어 있다. 엣지가 기본 설치되지 않는 Windows에서는 엣지를 다운로드하고 설치하여 사용할 수 있다. 다운로드 주소 : https://www.microsoft.com/ko-kr/edge/download 다운로드 버튼을 클릭하고... 를 클릭하면 설치 파일이 다운로드된다. 다른 버전의 Windows용 설치 파일은 다운로드 버튼을 확장하여 다운로드할 수 있다.

크롬 / 맞춤법 검사 해제하는 방법

크롬 / 맞춤법 검사 해제하는 방법

크롬 웹브라우저에는 맞춤법 검사 기능이 있습니다. 폼에 텍스트를 입력하면 맞춤법 검사를 하고, 맞춤법에 맞지 않으면 빨간 밑줄을 칩니다. 유용한 기능이기는 하지만, 굳지 필요하지 않을 수도 있습니다. 글 주제에 따라 빨간 줄이 너무 많이 나올 수도 있기 때문입니다. 맞춤법 검사는 크롬 설정에서 해제할 수 있습니다. 오른쪽 위의 점 세 개 아이콘을 클릭한 후 ...

PhotoScape X / 설치하는 방법

포토스케이스(PhotoScape)는 유용한 이미지 편집 보정 프로그램입니다. 많은 기능을 갖추고도 무료로 사용할 수 있어 인기가 많습니다. 개인적으로 사진 크기 일괄 변경과 콜라쥬 기능을 자주 사용합니다. 윈도우 10에 설치하여 사용할 수 있는 포토스케이는 두 가지가 있습니다. 하나는 포토스케이프 홈페이지에서 배포하는 것을 사용하는 것입니다. 다운로드하고 설치하고 사용하면 됩니다. 또 하나는 마이크로소프트 스토어에서 설치하는 것입니다. photoscape로 ...

DBeaver / 오픈 소스 데이터베이스 관리 도구

DBeaver / 오픈 소스 데이터베이스 관리 도구

DBeaver는 오픈 소스 데이터베이스 관리 도구로, 다양한 데이터베이스 시스템을 지원하는 강력한 소프트웨어이다. 이 도구는 데이터베이스 개발자와 관리자에게 데이터베이스의 구조를 탐색하고 관리하며 쿼리를 작성하고 실행할 수 있는 편리한 인터페이스를 제공한다. 주요 기능 광범위한 데이터베이스 지원 DBeaver는 MySQL, MariaDB, PostgreSQL, Oracle, DB2, SQL Server, SQLite, Sybase, Teradata, Firebird, Apache Hive, Phoenix, Presto, MongoDB, Cassandra, Redis ...

버추얼박스 / Cannot register the DVD image 에러 해결하는 방법

버추얼박스 / Cannot register the DVD image 에러 해결하는 방법

버추얼박스에 윈도우 10을 OS로 하는 가상 머신을 만들었습니다. 그런데, 다른 위치로 옮기거나, 다른 계정으로 로그인했을 때 다음과 같은 에러가 났습니다. Cannot register the DVD image 'C:\Program Files\Oracle\VirtualBox\VBoxGuestAdditions.iso' {8e3e5db2-0f2f-4b3a-b162-939c80e2689d} because a CD/DVD image 'C:\Program Files\Oracle\VirtualBox\VBoxGuestAdditions.iso' with UUID {a541c58e-3b90-4b21-a168-226e0e510a17} already exists. 항상 발생하는 문제는 아니고, 특정 가상 머신에서만 발생했습니다. 이를 해결하는 방법은, 해당 가상 머신의 ...

Brackets / 테마 설치하고 변경하는 방법

Brackets / 테마 설치하고 변경하는 방법

Brackets에서 배경, 글자색 등 모양과 관련된 것들의 집합을 테마(theme)라고 합니다. 브라켓을 설치하면 기본적으로 두 개의 테마가 있는데, 다른 테마를 추가하고 사용할 수 있습니다. 테마 설치하는 방법 오른쪽에 있는 아이콘을 클릭해서 를 엽니다. 분류에서 테마(Themes)를 클릭하면 테마만 목록에 나옵니다. 추가 정보(More info)를 클릭하면 데모를 볼 수 있습니다. 원하는 테마가 있다면 설치(Install)을 클릭합니다. 설치가 완료되면 ...

크롬 / 즐겨찾기 내보내기, 즐겨찾기 가져오기

크롬 / 즐겨찾기 내보내기, 즐겨찾기 가져오기

크롬에는 동기화 기능이 있습니다. 구글 계정으로 로그인하고 동기화 허용 설정을 하면, 클라우드에 즐겨찾기 등이 저장되고, 다른 기기에서 크롬에 로그인하면 그 정보들을 가져옵니다. 유용한 기능이기는 하나, 비밀번호 등 중요한 정보도 같이 동기화되므로 주의해서 사용해야 합니다. 만약 동기화 기능을 사용하지 않고 즐겨찾기를 백업하고 복원해야 한다면, 다음과 같은 방법으로 하면 됩니다. 크롬에서 내보낸 북마크는, 마이크로소프트 ...

레드 햇(Red Hat) 평가판 다운로드하고 설치하는 방법

레드 햇(Red Hat) 평가판 다운로드하고 설치하는 방법

Red Hat은 유료 프로그램이다. 설치는 가능하나 업데이트나 패키지를 설치할 수 없다. 그러나 평가판이 있으므로 체험이 가능하다. 기간은 60일로 그리 짧지도 않고 길지도 않다. 귀찮은 점은 회원 가입을 해야 한다는 것이고, 60일 사용 후에 다시 체험판을 사용하고 싶다면 90일을 기다려야 한다는 것이다. 하지만 회원 가입 시 본인 인증 절차 같은 건 ...

크롬 / 포커스 모드로 주소표시줄, 즐겨찾기 안 보이게 하는 방법

크롬 / 포커스 모드로 주소표시줄, 즐겨찾기 안 보이게 하는 방법

크롬 포커스 모드는 더 이상 지원되지 않습니다. 대신 바로 가기 만들기를 이용하여 주소창을 없앨 수 있습니다. 크롬 상단에 나오는 즐겨찾기는 Ctrl+Shift+B로 안 보이게 할 수 있습니다. 다시 한 번 Ctrl+Shift+B를 누르면 다시 보이죠. 만약 주소표시줄을 없애고 싶다면 어떻게 할까요? 모든 크롬 창의 주소표시줄을 안 보이게 할 수는 없지만, Focus Mode를 이용하면 특정 탭에서는 ...