[ 16편 ] 버블(Bubble)로 나만의 '할 일 관리 앱' 만들기: 데이터베이스부터 워크플로우까지 ✨

2025년은 단순한 기술의 진보를 넘어, '개발'의 주체가 소수의 기술 전문가에서 누구나 될 수 있는 기술 민주화의 시대로 평가됩니다.

이 변화의 최전선에는 노코드/로우코드(LCNC)¹ 기술이 자리 잡고 있으며, 이는 거대한 기업의 비즈니스 혁신을 넘어 우리의 일상 속 개인 생산성 향상에도 혁명적인 변화를 가져오고 있습니다.

복잡한 코딩 지식 없이도 시각적인 드래그 앤 드롭 방식을 통해 자신의 아이디어를 현실로 구현할 수 있는 시대가 열린 것입니다.

이번 글에서는 개인을 위한 최고의 노코드 웹 빌더 중 하나인 버블(Bubble)²을 활용하여, 코딩 없이도 나만의 체계적인 할 일 관리 앱을 만드는 방법을 단계별로 안내하며, 그 과정에서 얻을 수 있는 심도 깊은 기술적 이해를 함께 다룹니다.

1부. 버블(Bubble) 심층 분석: 2025년의 노코드 웹 빌더 🛠️

1.1. 2025년 9월, 버블의 주요 업데이트와 글로벌 트렌드

2025년은 버블 플랫폼에 있어 중요한 변곡점입니다.

특히 주목할 만한 변화는 AI와 모바일 개발 영역에서 두드러집니다.

버블은 2025년 2월, AI 기반 앱 생성기³를 공식 출시하며, 텍스트 명령만으로 앱의 기본 구조를 자동으로 생성해 주는 기능을 도입했습니다.

이는 단순히 시각적 개발을 넘어, 생성형 개발⁴의 시대를 열었음을 의미합니다.

이제 중요한 것은 코드를 작성하는 능력이 아니라, AI에게 어떤 앱을 만들지 정확하게 질문하고, 생성된 결과물을 관리하고 다듬는 기획 및 관리 능력이 될 것입니다.

 

이러한 변화는 복잡한 기술적 장벽을 제거하고 아이디어 자체의 가치를 극대화하는 LCNC의 궁극적 목표와 맞닿아 있습니다.

또한, 버블은 2025년 6월, 네이티브 모바일 앱(iOS, Android)을 코딩 없이 빌드하고 배포할 수 있는 퍼블릭 베타 버전을 공개했습니다.

이는 버블이 기존의 웹 앱을 넘어 모바일 시장까지 범위를 확장하며, 진정한 의미의 크로스-플랫폼⁵ 노코드 툴로 진화했음을 보여줍니다.

이로써 GPS, 푸시 알림 등 모바일 기기 고유의 기능을 활용하는 서비스까지 노코드로 구현할 수 있게 되었습니다.

2025년 10월부터는 모바일 앱 배포에 유료 모바일 플랜이 필수화되며, 이는 플랫폼의 성장에 따른 자연스러운 변화로 분석됩니다

.

Bubble: AI app development meets visual, no-code editing

 

1.2. 버블의 핵심 기능과 차별점

버블은 단순히 웹사이트를 만드는 툴이 아닌, 복잡한 비즈니스 로직을 구현하는 '웹 애플리케이션' 개발 플랫폼입니다.

많은 사람이 웹플로우(Webflow)와 버블을 비교하지만, 그 목적은 명확히 다릅니다.

웹플로우가 시각적으로 아름다운 정적인 웹사이트⁶ 제작에 특화되어 있다면, 버블은 사용자 입력에 따라 콘텐츠가 실시간으로 변하는 동적인 웹 애플리케이션⁶ 제작에 강점을 가집니다.

 

버블의 가장 강력한 기능은 바로 내장된 데이터베이스⁷와 워크플로우⁸ 엔진입니다.

이는 서버 개발(백엔드)의 대부분을 시각적으로 처리할 수 있도록 지원하며, 단순한 화면을 넘어 실제 작동하는 비즈니스 로직과 데이터 처리를 구현할 수 있다는 점에서 타 노코드 툴과의 차별점을 가집니다.

또한, OpenAI, Stripe 등 외부 서비스와 API⁹ 커넥터를 통해 손쉽게 연동할 수 있으며, 방대한 플러그인 생태계는 앱의 기능을 무한히 확장할 수 있는 가능성을 제공합니다.

기능적으로 단순한 웹사이트를 넘어, 데이터베이스와 로직이 필요한 복잡한 '소프트웨어'를 만들 수 있다는 점은 버블을 진정한 '개발 플랫폼'으로 만들어주는 핵심입니다.

사용자는 Workload Unit(WU)¹⁰이라는 전력량에 비례해 비용을 지불하게 되며, 이는 실제 사용량에 따라 합리적인 비용 관리가 가능하게 합니다.

1.3. 2025년 한국 시장의 버블(Bubble) 현황 및 전망

2025년 한국 경제는 높은 청년 실업률과 가계 부채 증가라는 구조적 문제에 직면해 있습니다.

이러한 상황에서 노코드는 정체된 노동 시장을 돌파하고, 개인의 창의적 아이디어를 소자본으로 사업화할 수 있는 실용적인 대안으로 부상하고 있습니다.

특히, 논리적 사고와 문제 해결 능력을 가진 고학력 실업자가 증가하는 추세는 이들이 시민 개발자¹¹로서 LCNC 생태계에 유입될 잠재력이 크다는 것을 시사합니다.

 

한국 시장에서도 버블의 성장은 가속화되고 있습니다.

국내 노코드 커뮤니티인 '모두의 노코드'나 리트머스와 같은 공식 인증 에이전시를 통해 활발한 성장을 이어가고 있으며, 숙련된 버블 개발자를 찾는 수요가 증가하면서 '노코드 전문가'라는 새로운 직업군이 명확하게 형성되고 있습니다.

일각에서는 여전히 '노코드는 장난감'이라는 인식이 존재하지만, 해외에서는 이미 수십만 명의 사용자에게 서비스를 제공하는 성공적인 앱들이 버블로 만들어졌습니다.

100만 사용자 AI 툴인 'Formula Bot'이나, 4천만 달러의 기업 가치를 달성한 'Ohana' 등은 이러한 편견을 깨는 강력한 증거입니다.

AI for Data Analysis - Formula Bot

 

Ohana | Sublets, Short Term Rentals, and Rooms for Rent

 

특히, 월 1천만 원 이상의 유지보수 비용을 감당하던 'BetterLegal'이 버블로 전환한 사례는 노코드의 확장성과 비용 효율성에 대한 의구심을 불식시킵니다.

Set up your business with BetterLegal

 

이 사례들은 버블이 MVP(최소 기능 제품)를 넘어, 확장 가능한 비즈니스 솔루션을 제공한다는 것을 증명합니다.

 

2부. 할 일 관리 앱 구축을 위한 버블(Bubble) 핵심 개념 ⚙️

코딩을 하지 않더라도, '어떤 데이터를 만들고 어떻게 연결할지'를 미리 설계하는 것은 앱의 성능과 확장성을 결정하는 가장 중요한 요소입니다.

이는 '스파게티 코드(Spaghetti Code)'처럼 '스파게티 버블(Spaghetti Bubble)' 앱을 만들지 않는 데 필수적입니다.

다음은 할 일 앱을 만들기 위한 핵심 개념들입니다.

2.1. 데이터베이스(Database) 설계: '할 일'을 정의하다

버블의 데이터베이스는 전통적인 관계형 데이터베이스의 테이블(Table)과 컬럼(Column) 개념을 시각화한 것입니다.

데이터를 체계적으로 저장하고 관리하는 데 필요한 기본 원리입니다.

• 데이터 유형¹²:
  저장하려는 데이터의 종류(예: '할 일', '사용자')를 정의하는 컨테이너입니다.
  
  
• 필드¹³:
  데이터 유형 안에 들어가는 각 항목을 의미하며, 데이터의 구체적인 속성(예: 할 일의 '내용', '완료 여부')을 정의합니다.

우리의 할 일 관리 앱에 필요한 데이터 모델은 다음과 같습니다.

데이터 유형	필드	필드 유형	설명
To-do	Content	text	할 일의 내용을 기록합니다.
	Done?	yes/no	할 일이 완료되었는지(yes) 또는 미완료(no) 상태인지 기록합니다.
	Creator	User	이 할 일을 만든 사용자를 연결합니다. (사용자별 데이터 관리를 위해 필수)
User	Email	text	버블에 내장된 필드로, 사용자의 이메일을 저장합니다.
	Password	text	버블에 내장된 필드로, 사용자의 비밀번호를 암호화하여 저장합니다.

 

2.2. 사용자 인터페이스(UI) 설계: 화면에 할 일을 표시하다

할 일 목록을 화면에 표시하기 위해서는 반복 그룹¹⁴이라는 강력한 UI¹⁵ 요소가 필요합니다.

이는 데이터베이스에서 가져온 목록을 자동으로 순회하며 각 항목을 정해진 디자인에 맞춰 반복적으로 보여줍니다.

반복 그룹 안에 텍스트나 아이콘 같은 요소를 넣고, 이 요소들이 데이터베이스의 실제 데이터를 참조하도록 설정해야 합니다.

2.3. 워크플로우(Workflow) 설계: 앱을 동작하게 만들다

워크플로우⁸는 특정 '이벤트'(예: 버튼 클릭)가 발생했을 때, 미리 정해놓은 '액션'(예: 새로운 데이터 생성)을 순서대로 실행하는 논리적 흐름입니다.

• 할 일 추가 로직:
  '추가' 버튼 클릭 → Create a new thing¹⁶ 액션 실행 → To-do 데이터 유형에 새로운 할 일 항목 생성.
  
  
• 할 일 수정/완료 로직:
  '완료' 아이콘 클릭 → Make changes to a thing¹⁷ 액션 실행 → 해당 항목의 Done? 필드 값을 yes로 변경.

2.4. 사용자 인증(Authentication) 도입: 나만의 데이터 보호하기

버블은 모든 앱에 기본적으로 User 데이터 유형¹⁸을 제공하며, 이는 사용자 인증 및 개인별 데이터 관리를 위해 필수적입니다.

우리의 할 일 앱은 사용자별로 자신의 할 일만 볼 수 있어야 합니다.

이를 위해, 'To-do' 데이터 유형에 'Creator' 필드를 추가하고, 개인정보 보호 규칙을 설정하여 Current User¹⁹가 만든 할 일만 보이도록 제한해야 합니다.

이는 앱의 보안을 강화하는 중요한 단계입니다.

2.5. 조건문(Conditional) 활용: 동적인 UI 구현하기

조건문²⁰은 특정 조건이 충족될 때(예: '할 일이 완료되었을 때') UI¹⁵ 요소의 스타일을 동적으로 변경하는 기능입니다.

우리의 할 일 앱에서는 할 일의 Done? 필드 값이 yes일 경우, 해당 할 일 텍스트에 취소선을 긋거나 색상을 회색으로 바꾸고, 아이콘을 빈 원에서 체크마크로 변경하여 완료 상태를 시각적으로 보여줄 수 있습니다.

버블(Bubble) 개념	전통적 코딩 개념 (비유)	설명
데이터 유형¹²	데이터베이스의 테이블(Table) 또는 클래스(Class)	저장하려는 데이터의 종류(예: '할 일', '사용자')를 정의하는 컨테이너입니다.
필드¹³	테이블의 컬럼(Column) 또는 속성(Attribute)	각 데이터 유형이 보유하는 정보의 단위(예: 할 일의 '내용', '완료 여부')입니다.
워크플로우⁸	백엔드의 함수(Function) 또는 API 엔드포인트	특정 이벤트(버튼 클릭, 페이지 로드)에 반응하여 실행되는 논리적 동작의 흐름입니다.
반복 그룹¹⁴	웹 프레임워크의 반복문(Loop)	데이터베이스에서 가져온 목록을 순서대로 표시하는 UI 요소입니다.

 

3부. [실습편] 버블(Bubble)로 할 일 관리 앱 만들기: 단계별 가이드 🛠️

이제부터 버블 편집기(Editor)를 열고 다음 단계를 따라 앱을 만들어보겠습니다.

3.1. 1단계: 데이터베이스 설계하기

앱의 가장 중요한 기반을 다지는 단계입니다.

데이터를 저장하고 관리할 '장부'를 만드는 과정이라고 생각하면 쉽습니다.

1. 버블 편집기 화면 왼쪽 메뉴에서 Data 탭을 클릭하세요.
   
   
2. Data types 탭이 선택되어 있는지 확인합니다.
   
   
3. New type이라고 적힌 입력창에 To-do를 입력하고 Create 버튼을 클릭합니다.
   이제 To-do라는 새로운 데이터 유형¹²(일종의 '장부')이 만들어졌습니다.
   
   
4. Create a new field 버튼을 클릭하여 To-do 장부에 필요한 첫 번째 필드¹³(항목)를 추가합니다.
   
   
5. Field name에 Content를 입력하고, Field type 드롭다운에서 text를 선택한 후 Create 버튼을 클릭합니다.
   할 일의 내용을 텍스트로 저장할 필드가 생성되었습니다.
   
   
6. Create a new field 버튼을 다시 클릭합니다.
   
   
7. Field name에 Done?을 입력하고, Field type 드롭다운에서 yes/no를 선택한 후 Create를 클릭합니다.
   할 일의 완료 여부를 예(yes) 또는 아니오(no)로 저장할 필드가 생성됩니다.
   
   
8. 마지막으로, 사용자별로 할 일을 관리하기 위해 Creator 필드를 추가합니다.
   Field type 드롭다운에서 User를 선택하면 자동으로 연결됩니다.
   이는 이 할 일 데이터가 어떤 사용자와 연결되어 있는지를 기록하는 중요한 필드입니다.

우리가 구축한 데이터베이스⁷의 모습은 아래 표와 같습니다.

데이터 유형	필드	필드 유형	설명
To-do	Content	text	할 일의 내용을 기록합니다.
	Done?	yes/no	할 일 완료 여부를 기록합니다.
	Creator	User	이 할 일을 생성한 사용자와 연결됩니다.
User	Email	text	사용자의 이메일 주소를 저장합니다.
	Password	text	사용자의 비밀번호를 저장합니다.(자동 암호화)

 

데이터베이스 설계하기

3.2. 2단계: UI 디자인하기

사용자에게 보여질 화면을 만들고, 데이터베이스⁷와 화면을 연결하는 단계입니다.

1. 버블 편집기 왼쪽 상단 메뉴에서 Design 탭을 클릭하여 다시 디자인 화면으로 돌아갑니다.
   
   
2. 왼쪽 메뉴의 Visual Elements에서 Group²⁴ 요소를 페이지 상단에 드래그하여 배치합니다.
   이 그룹은 할 일을 추가할 영역을 담는 컨테이너 역할을 합니다.
   
   
3. 방금 만든 Group 안에 Multiline Input²⁴과 Button²⁴ 요소를 드래그하여 추가합니다.
   Multiline Input의 Placeholder 텍스트는 "새로운 할 일을 입력하세요"로, Button의 텍스트는 "할 일 추가"로 변경하면 좋습니다.
   
   
4. 이제 할 일 목록을 표시할 영역을 만듭니다.
   버블 모바일 앱 빌더의 리스트 컴포넌트²⁵는 여러 가지가 있으며, 이 중에서 Short list는 할 일 목록처럼 길지 않은 데이터를 표시하기에 적합합니다.
   Group 아래에 Short list²⁶ 요소를 드래그하여 배치합니다.
   
   
5. 이 리스트의 속성창에서 Type of content를 To-do로 설정합니다.
   Data source는 Do a search for To-do's를 선택하여 우리가 만든 To-do 데이터베이스⁷를 불러오도록 합니다.
   
   
6. 리스트 내부에 할 일 내용을 표시할 Text²⁷ 요소를 드래그합니다.
   
   
7. Text²⁴ 요소의 내용에 Current cell's To-do's Content를 클릭하여, 현재 셀(반복 그룹의 각 행)의 할 일 내용을 자동으로 표시하도록 연결합니다.
   
   
8. Text²⁴ 요소 옆에 완료 상태를 나타낼 Icon²⁴ 요소를 추가하고, 빈 원 모양 아이콘(예: circle-o)을 선택합니다.

UI 디자인하기

3.3. 3단계: 워크플로우로 기능 구현하기

앱이 실제로 '작동'하도록 만드는 논리적 흐름을 설계하는 단계입니다.

1. 할 일 추가 워크플로우:
   이제 앱이 동작하도록 워크플로우⁸를 만들어 봅시다. 다음 두 가지 방법 중 편한 방법을 선택하세요.
   • 방법 1:
     버튼에서 바로 시작하기 화면의 "할 일 추가" Button²⁴을 선택하고, 속성 편집기에서 'Start/Edit workflow' 버튼을 클릭합니다.
     
     
   • 방법 2: 워크플로우 탭에서 시작하기 (더 확실한 방법)
     1. 버블 편집기 왼쪽 메뉴에서 Workflow 탭을 클릭합니다.
        
        
     2. 'Click here to add an event...'를 클릭하고 'Elements' 아래에 있는 'An element is clicked' 옵션을 선택합니다.
        
        
     3. 'Element' 드롭다운에서 방금 만든 '할 일 추가' Button²⁴을 선택합니다.
   어떤 방법을 사용하든, 워크플로우⁸ 탭에 'When Button is clicked' 이벤트가 생성됩니다.
   이제 이 이벤트 아래에 다음 액션을 추가하세요.
   • Click here to add an action...을 클릭하고 Data (Things) 메뉴에서 Create a new thing¹⁶을 선택합니다.
     
     
   • Type은 To-do로 설정하고, Content 필드¹³에 방금 만든 Multiline Input의 값(’s Value)을 연결합니다.
2. 할 일 완료/수정 워크플로우:
   • 이제 Design 탭으로 돌아와 리스트 내부에 있는 Icon²⁴ 요소를 더블 클릭하고 Start/Edit workflow를 선택합니다.
     
     
   • Click here to add an action...을 클릭하고 Data (Things) 메뉴에서 Make changes to a thing¹⁷을 선택합니다.
     
     
   • Thing to change에 Current cell's To-do를 설정하고, Done? 필드¹³의 값을 yes로 변경하도록 설정합니다.

워크플로우로 기능 구현하기

3.4. 4단계: 조건문(Conditional)으로 동적 UI 적용하기

할 일이 완료되었을 때 시각적인 변화를 주는 단계입니다.

1. Design 탭으로 돌아와 리스트 내의 Text²⁴ 요소를 선택합니다.
   
   
2. 속성창의 Conditional 탭을 클릭하고 Define another condition을 선택합니다.
   
   
3. 조건에 When This To-do's Done? is yes를 설정합니다.
   
   
4. Property to change 드롭다운에서 Text를 선택합니다.
   
   
5. Text 입력창에 [s]를 입력한 뒤 Current cell's To-do's Content를 클릭하고 마지막에 [/s]를 입력합니다.
   완성된 형태는 [s]Current cell's To-do's Content[/s]가 됩니다.
   
   
6. 이제 Icon²⁴ 요소를 선택하고 동일한 조건( When This To-do's Done? is yes )을 설정합니다.
   
   
7. Property to change에서 Icon을 선택하여 checkmark와 같은 완료 아이콘으로 변경하고, Color를 회색 등으로 바꿔줍니다.

조건문(Conditional)으로 동적 UI 적용하기

3.5. 5단계: 사용자 인증 기능 추가하기

개인용 할 일 관리 앱을 완성하기 위해 필수적인 단계입니다.

1. Design 탭으로 이동합니다.
   
   
2. 로그인 화면으로 사용할 Group²⁷ 요소를 새로 만듭니다.
   왼쪽 메뉴의 Visual Elements에서 Group을 드래그하여 페이지에 놓습니다.
   
   
3. 중요: 이 그룹이 다른 요소들 위에 보이도록 하려면, 왼쪽의 Element tree³⁰ 패널을 확인하세요.
   방금 만든 Group이 목록의 맨 아래에 있다면, 마우스로 드래그해서 목록의 가장 위로 옮겨줍니다.
   
   
4. 새로 만든 그룹의 속성창에서 이름을 Group Login 등으로 변경합니다.
   이 그룹의 위치와 크기를 설정하여 페이지 전체를 덮도록 만듭니다.
   
   
5. 이 그룹이 앱을 처음 열었을 때 자동으로 보이지 않도록, 'This element is visible on page load' 옵션의 체크를 해제합니다.
   
   
6. Group Login 안에 이메일, 비밀번호 입력을 위한 Input²⁷ 요소와 '로그인', '회원가입' 버튼 역할을 할 Button²⁷을 배치합니다.
   
   
7. 회원가입 버튼의 워크플로우⁸에 Account → Sign the user up 액션을 연결합니다.
   액션 설정 팝업창에서 아래 항목을 설정합니다.
   • Email: 이메일 입력을 위한 Input²⁷ 요소의 값('s value)을 연결합니다.
   • Password: 비밀번호 입력을 위한 Input²⁷ 요소의 값('s value)을 연결합니다.
   • 이때, User 데이터 유형¹⁸에는 기본적으로 email과 password 필드가 존재하므로 추가로 만들 필요는 없습니다.
   • 회원가입이 완료되면 Element Actions → Hide 액션을 추가하여 Group Login을 숨깁니다.
8. 로그인 버튼의 워크플로우⁸에는 Account → Log the user in 액션을 연결합니다.
   액션 설정 팝업창에서 아래 항목을 설정합니다.
   • Email: 이메일 입력을 위한 Input²⁷ 요소의 값('s value)을 연결합니다.
   • Password: 비밀번호 입력을 위한 Input²⁷ 요소의 값('s value)을 연결합니다.
   • 로그인 성공 시에도 마찬가지로 Element Actions → Hide 액션을 추가하여 Group Login을 숨깁니다.
9. 이제 페이지 로드 시 로그인 그룹을 보이도록 설정합니다.
   버블 편집기 왼쪽 메뉴에서 Workflow 탭을 클릭한 뒤, 'Click here to add an event...'를 눌러 'Page is loaded' 이벤트를 선택합니다.
   
   
10. 이 이벤트 아래에 Only when 조건을 설정하여 Only when Current User is logged out일 때만 Group Login이 보이도록 합니다.
    이는 조건문²⁰과 같은 역할을 하며, 사용자가 로그인되어 있지 않을 때만 로그인 화면을 표시합니다.
    
    
11. 마지막으로, Data 탭에서 Data types의 Privacy 탭으로 이동합니다.
    
    
12. To-do 데이터 유형¹²에 대한 새로운 규칙을 추가하여 Current User¹⁹일 때만 데이터베이스⁷에 접근할 수 있도록 보안을 설정합니다.

개인정보 보호 규칙 설정 상세 가이드

사용자가 자신의 할 일 데이터만 볼 수 있도록 보안을 강화하는 것은 매우 중요합니다.
버블에서는 '개인정보 보호 규칙(Privacy rules)'을 통해 이 작업을 손쉽게 할 수 있습니다.

1. 버블 편집기 왼쪽 메뉴에서 Data 탭을 클릭합니다.
   
   
2. 상단의 탭 메뉴에서 Privacy를 선택합니다.
   
   
3. 화면 왼쪽 상단에 'Choose a type'라는 드롭다운 메뉴가 보입니다. 여기서 To-do를 선택합니다.
   
   
4. 이제 'New rule'을 클릭하여 새로운 규칙을 생성합니다.
   
   
5. 규칙의 Name 입력창에 Only creator can see 와 같이 규칙의 목적을 쉽게 알 수 있도록 이름을 지정합니다.
   
   
6. When이라고 적힌 조건식을 설정합니다. 여기서는 This To-do's Creator is Current User를 입력합니다.
   • This To-do: 현재 데이터베이스에서 평가 중인 특정 '할 일' 데이터를 의미합니다.
     
     
   • 's Creator: 위에서 우리가 To-do 데이터 유형에 추가했던 Creator 필드를 통해, 이 할 일을 누가 만들었는지 확인하는 것입니다.
     
     
   • is Current User: 현재 앱에 로그인한 사용자(Current User)와 이 할 일의 생성자가 동일한지 비교하는 조건입니다.
7. 이 조건이 충족될 때(즉, 사용자가 자신의 할 일을 볼 때) 허용할 권한을 설정합니다.
   Users who match this rule can... 아래의 체크박스를 다음과 같이 설정하세요.
   • View all fields: 체크 (이 할 일의 모든 필드(내용, 완료 여부 등)를 볼 수 있도록 허용).
     
     
   • Find this in searches: 체크 (사용자의 할 일 목록에 이 항목이 검색되도록 허용).
     
     
   • 나머지 권한은 필요에 따라 설정할 수 있지만, 기본적으로는 위 두 가지만 체크해도 충분합니다.
8. 마지막으로, 하단에 있는 Everyone else (default permissions) 규칙을 확인하세요.
   이 규칙은 위에서 만든 규칙에 해당하지 않는 모든 사용자에게 적용됩니다.
   다른 사용자들이 다른 사람의 데이터를 보지 못하도록, 이 규칙 아래에 있는 모든 권한(예: View all fields, Find this in searches)의 체크를 해제합니다.
   이렇게 하면 데이터 보안이 확실하게 강화됩니다.

사용자 인증 기능 추가하기

4부. 완성된 앱의 배포 및 유지보수 노하우 ✨

4.1. 앱 배포(Deployment) 프로세스

버블²은 유료 플랜에서 Development 버전²¹과 Live 버전²¹을 분리하여 관리할 수 있도록 지원합니다.

편집기 좌측에 있는 버튼을 클릭하면 Development 버전의 앱을 사용자에게 공개하는 Live 버전으로 배포할 수 있습니다.

이는 개발 중인 버전을 사용자에게 노출하지 않고 안전하게 테스트할 수 있도록 하여, 안정적인 서비스 운영을 가능하게 합니다.

4.2. 성능 최적화(Optimization)를 위한 전문가 팁

버블² 앱의 성능은 단순한 디자인을 넘어선 체계적인 아키텍처 설계에 달려 있습니다.

다음은 앱의 속도와 확장성을 최적화하기 위한 몇 가지 핵심 노하우입니다.

• 데이터베이스⁷ 설계 최적화:
  앱의 성능은 데이터베이스⁷ 설계에 크게 좌우됩니다.
  특히 대용량의 데이터를 다루는 경우, 이미지를 별도의 데이터 유형¹²에 저장하고 필요할 때만 불러오는 위성 데이터 유형²² 개념을 활용해야 합니다.
  
  
• 재사용 가능한 요소²³ 활용:
  앱의 페이지가 많아질 경우, 헤더나 팝업 등 자주 사용되는 UI¹⁵ 요소를 재사용 가능한 요소²³로 만들어 에디터와 앱의 속도를 향상시킬 수 있습니다.
  이는 앱의 구조를 모듈화하여 유지보수성을 높이는 효과도 가져옵니다.
  
  
• 플러그인 관리:
  사용하지 않는 플러그인은 모두 제거하여 앱의 로딩 속도를 최적화해야 합니다.
  모든 플러그인은 앱에 기술적 부채를 추가하므로, 꼭 필요한 기능만 선택적으로 활용하는 것이 중요합니다.
  
  
• 심플함의 미학:
  복잡한 기능보다는 필수적인 기능에 집중하고 중복을 줄이는 심플함이 앱의 유지보수성과 성능을 높이는 가장 좋은 방법입니다.
  '최소 기능 제품(MVP)'을 넘어선 앱을 구축할 때에도 이 원칙을 잊지 않는 것이 중요합니다.
  
  

결론: 나만의 앱 빌더로 성장하는 첫걸음

버블²은 단순한 툴이 아닌, 나의 아이디어를 비즈니스로 현실화할 수 있는 강력한 플랫폼입니다.
이번 가이드를 통해 당신은 단순히 '할 일 관리 앱'을 만드는 것을 넘어, 데이터베이스⁷ 설계, 워크플로우⁸ 로직, 사용자 인증 등 개발의 핵심 원리를 시각적으로 체득했을 것입니다.
이제 당신은 단순한 앱 사용자를 넘어, 나만의 아이디어를 현실로 만들어가는 진정한 '혁신가'가 되었습니다.
기술의 복잡성이라는 장벽을 뛰어넘어, 당신의 아이디어가 세상에 빛을 발할 수 있도록 버블²이 그 시작을 함께할 것입니다.

---

➡️ [ 17편 ] 예고: 코딩 없이 만드는 웹사이트/웹 앱, 웹플로우 vs. 버블 선택 가이드 💻

노코드/로우코드(LCNC)는 단순히 복잡한 개발 과정을 간소화하는 것을 넘어, 아이디어를 가진 누구나 직접 웹사이트와 웹 앱을 만들 수 있는 기회를 열어주었습니다.

특히, 웹플로우(Webflow)와 버블(Bubble)은 각자의 강력한 강점을 바탕으로 노코드 웹 개발 생태계를 이끌고 있는 대표적인 두 툴입니다.

다음 편에서는 당신의 프로젝트 목표에 맞는 최적의 툴을 선택할 수 있도록, 웹플로우와 버블의 핵심적인 차이점과 실질적인 활용법을 비교 분석합니다.

 

배울 내용:

• 웹플로우와 버블의 핵심 차이점 이해하기:
  웹플로우의 뛰어난 시각적 디자인 기능과 버블의 강력한 로직 및 데이터베이스 구축 능력을 비교 분석합니다.
  
  
• 프로젝트 유형에 따른 툴 선택 기준 정립하기:
  마케팅용 웹사이트, 이커머스, 복잡한 사용자 로직이 필요한 웹 앱 등 프로젝트 목적에 따라 어떤 툴이 더 효율적인지 판단하는 방법.
  
  
• 가격, 확장성, 그리고 커뮤니티 등 실질적인 선택 요소를 고려하여 나만의 프로젝트에 가장 적합한 툴을 결정하는 노하우.

나만의 아이디어를 현실로 만들기 위한 첫걸음, 당신의 프로젝트에 맞는 최적의 툴을 선택하고 개발 시간과 비용을 획기적으로 줄여줄 실용적인 팁을 얻어가세요.

 

[ 17편 ] 웹플로우 vs. 버블: 내 프로젝트에 맞는 웹사이트/웹 앱 툴 선택하기 🛠️

 

[ 15편 ] 아이디어만 있다면, 바로 시작! 노코드로 '최소 기능 제품(MVP)' 만드는 법

 

---

📚 용어 설명 (Glossary)

1. 노코드/로우코드(LCNC) 코딩 지식 없이도 소프트웨어 개발을 할 수 있도록 도와주는 기술과 플랫폼을 통칭하는 용어입니다. '노코드(No-Code)'는 코드를 전혀 작성하지 않고도 앱을 만들 수 있는 도구이고, '로우코드(Low-Code)'는 최소한의 코딩만으로도 개발이 가능한 도구를 의미합니다.

2. 버블(Bubble) 코딩 없이 웹 애플리케이션을 제작할 수 있는 대표적인 노코드 플랫폼입니다. 드래그 앤 드롭 방식으로 사용자 화면을 디자인하고, 데이터베이스를 설계하며, 앱의 동작을 정의하는 워크플로우를 구축할 수 있어 비개발자도 복잡한 소프트웨어를 만들 수 있습니다.

3. AI 기반 앱 생성기 텍스트 명령만으로 애플리케이션의 기본 틀이나 특정 기능을 자동으로 생성해 주는 인공지능 도구입니다. 개발자는 '할 일 관리 앱을 만들어줘'와 같은 자연어 명령을 통해 앱의 초기 구조를 순식간에 만들 수 있습니다.

4. 생성형 개발 인공지능을 활용하여 코드, 디자인, 콘텐츠 등을 자동으로 만들어내는 새로운 개발 방식입니다. 단순히 기존의 것을 수정하는 것을 넘어, AI가 새로운 것을 창조하며 개발 과정을 혁신적으로 단축시킵니다.

5. 크로스-플랫폼 하나의 코드로 여러 운영체제(예: iOS, Android)나 환경(예: 웹, 모바일)에서 모두 작동하는 소프트웨어를 만드는 것을 의미합니다. 버블은 웹뿐만 아니라 모바일 앱까지 하나의 프로젝트로 만들 수 있게 해줍니다.

6. 정적인 웹사이트 및 동적인 웹 애플리케이션 정적인 웹사이트는 한 번 만들어지면 내용이 잘 바뀌지 않는 웹페이지입니다. 반면, 동적인 웹 애플리케이션은 사용자의 입력이나 데이터 변화에 따라 화면의 내용이 실시간으로 바뀌고 복잡한 상호작용이 가능한 프로그램입니다.

7. 데이터베이스 앱에서 사용되는 모든 데이터를 체계적으로 저장하고 관리하는 '전자 장부' 또는 '정보 창고'입니다. 데이터베이스에는 사용자 정보, 할 일 목록, 게시글 등 앱의 핵심적인 모든 정보가 담겨 있습니다.

8. 워크플로우 앱의 논리적인 흐름을 시각적으로 설계하는 기능입니다. '사용자가 버튼을 클릭하면 → 새로운 할 일을 데이터베이스에 저장한다'와 같은 일련의 규칙을 순서대로 정의하여 앱의 동작을 만듭니다.

9. API '애플리케이션 프로그래밍 인터페이스'의 약자로, 서로 다른 프로그램이나 서비스가 데이터를 주고받을 수 있도록 연결해 주는 통신 규칙입니다. 이를 통해 버블로 만든 앱이 외부 서비스(예: ChatGPT, 구글 지도 등)와 정보를 교환할 수 있습니다.

10. Workload Unit (WU) 버블 앱이 사용하는 연산량에 비례하여 부과되는 비용 측정 단위입니다. 사용자의 앱 활동(데이터 검색, 워크플로우 실행 등)이 많을수록 더 많은 WU가 소모됩니다.

11. 시민 개발자 전통적인 개발 직군이 아닌 일반인이 노코드/로우코드 도구를 활용하여 직접 소프트웨어와 서비스를 만드는 사람들을 의미합니다.

12. 데이터 유형 데이터베이스에 저장할 데이터의 종류를 정의하는 개념입니다. 예를 들어 '할 일'이나 '사용자'와 같이 데이터의 큰 틀을 규정합니다.

13. 필드 데이터 유형 안에 포함되는 각각의 세부 항목입니다. 예를 들어, '할 일'이라는 데이터 유형에는 '내용'이나 '완료 여부'와 같은 필드가 포함됩니다.

14. 반복 그룹 데이터베이스에 저장된 여러 개의 데이터를 가져와 목록 형태로 반복적으로 화면에 표시해 주는 UI 요소입니다. 할 일 앱에서는 할 일 목록을 보여주는 데 사용됩니다.

15. UI 및 UI 요소 UI(User Interface)는 사용자가 앱을 보고 조작하는 화면과 디자인을 총칭합니다. UI 요소는 버튼, 텍스트, 입력창, 아이콘 등 화면을 구성하는 개별적인 구성 요소를 의미합니다.

16. Create a new thing 버블의 워크플로우에서 사용되는 주요 액션 중 하나로, 데이터베이스에 새로운 데이터(것, thing)를 생성할 때 사용됩니다.

17. Make changes to a thing 버블의 워크플로우에서 사용되는 주요 액션 중 하나로, 이미 존재하는 데이터의 내용을 수정할 때 사용됩니다.

18. User 데이터 유형 버블에 기본으로 내장되어 있는 특별한 데이터 유형으로, 앱에 가입한 사용자들의 정보를 저장하는 데 사용됩니다.

19. Current User 현재 앱에 로그인한 사용자를 가리키는 개념입니다. 이를 통해 사용자별로 개인화된 데이터를 보여주거나 관리할 수 있습니다.

20. 조건문 특정 조건이 충족될 때만 앱의 특정 동작이 실행되거나, UI 요소의 스타일이 바뀌도록 설정하는 기능입니다.

21. Development 버전 및 Live 버전 Development 버전은 개발자가 앱을 만들고 수정하는 작업 공간입니다. Live 버전은 사용자들이 실제로 접속하여 앱을 사용하는 공개된 서비스입니다.

22. 위성 데이터 유형 앱의 성능을 최적화하기 위해, 이미지나 영상처럼 크고 무거운 데이터를 별도의 데이터 유형에 분리하여 저장하는 설계 방식입니다.

23. 재사용 가능한 요소 앱의 여러 페이지에서 반복적으로 사용되는 UI 그룹(예: 헤더, 로그인 창, 팝업)을 한 번 만들어서 필요할 때마다 재활용할 수 있게 해주는 기능입니다.