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

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

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

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

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

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

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

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

같은 카테고리의 다른 글

포토샵(Photoshop) 대체 프로그램 7가지

Photoshop은 강력한 이미지 편집 도구이지만, 고가의 가격과 높은 시스템 요구사항으로 인해 많은 사용자가 대체 프로그램을 찾고 있다. 다음은 다양한 기능을 제공하면서도 무료 또는 저렴한 가격으로 이용할 수 있는 Photoshop 대체 프로그램이다. 1. GIMP (GNU Image Manipulation Program) 특징 : 무료 오픈 소스 소프트웨어로, Photoshop과 유사한 기능을 제공한다. 레이어, 필터, 브러시 및 다양한 ...

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

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

가상 머신 만들기 가상 머신에 사용할 OS의 ISO 이미지를 준비합니다. 버추얼박스에서 를 클릭합니다. 이름을 적절히 정하고 OS의 종류와 버전을 선택합니다. 을 클릭합니다. 가상 머신에 할당할 메모리 크기를 정하고 을 클릭합니다. 를 클릭합니다. 을 클릭합니다. 동적 할당은 가상 하드 디스크를 사용하는 만큼 호스트 PC의 하드 디스크를 사용합니다. 고정 크기는 그 크기 만큼 미리 공간을 확보해 놓습니다. 적절히 설정하고 을 ...

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

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

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

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

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

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

크롬 / 홈 버튼 설정 및 활용 방법

크롬 / 홈 버튼 설정 및 활용 방법

크롬(Chrome) 브라우저의 홈 버튼(Home button)은 사용자가 설정한 홈 페이지로 빠르게 이동할 수 있게 해주는 기능입니다. 기본적으로 크롬 브라우저에는 홈 버튼이 표시되지 않지만, 설정을 통해 활성화할 수 있습니다. 홈 버튼을 설정하고 사용하는 방법은 다음과 같습니다. 홈 버튼 활성화 방법 크롬 설정 페이지 열기 크롬 브라우저를 열고 오른쪽 상단의 세 개의 점(메뉴 버튼)을 클릭합니다. 을 선택합니다. 홈 ...

OBS Studio / 컴퓨터 화면 녹화하는 방법

OBS Studio / 컴퓨터 화면 녹화하는 방법

OBS Studio로 컴퓨터 화면을 녹화해보겠습니다. 이를 OBS Studio에서는 디스플레이 캡쳐라고 합니다. + 버튼을 클릭하고 를 클릭합니다. 이름을 적당히 정한 후 을 클릭합니다. 미리보기가 나옵니다. 만약 NVIDIA 그래픽카드를 사용하면서 화면이 검정색으로 나온다면 여기의 안내를 따라 해결하세요. 을 클릭합니다. 이제 을 누르면 해당 화면이 녹화됩니다. 을 클릭하면 녹화를 마칩니다. 기본 저장 폴더는 동영상(Videos)입니다. 녹화 관련 설정을 변경하고 ...

WinSCP / 사용법 - 설치, 접속, 다운로드, 업로드

WinSCP / 사용법 - 설치, 접속, 다운로드, 업로드

WinSCP는 윈도우에서 사용할 수 있는 FTP 클라이언트 프로그램입니다. FTP, FTPS, SCP, SFTP 등 여러 프로토콜을 지원하는 무료 소프트웨어입니다. WinSCP is a popular SFTP client and FTP client for Microsoft Windows! Copy file between a local computer and remote servers using FTP, FTPS, SCP, SFTP, WebDAV or S3 file transfer protocols. 다운로드 다운로드는 여기에서 ...

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

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

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

OBS Studio / 설치하는 방법

OBS Studio / 설치하는 방법

OBS Studio는 영상 녹화 또는 방송을 할 수 있게 해주는 오픈소스 프로그램입니다. 주요 영상 플랫폼을 지원하고, 고화질의 녹화가 가능합니다. OBS Studio를 설치하고 기본 설정하는 방법을 알아보겠습니다. 다운로드 https://obsproject.com/ko에서 다운로드합니다. 윈도우, 맥, 리눅스를 지원합니다. 자신의 환경에 맞는 걸 다운로드하세요. 여기서는 윈도우용을 다운로드하겠습니다. 설치 다운로드한 파일을 실행하면 설치가 시작됩니다. 를 클릭합니다. 라이선스에 동의하면 를 클릭합니다. 클릭하지 않으면 진행되지 ...

Brackets / 탭 사이즈 변경하는 방법

Brackets / 탭 사이즈 변경하는 방법

브라켓의 기본 탭 사이즈는 4입니다. 탭 사이즈 변경은 편집기의 오른쪽 아래에서 합니다. 글자를 클릭해서 Tab Size로 만듭니다. 숫자를 클릭하고 원하는 크기를 입력합니다.