🏎️

버블 단축키로 작업 시간 줄이기

중요 공지

“버블박스”가 “노코더스”라는 이름으로 변경됐어요

현재 사이트는 더 이상 운영하지 않으니 노코더스 사이트로 이동해주세요

노코더스 ㅣ 노코드 툴, 버블 시작하기

개발 없이 나만의 서비스를 만드는 방법! 노코드 툴, 버블을 노코더스에서 차근차근 시작하세요.

https://nocoders.kr/

1. 버블 단축키로 빌드 시간을 줄이세요!

2. 단축키 모음

1. 버블 단축키로 빌드 시간을 줄이세요!

버블은 높은 자유도를 제공하는 만큼, 앱을 만드는 데 시간이 오래 걸립니다. 디자인, 워크플로우 등을 하나하나 작업하고, 프리뷰 모드에서 매번 체크도 해야 합니다. 이때, 버블 단축키를 알아두면 시간을 크게 단축 시킬 수 있습니다. 예를 들어, 아래 같은 단축키 활용이 있습니다.

•

작업한 워크플로우를 데브 앱에서 체크해야 할 때, 에디터 우측 상단의 [Preview] 버튼을 클릭하지 않고 단축키로 바로 데브 앱을 실행할 수 있습니다. 

•

매번 디자인 탭, 워크플로우 탭을 클릭할 필요 없이 단축키로 전환할 수 있습니다.

•

그룹 요소에 있는 하위 요소를 클릭할 수 있습니다.

•

선택한 요소들을 하나의 그룹 요소로 만들 수 있습니다.

2. 단축키 모음

아래 표에서 단축키를 확인할 수 있습니다. 개인적으로 알아두면 좋은 단축키는 ️를 표시했습니다. 또한 기능 연관성이 있는 것끼리 카테고리로 묶어서 정리했습니다. 확인 전에 아래 부분을 유의해주세요

•

Mac을 기준으로 작성했으며, 윈도우 유저라면 CMD 키를 Ctrl 키로 입력하면 작동이 될 겁니다. 단, 제 기기가 윈도우가 아니다보니 약간 다를 수도 있습니다.

•

버블이 아니라 브라우저의 단축키가 실행될 수 있습니다. 예를 들어 CMD + T는 (1) 버블에서 탭 전환 키지만 (2) 크롬에서는 새로운 탭이 실행됩니다. 이런 경우, Funtion키를 함께 눌러주세요

카테고리	중요도	단축키	설명
에디터 동작		CMD + P	데브 앱(a.k.a 프리뷰 모드) 실행
에디터 동작	️	CMD + T	디자인, 워크플로우, 데이터 탭 전환
선택	️️️	CMD + Click	현재 클릭 상태인 그룹 요소의 하위 요소 선택
선택		Shift+ Click	여러 요소를 선택
선택		CMD + A	현재 페이지의 모든 요소를 선택
선택	️️️	CMD + G	그룹 요소를 생성하고, 선택 상태인 요소를 하위 요소로 이동
요소 복사		CMD + Drag	클릭 상태인 요소를 드래그를 놓은 위치에 복제
요소 복사		CMD + D	클릭 상태인 요소를 복제
요소 복사		CMD + C	클릭 상태인 요소를 복사
요소 복사		CMD + X	클릭 상태인 요소를 잘라내기
요소 복사		CMD + V	복사 혹은 잘라내기한 요소를 붙여넣기
스타일 복사	️️	CMD + Shift + C	클릭 상태인 요소의 스타일(a.k.a appearance 설정)을 복사
스타일 복사	️️	CMD + Shift + V	복사한 형식을 요소에 붙여넣기
워크플로우	️️️	CMD + K	클릭 상태인 요소의 워크플로우를 확인
텍스트 요소		CMD + B	클릭 상태인 텍스트 요소를 볼드체로 변환
텍스트 요소		CMD + I	클릭 상태인 텍스트 요소를 기울임체로 변환
텍스트 요소		CMD + U	클릭 상태인 텍스트 요소에 밑줄 추가