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

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

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

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

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

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

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

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

같은 카테고리의 다른 글

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

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

PointerFocus / 마우스 포인터 강조 프로그램

PointerFocus / 마우스 포인터 강조 프로그램

PointerFocus 컴퓨터 화면을 이용해서 강의를 하거나 컴퓨터 화면을 녹화할 때, 마우스 포인터가 잘 보이지 않아서 불편할 수 있습니다. 또한 4K 모니터를 사용하면 마우스 포인터가 아주 작게 보여서 찾기 힘들 때도 있구요. 이때 유용한 프로그램이 PointerFocus입니다. PointerFocus는 마우스 포인터에 도형을 입혀서 눈에 잘 띄게 하고, 클릭했을 때 애니메이션 효과를 주어 클릭했음을 알 수 ...

Notepad++ / 플러그인 매니저, NppFTP 설치하기

Notepad++ / 플러그인 매니저, NppFTP 설치하기

Notepad++ 텍스트 에디터를 선택할 때 중요하게 생각하는 게 FTP, SFTP 접속 기능입니다. 원격 작업을 많이 하기 때문입니다. FTP 접속을 지원하는 대표적인 무료 텍스트 에디터는 Notepad++입니다. NppFTP라는 플러그인을 설치하면 서버에 있는 파일을 바로 열어서 편집할 수 있습니다. 플러그인 매니저로 NppFTP를 설치하고, 서버에 접속하는 방법을 알아보겠습니다. PluginManager PluginManager는 플러그인을 쉽게 설치하고 업그레이드하게 해주는 플러그인입니다. GitHub에서 ...

버추얼박스 / 가상 머신 내보내기, 가져오기

버추얼박스 / 가상 머신 내보내기, 가져오기

버추얼박스의 가상 머신을 백업하고 복원하는 방법 중의 하나는 내보내기와 가져오기를 이용하는 것입니다. 내가 만든 가상 머신을 남에게 전달할 때도 유용한 방법입니다. 내보내기는 가상 머신의 모든 구성 요소를 하나의 파일로 만드는 것이라 파일의 크기가 상당히 큰데, SSD라면 꽤 빠른 시간에 끝납니다. 가져오기도 마찬가지입니다. 내보내기 왼쪽 위의 을 클릭합니다. 를 클릭합니다. 단축키는 Ctrl+E입니다. 내보낼 가상 ...

엣지 / Internet Explorer 모드 사용하는 방법

엣지 / Internet Explorer 모드 사용하는 방법

Windows 11에는 인터넷 익스플로러(Internet Explorer)가 아예 없다. 오로지 마이크로소프트 엣지(Microsoft Edge)만 있다. 대부분의 사이트가 엣지에서 잘 돌아가기에 별 문제가 없지만, 아직도 IE로만 접속해야 하는 곳이 있다. 그런 곳에 엣지로 접속하면 모양이 이상하게 나오거나 기능이 작동하지 않는다. IE로 접속해야 하는데 IE가 없는 상황, 어떻게 하면 될까? Microsoft Edge의 Internet Explorer 모드 사용하면 ...

팟플레이어 / 설치하는 방법

팟플레이어 / 설치하는 방법

윈도우에 포함된 기본 프록그램으로 많은 걸 할 수 있는데, 동영상 재생은 그렇지 못하다. 코덱이 없어서 재생을 못하는 경우가 많다. 자막을 불러오는 것도 불편하고... 그래서 동영샹 플레이어를 설치하게 되는데, 개인적으로 즐겨 사용하는 건 팟플레이어이다. 무료이고, 설치가 깔끔하고, 저사양 컴퓨터에서도 잘 작동한다. 설치하는 과정을 스크린샷으로 찍어봤는데, 어려운 것은 없다. 추가 코덱 설치하는 것만 빼먹지 ...

Bitvise SSH Client / 사용법

Bitvise SSH Client / 사용법

다운로드 및 설치 아래 링크에 접속하여 Bitvise SSH Client Installer를 다운로드하고 설치한다. https://www.bitvise.com/ssh-client-download SSH로 서버에 접속하기 Bitvise SSH Client를 실행한다. 접속에 필요한 정보를 입력하고 을 클릭한다. 적절한 방식으로 Accept하면 접속이 완료된다. 을 클릭하면... 콘솔 창이 생기면서 필요한 작업을 할 수 있다. 모든 작업을 마치면 을 클릭한다. 프로파일 저장하기 Bitvise SSH Client는 PuTTY와는 달리 접속 정보를 파일로 저장할 ...

OBS Studio / 윈도우 캡쳐 / 크롬 웹브라우저 검정으로 나오는 문제 해결하는 방법

OBS Studio / 윈도우 캡쳐 / 크롬 웹브라우저 검정으로 나오는 문제 해결하는 방법

윈도우 캡쳐 OBS Studio로 특정 윈도우를 선택하여 캡쳐할 수 있습니다. 방법은... 윈도우 캡쳐를 추가하고... 적당히 이름을 정한 후 을 클릭하고... 윈도우 목록에서 원하는 창을 선택하면 되는데... 크롬 웹브라우저가 검정으로 나온다면 크롬을 선택했을 때 검정으로 나오는 경우가 있습니다. 해결하는 방법은 크롬의 설정을 변경하는 것입니다. 크롬 설정을 열고... 을 클릭한 다음... 을 해제하면... 해결됩니다.

mRemoteNG / 사용법

mRemoteNG / 사용법

개요 Multi-Remote Next Generation Connection Manager 원격 연결 정보를 저장하고, 여러 탭으로 동시에 원격 접속을 가능하게 하는 프로그램 다음 프로토콜을 지원한다. RDP, VNC, SSH, Telnet, HTTP/HTTPS, rlogin, Raw Socket Connections, Powershell remoting 설치 다운로드 : https://mremoteng.org/download MSI를 다운로드하고 설치하여 사용하거나, ZIP을 다운로드하고 포터블로 사용한다. 연결 연결 만들고 연결하기 연결은 폴더로 정리할 수 있다. 제일 위에 있는 을 선택하거나 폴더를 선택한 후, ...

Sizer 4 / 윈도우 창 크기와 위치를 설정하는 프로그램

Sizer 4 / 윈도우 창 크기와 위치를 설정하는 프로그램

윈도우에서 창은 마우스로 드래그하여 크기를 변경할 수 있습니다. 보통의 상황에서는 대충 원하는 크기로 만듭니다. 하지만, 윈도우 창 크기를 정확하게 만들어야 할 때가 있습니다. 캡처를 할 때 일정한 크기를 유지하고 싶을 수도 있고, 큰 모니터를 사용할 때 여러 창들을 정돈하고 싶을 수도 있고... 만약 창 크기를 픽셀 단위로 정확히 만들고, 원하는 위치에 ...