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

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

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

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

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

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

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

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

같은 카테고리의 다른 글
크롬 / 포커스 모드로 주소표시줄, 즐겨찾기 안 보이게 하는 방법

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

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

당구 / 시스템 / 코너각

당구 / 시스템 / 코너각

여러 가지 상황에 대한 코너각을 정리한다. 코너각을 알면 약간의 변형으로 코너 근처에 있는 적구를 맞출 수 있다. 파이브 앤 하프 시스템 코너각 파이브 앤 하프 시스템에서 50에서 30을 향해 치면 3 쿠션 20을 거쳐 코너로 들어가기 때문에, 코너를 20으로 센다. 하지만 출발 지점에 따라 3 쿠션 20에 들어가는 각도가 다르므로 보정이 필요하다. 개인차가 있겠으나 ...

DNS / DMARC 레코드의 용도와 설정하는 방법

DNS / DMARC 레코드의 용도와 설정하는 방법

DMARC란? DMARC는 Domain-based Message Authentication Reporting and Conformance의 약자이다. DNS 레코드를 이용하여 메일이 해당 도메인에서 정상적으로 발송되었음을 증명하는 방법에는 SPF, DKIM이 있다. SPF와 DKIM 테스트를 통과하지 못한 메일에 대해서 어떻게 처리했으면 하는지를 DMARC 레코드로 수신 메일 서버에 알려준다. DMARC 레코드에 대한 자세한 내용은 RFC 7489 문서에 있다. DMARC 레코드 설정하는 방법 DMARC 레코드는 TXT 레코드로, 호스트는 ...

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

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

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

Ubuntu 18.04 / 빠르게 다운로드하는 방법

우분투 다운로드 우분투 다운로드는 보통 우분투 홈페이지에서 합니다. 상단의 Downloads 메뉴를 클릭하고 안내를 따라가면 됩니다. 그런데, 우분투 홈페이지를 통해 다운로드를 받으면 전송 속도가 느릴 수 있습니다. 만약 너무 느리다면 가까운 미러 사이트에 직접 접속하여 다운로드해보세요. 빠르게 다운로드를 할 수 있습니다. 카카오 서버 한국이라면 카카오 서버가 빠릅니다. 우분투 페이지로 간 다음 원하는 버전을 선택합니다. 데스크톱 이미지와 ...

Rocky Linux 9 / hostname 변경하는 방법

Rocky Linux 9 / hostname 변경하는 방법

CLI 다음과 같이 명령하면 hostname을 출력한다. hostname 다음과 같이 명령하면 hostname을 rocky로 변경한다. hostnamectl set-hostname rocky GUI 의 Device Name에서 변경한다.

MariaDB / 데이터베이스 이름에 하이픈(-) 또는 점(.) 포함하는 방법

MariaDB / 데이터베이스 이름에 하이픈(-) 또는 점(.) 포함하는 방법

MariaDB에 하이픈(-)이나 점(.)을 포함한 이름으로 데이터베이스를 만들면 에러가 납니다. 예를 들어 create database test-test; 라고 하면 다음과 같은 에러 메시지를 출력하면서 데이터베이스를 생성하지 못합니다. ERROR 1064 (42000): You have an error in your SQL syntax; check the manual that corresponds to your MariaDB server version for the right syntax to use near '-test' at ...

LaTeX / 윈도우에 TeX Live 설치하는 방법

LaTeX / 윈도우에 TeX Live 설치하는 방법

TeX Live를 윈도우에 설치하고, 제대로 설치되었는지 확인하는 방법입니다. TeX Live 설치 TeX Live 사이트에서 여러 버전의 설치 파일을 구할 수 있습니다. 윈도우에 설치하기 위한 파일이 필요하다면 download를 클릭합니다. install-tl.zip을 클릭하여 다운로드하고, 압축을 풉니다. install-tl-windows를 실행합니다. 다음과 같은 화면이 잠시 나왔다가 사라지는데, 미러 사이트가 국내에 있는 것인지 확인합니다. 국내에 위치한 미러가 아니라면 를 클릭하여 미러를 ...

Rocky Linux 9 / 설치

Rocky Linux 9 / 설치

다운로드 아래 링크에서 ISO 파일을 다운로드한다. https://rockylinux.org/download Boot, Minimal, DVD 세 가지가 있는데, 다음과 같이 설명되어 있다. Boot Used to install the operating system from another source (such as a HTTP repository of the binary files). Can also be used to enter Rescue Mode. Minimal Used to install the operating system from another source (such as a ...

당구 / 길 / 앞돌려 치기

당구 / 길 / 앞돌려 치기

앞돌려치기 1적구를 맞추고 단장으로 돌아서 2적구를 맞추는 것을 앞돌려 치기라고 한다. 아래처럼 단장단으로 치는 것을 길게 친다고 하고... 단장단으로 치는 것을 짧게 친다고 한다. 플러스 시스템을 이용한 앞돌려치기 다음은 플러스 시스템을 이용한 앞돌려치기의 예이다. 수구의 움직임이 시스템의 흐름과 같아서 많이 사용한다. 로드리게스 시스템을 이용한 앞돌려치기 다음은 로드리게스 시스템을 이용한 앞돌려치기의 예이다. 1적구와 2적구가 장쿠션에 붙어있다고 가정하고 두 공 ...