MongoDB Realm으로 오프라인 Flutter 앱 구축하는 방법
모바일 애플리케이션용 데이터 저장소를 선택하는 것은 Flutter 개발자에게 어려운 경험이 될 수 있습니다.
Realm의 모바일 데이터베이스는 KeyValue 쌍, SQLite 및 Firestore에 대한 개발자 친화적인 오픈 소스 대안입니다. 몇 분 만에 시작하여 몇 주간의 작업 시간을 절약할 수 있습니다.
Realm은 오프라인 우선이고 객체 지향적이고 직관적이며 모바일용으로 제작되었습니다.
\이 기사에서는 Flutter와 Realm SDK를 사용하여 오프라인 모바일 앱을 빌드합니다.
무엇을 만들까요?
우리는 사용자가 항목 목록을 보고, 새 항목을 추가하고, 기존 항목을 토글 및 삭제할 수 있는 매우 간단한 쇼핑 목록 애플리케이션을 구축할 것입니다.
무엇이 필요할까요?
- 플러터 설치 및 구성
- 가장 좋아하는 IDE
시작하자
터미널에서 아래 명령을 사용하여 플러터 앱을 만드는 것부터 시작하세요.
flutter create shoppinglist
이렇게 하면 현재 작업 디렉토리에 shoppinglist라는 이름의 폴더가 생성되고 여기에는 Flutter 애플리케이션의 소스 코드가 포함되며 다음과 같이 보일 것입니다.
즐겨찾는 IDE에서 디렉토리를 프로젝트로 엽니다.
Realm을 종속성으로 설치
다음으로 영역을 종속성으로 추가합니다. pubspec.yaml
. 이것은 아래 명령을 사용하여 수행할 수 있습니다
flutter pub add realm
또는 다음을 열 수 있습니다. pubspec.yaml
파일을 만들고 영역을 종속성으로 추가합니다.
dependencies:
# other dependecies here
realm: ^0.2.1+alpha
위의 내용을 추가한 후 아래 명령을 실행해야 합니다.
flutter pub get
그게 다야 이제 Realm을 시작하는 데 필요한 모든 것을 갖추었습니다.
스키마 생성
스키마는 모든 Realm 애플리케이션에서 가장 단순한 단위입니다. 스키마는 애플리케이션에서 사용할 데이터 구조를 정의합니다.
예를 들어, Item
쇼핑 목록에는 두 가지 속성이 있을 수 있습니다.
- 텍스트: 문자열
- 완료: 부울
애플리케이션에서 항목을 나타내기 위해 스키마를 생성합니다. 그렇게하려면 이라는 디렉토리를 만드십시오. schemas
에서 lib
예배 규칙서. 이 디렉토리에는 애플리케이션에서 사용되는 모든 스키마가 포함됩니다.
이제 다음과 같은 파일을 생성합니다. item.dart
아래 내용으로.
@RealmModel
이다Annotation
정의하는 데 사용되는 클래스Realm
데이터 모델 클래스 및 해당 속성
@PrimaryKey
기본 키 속성을 나타냅니다. 개체의 빠른 조회를 가능하게 하고 값의 고유성을 적용합니다. 그것은 될 수 있습니다의 단일 속성에 적용
RealmModel
수업어느 하나
String
또는int
다음에서 스키마 생성 RealmModel
수업
이제 스키마 클래스가 정의되었으므로 Realm 스키마를 생성해야 합니다. Realm 스키마는 다음을 결합하여 생성됩니다. _Item
그리고 RealmObject
클래스. Realm은 이 작업을 더 간단하게 만들었습니다. 우리가해야 할 일은 아래 명령을 실행하는 것입니다.
flutter pub run realm generate
위의 명령은 새 파일을 생성합니다 item.g.dart
클래스를 포함하는 Item
.
Realm으로 작업하기
영역 구성 및 열기
Realm을 사용하려면 먼저 다음을 정의해야 합니다. Configuration
물체. 생성자는 Realm에서 작업할 스키마 목록을 가져옵니다. 선택적으로 통과할 수 있습니다. readOnly
그리고 inMemory
Realm을 읽기 전용 모드로 열거나 Realm을 메모리에 로드하려는 것을 나타내는 플래그입니다.
Configuration _config =
Configuration([Item.schema], readOnly: false, inMemory: false);
Realm _realm = Realm(_config);
모든 항목 읽기
RealmResults items = _realm.all();
쓰기/업데이트/삭제 작업은 transaction
차단하다. 트랜잭션 블록을 생성하려면 다음을 사용하십시오. write()
콜백을 매개변수로 제공합니다. 콜백 내에서 쓰기/업데이트/삭제 작업을 수행합니다.
항목 쓰기
_realm.write(() {
_realm.add(Item(text, false));
});
항목 업데이트
_realm.write(() {
item.done = true;
});
항목 삭제
_realm.write(() {
_realm.delete(item);
});
영역 닫기
if (!_realm.isClosed) {
_realm.close();
}
영역 작업을 위한 서비스 만들기
Realm을 관리하기 위해 Realm을 열고/닫고 쿼리/업데이트/삭제 작업을 수행하는 메서드를 노출하는 서비스 클래스를 만들 것입니다.
디렉토리 생성 services
아래에 lib
예배 규칙서. 새 파일 추가 item_service.dart
다음 코드로
이제 핵심 비즈니스 로직이 준비되었으므로 UI 구성 요소와 화면을 빌드하도록 이동합니다.
UI 구성 요소 만들기
디렉토리 생성
components
에서lib
예배 규칙서. 이 디렉토리에는 ShoppingList 애플리케이션에서 사용되는 모든 UI 구성요소가 포함됩니다.
항목 목록 보기
ItemListView
본질적으로 쇼핑 목록의 항목 목록을 렌더링하는 ListView입니다. ItemListView
구성 요소는 세 가지 필수 매개변수를 취합니다.
items
- 항목 개체 목록onToggle
- 항목이 토글될 때 호출되는 콜백 함수onDelete
- 아이템 삭제 시 호출되는 콜백 함수
이름이 새 파일 추가 item_list_view.dart
안에 components
아래 코드가 있는 디렉토리:
항목보기 추가
AddItemView
입력 필드와 버튼으로 구성됩니다. 사용자는 입력 필드에 항목을 입력할 수 있으며 버튼을 클릭하면 새 항목이 생성되어야 합니다.
AddItemView
구성 요소는 하나의 필수 매개변수를 사용합니다.
onAdd
- 아이템 추가 시 호출되는 콜백 함수
이름이 새 파일 추가 add_item_view.dart
안에 components
아래 코드가 있는 디렉토리:
쇼핑목록보기
ShoppingListView
이전에 생성된 구성 요소로 구성됩니다. ItemListView
그리고 AddItemView
사용자가 항목을 추가하고 기존 항목 목록을 볼 수 있는 집계 보기를 제공합니다.
ShoppingListView
구성 요소는 4개의 필수 매개변수를 취합니다.
onAdd
- 아이템 추가 시 호출되는 콜백 함수onToggle
- 항목이 토글될 때 호출되는 콜백 함수onDelete
- 아이템 삭제 시 호출되는 콜백 함수items
- 항목 개체 목록
이름이 새 파일 추가 shopping_list_view.dart
안에 components
아래 코드가 있는 디렉토리:
홈 화면 만들기
이제 UI 구성 요소와 Realm 서비스가 준비되었으므로 홈 화면에서 함께 연결할 수 있습니다. 홈 화면에서 ShoppingList가 있는 기본 앱을 자식으로 렌더링합니다. 우리는 또한 콜백 함수를 만들 것입니다 onAdd
, onToggle
그리고 onDelete
이러한 기능에서 다양한 Realm 작업을 처리합니다.
열려 있는 main.dart
안에 lib
디렉토리를 만들고 기존 코드를 아래로 바꿉니다.
애플리케이션 실행
그게 다야 애플리케이션을 시작할 준비가 되었습니다. 모든 코드 파일을 저장합니다.
Flutter 애플리케이션을 시작하기 위해 먼저 에뮬레이터를 시작합니다. 사용 가능한 에뮬레이터 목록을 찾아보겠습니다.
flutter emulators
위의 출력에서 에뮬레이터 ID 중 하나를 선택하고 아래 명령을 사용하여 하나를 시작합니다.
flutter emulators --launch Pixel4_API30
에뮬레이터가 시작된 후 아래 명령을 사용하여 장치 ID를 찾을 수 있습니다.
flutter devices
장치 ID 복사(emulator-5554
), 아래 명령을 사용하여 flutter 앱을 실행합니다.
flutter run -d emulator-5554
명령에 대한 열렬한 팬이 아니라면 IDE를 사용하여 에뮬레이터를 시작하고 Flutter 애플리케이션을 실행할 수 있습니다.
팁 및 추가 리소스
이제 Realm 애플리케이션이 실행되고 있으므로 계속해서 스키마를 더 추가하거나 기존 스키마를 업데이트할 수 있습니다.
스키마를 변경할 때마다 아래 명령을 실행하여 스키마 정의를 기반으로 RealmObject를 생성해야 합니다.
flutter pub run realm generate
위의 명령을 watch 옵션과 함께 실행하여 스키마를 업데이트할 때 RealmObject를 생성/업데이트할 수 있습니다.
flutter pub run realm generate --watch
영역 스키마를 업데이트할 때 현재 영역을 삭제해야 합니다. 그렇게 하려면 영역을 열기 전에 아래 코드를 실행하기만 하면 됩니다.
Realm.deleteRealm(Configuration.defaultPath);
이 응용 프로그램의 소스 코드는 여기에서 사용할 수 있습니다.
Realm Flutter
현재 Alpha
단계. Realm은 매우 강력한 생태계이며 애플리케이션을 위한 단순한 오프라인 데이터 저장소 그 이상입니다. MongoDB의 Realm 팀은 다음과 같은 다양한 Realm 기능을 만들기 위해 열심히 노력하고 있습니다. Realm Sync
, Realm Authentication
, Realm Functions
Flutter 개발자가 사용할 수 있습니다.
MongoDB Realm에 대해 더 자세히 알아보려면 여기에서 공식 문서를 방문하세요.
최근댓글