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

Brackets의 장점 중의 하나는 실시간 미리보기입니다. HTML, CSS 등을 만들 때 유용합니다. 만약 실시간 미리보기가 안되는 상황이라면, 문서를 편집하고 저장하고 웹브라우저에서 새로 고침을 해야 하는데, Brackets의 실시간 미리보기를 이용하면 입력 또는 저장만 해도 바로 웹브라우저에 반영됩니다.

실시간 미리보기를 하려면 오른쪽에 있는 번개(?) 모양 아이콘을 클릭합니다.

실시간 미리보기를 처음 실행하는 거라면 다음과 같은 메시지가 나옵니다.(다음 실행할 때는 나오지 않습니다.)

[확인]을 클릭하면...

현재 문서가 웹브라우저에서 열립니다.

이제 문서를 수정하거나 수정 후 저장하면 웹브라우저에 바로 반영됩니다. 웹브라우저를 새로 고침할 필요가 없습니다.

실시간 미리보기를 그만하려면 번개 모양 아이콘을 다시 한 번 클릭하면 됩니다.

같은 카테고리의 다른 글
OBS Studio / 디스플레이 캡쳐 / 검은 화면 나오는 문제 해결하는 방법

OBS Studio / 디스플레이 캡쳐 / 검은 화면 나오는 문제 해결하는 방법

OBS Studio는 컴퓨터 화면 녹화, 웹캠 녹화, 게임 녹화 등을 할 수 있는 오픈소스 프로그램입니다. 녹화뿐만 아니라 실시간 방송도 가능하고, 여러 소스를 동시에 화면에 띄워 녹화 및 방송을 할 수도 있는 유용한 프로그램입니다. 이런 프로그램이 오픈소스라는 것이 고마울 뿐입니다. 컴퓨터 화면 녹화를 하기 위해 OBS Studio를 설치했는데, 문제가 발생했습니다. 디스플레이 캡쳐를 ...

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

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

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

픽픽 / 컴퓨터 화면을 동영상으로 녹화하는 방법

픽픽 / 컴퓨터 화면을 동영상으로 녹화하는 방법

픽픽은 컴퓨터 화면 캡처 프로그램이다. 그런데, 최근에 업데이트되면서 화면 녹화 기능이 추가되었다. 화면 녹화를 위해서 별도의 프로그램을 사용했어야 했는데, 이제는 픽픽에서 다 해결할 수 있다. 를 클릭하면 녹화 모드로 들어간다. 를 클릭하면 녹화가 시작되고, 다시 클릭하면 녹화가 중지된다. 녹화 방식에는 영역 지정 녹화와 전체 화면 녹화가 있다. 영역 지정 녹화는 사각형 ...

버추얼박스 / 가상 하드 디스크 만드는 방법, 삭제하는 방법

버추얼박스 / 가상 하드 디스크 만드는 방법, 삭제하는 방법

가상 하드 디스크 만들기 버추얼박스의 가상 디스크는 가상 머신을 생성할 때 만들 수 있는데, 가상 머신을 만들 때마다 디스크를 만드는 게 번거로울 수 있다. 디스크를 가지고 이런 저런 작업을 많이 한다면, 미리 만들어 둔 다음 필요할 때 연결해서 사용할 수 있다. 가상 디스크를 만드는 경로는 여러 가지가 있는데, 가장 쉽게 접근할 수 ...

위키(Wiki) / 위키 만드는 소프트웨어 / 종류

위키를 만드는 소프트웨어는 다양한 기능과 용도에 맞춰 여러 종류가 있습니다. 아래는 가장 널리 사용되는 위키 소프트웨어와 그 특징을 설명드리겠습니다. 미디어위키 (MediaWiki) 미디어위키는 위키백과에서 사용하는 오픈 소스 위키 소프트웨어입니다. 매우 강력하고 유연하며, 큰 규모의 위키 사이트를 운영하는 데 적합합니다. 특징 다양한 확장 기능과 템플릿을 지원. 대규모 커뮤니티와 활발한 개발. PHP 기반으로, MySQL 및 MariaDB 데이터베이스를 사용. 사용자 관리 ...

크롬 / 사이트 알림 차단 하는 방법

크롬 / 사이트 알림 차단 하는 방법

구글 크롬에는 알림 기능이 있습니다. 알림 받는 게 싫어서 왠만하면 차단을 하는데, 실수로 차단을 안 한 경우도 있습니다. 그럴 땐 수동으로 알림을 차단할 수 있습니다. PC의 크롬과 안드로이드의 크롬으로 나누어서 어떻게 차단하는지 알아보겠습니다. PC용 크롬 점 세 개 아이콘을 클릭하고, 설정을 엽니다. 밑으로 내려가서 고급을 클릭합니다. 콘텐츠 설정을 클릭합니다. 알림을 클릭합니다. 알림을 차단한 목록과 허용한 목록을 ...

버추얼박스 / 공유 폴더 만드는 방법

버추얼박스 / 공유 폴더 만드는 방법

버추얼박스에서 호스트와 게스트 간 파일을 주고 받는 방법 중 가장 쉬운 것은 드래그 앤 드롭을 이용하는 것입니다. 그런데 단점이 있습니다. 게스트에서 수정한 파일을 호스트에서 사용하려면 또 옮겨야 하고, 호스트에서 수정한 파일을 게스트에서 사용하려면 또 옮겨야 합니다. 호스트와 게스트가 동시에 사용하면서 수정이 잦다면, 드래그 앤 드롭보다 공유 폴더를 이용하는 것이 더 ...

줌(Zoom) / 회의 만드는 방법, 초대하는 방법, 참가하는 방법

줌(Zoom) / 회의 만드는 방법, 초대하는 방법, 참가하는 방법

회의 만들기 회의를 만드는 방법은 으로 만든다. 새 회의로 즉시 미팅 만들기 작업하는 과정에서 Zoom 앱이 필요한 경우 다운로드하고 설치하도록 유도한다. 만약 그 과정을 놓쳤다면 https://us05web.zoom.us/download에서 다운로드하고 설치한다. Zoom을 실행하고 을 클릭한다. 계정 정보를 입력하고 을 클릭한다. 를 클리하면 바로 회의가 ...

PuTTY / 사용법 / 백업하는 방법, 복원하는 방법

PuTTY / 사용법 / 백업하는 방법, 복원하는 방법

PuTTY를 사용할 때 여러 접속 정보를 저장하여 사용합니다. 그런데 그 접속 정보를 내보내고 가져오는 기능은 없습니다. 만약 컴퓨터 포맷, 다른 컴퓨터에서 사용 등의 이유로 접속 정보를 백업하고 복원하고 싶다면, 레지스트리를 이용합니다. 그 정보들을 레지스트리에 저장하기 때문입니다. 백업 WIN+R을 눌러 실행 창을 엽니다. regedit을 입력하고 을 클릭합니다. 왼쪽을 확장하면서 \HKEY_CURRENT_USER\SOFTWARE\SimonTatham로 찾아 들어갑니다. 마우스 우클릭 후 를 ...

VisiPics / 중복 사진 정리 프로그램

VisiPics / 중복 사진 정리 프로그램

중복 사진 정리 프로그램 VisiPics 필름으로 사진을 찍을 때는 한 장 한 장 정성스럽게 찍었던 거 같습니다. 필름 한 통으로 찍을 수 있는 양이 정해져 있었고, 눈으로 볼 수 있게 현상하는 것도 돈이 들었으니까요. 하지만, 지금은 사진을 파일로 저정하고, 현상하지 않아도 PC 등에서 사진을 볼 수 있으므로, 사진을 많이 찍게 됩니다. 여러 ...