비개발자가 플러터플로우를 쓰기 위해 알아야 하는 것들 (2편)

플러터플로우 입문 후 5개월   

 

플러터플로우는 네이티브 앱을 개발할 수 있는 프레임워크 플러터Flutter를 기반으로 한 로우 코드 빌더다. 비개발자가 플러터플로우를 쓰기 위해 알아야 하는 것들 (1편)을 작성할 당시는 플러터플로우를 사용한 지 1개월을 지난 시점이었다. 그때 느낀 점은 두 가지였다. 개발 지식이 전무하다면 앱 개발 과정에서 어려움을 겪을 수 있다는 것, 그리고 코드를 직접 작성할 줄 알면 작업 속도가 훨씬 빨라질 거라는 것이다.

 

플러터플로우를 사용한 지 5개월이 지난 현재에도 위 의견에 변함 없으나 새롭게 알게 된 것들이 있다. 그건 컴퓨터에 말을 거는 법과 로직^[각주:1]을 구성하는 법이다. 플러터플로우와 씨름하던 지난날 가장 많이 저질렀던 실수는 컴퓨터가 기능 구현을 하는데 필요한 조건^[각주:2]을 '전부 다' 말해주지 않은 것이다. 컴퓨터는 단계에 맞춰 하나부터 열까지 설명해 주지 않으면 에러로 답한다.   

 

로직은 플러터플로우의 액션 플로우^[각주:3]에서 시각화된다. 기능을 만들어 내기 위한 과정을 작은 단계로 나눈 다음 그 단계들을 순서에 맞게 연결한다. 로직을 이해하면 논리적인 사고방식도 이해할 수 있다. 단계를 나누고 순서에 맞춰 전개하는 게 핵심이다.  

플러터플로우 액션 플로우 - 기능을 구현하는 단계를 눈으로 볼 수 있다.

---

 

플러터플로우 주요 요소

 

이전 편에서 플러터플로우의 주요 요소 목록을 언급하고 위젯을 설명했다. 주요 요소는 플러터플로우 사용 시 자주 접하는 항목을 기준으로 선정했다. 이번 편에서는 특정 요소를 길게 설명하기보다 주요 요소 전체를 간략히 정리해 보려고 한다. 

• 위젯 Widget
  • 화면을 구성하는 작은 부품 
  • 더 자세한 설명은 이전 편
• 변수 Variables 
  • 변수는 값이 하나로 고정되어 있지 않고 계속 변하는 것을 뜻한다.  
  • 예를 들어 이미지를 저장하는 기능에서 이미지는 여러 유저에 의해 업로드되니 값이 하나로 고정되어 있지 않고 계속 변한다. 이미지는 코드에 URL로 저장되는데 이때 URL이 변수가 된다. 
• 파라미터 Parameters 
  • 사전적 정의는 매개변수다. 페이지 사이에서 데이터를 전달하는 역할이다. 
  • 예를 들어 유저 프로필 페이지에서 프로필 정보를 저장하고 홈화면에서 유저 닉네임과 프로필 사진을 표시할 경우 유저 프로필 페이지, 홈화면 각각 파라미터를 설정한다. 
  • 유저 프로필 페이지 → 홈화면 : 프로필 정보 전달
  • 홈화면  → 유저 프로필 페이지 : 해당 유저가 누구인지 식별할 수 있는 유저 정보 전달 
• 도큐먼트 Document 
  • 데이터베이스에서 데이터를 저장하는 기본 단위를 뜻한다.
  • 데이터 내용은 '항목 : 값'으로 이루어진다. 
  • 예시 - username : 홍길동  
• 레퍼런스 Reference 
  • 데이터베이스에서 다른 도큐먼트의 ID를 가리키는 참조를 뜻한다.
  • 무언가 저장하는 기능을 구현할 때 다른 도큐먼트의 내용을 참조해야 하는 상황이 생긴다. 그때 레퍼런스를 사용한다.
• 데이터베이스 스키마 Schema
  • 데이터베이스 내에서 데이터가 어떤 구조로 저장되는지 나타낸다.  
• 데이터 타입 Data Type
  • 데이터 값의 종류를 뜻한다. 
  • 스트링(문자열), 날짜와 시간, 참 또는 거짓을 나타내는 불린Boolean, 정수 Integer 등이 있다. 
  • 더 자세한 설명은 플러터플로우 닥스
• 커스텀 데이터 타입 Custom Data Type 
  
  • 플러터플로우에서 여러 종류의 데이터를 하나의 집합으로 묶어 커스텀 데이터 타입을 만들 수 있다.  
  • 예를 들어 '주소'라는 데이터 타입에 '시, 구/군, 도로명, 건물 이름, 동/호수' 등 여러 데이터를 묶는다. 
  • 데이터베이스 구조를 간결하게 하는 데 도움을 줄 수 있다.
• 파이어베이스 Firebase 
  • Google에서 제공하는 모바일 및 웹 애플리케이션 개발 플랫폼으로, 데이터베이스, 인증, 호스팅 등 다양한 기능을 제공한다. 
  • 데이터 저장을 위해 플러터플로우 프로젝트를파이어베이스에 연결해야 한다. 

위 개념을 이해하기 위해서는 플러터플로우를 직접 사용하는 것이 중요하다. 

다음편 예고 - 기능 구현 중 오류의 원인과 해결 과정 

---

참고 자료

1. FlutterFlow Docs, URL

용어 설명

1. 어떤 결과를 도출하기 위해 이치에 맞게 전개되는 과정 [본문으로]
2. 변수, 파라미터, 데이터 등 [본문으로]
3. 예를 들어 페이지에서 정보를 저장하는 버튼을 만든다고 할 때 버튼 위젯에 저장 기능을 적용하는 것을 액션이라고 한다. 저장 기능의 전체 흐름은 액션 플로우라고 한다. [본문으로]