블로그 프로젝트 - 모델 클래스 설계

Flutter 에서 모델(Model)은 주로 데이터를 나타내는 역할을 합니다. 이 모델은 데이터베이스의 테이블, API응답, 애플리케이션의 내부 상태 등 다양한 형태의 데이터를 나타낼 수 있습니다. MVVM 패턴에서의 모델은 아래와 같은 특징 및 역할을 갖습니다.

 

데이터의 구조 : 모델은 주로 데이터의 구조를 정의합니다. 예를 들면 사용자의 이름, 이메일, 날짜 등의 필드를 갖는 'User' 클래스와 같은 것을 말합니다.

 

비즈니스 로직 : 모델은 때때로 비즈니스 로직을 포함하기도 합니다. 예를 들면, 사용자가 유효한지 확인하거나, 연봉을 계산하는 등의 로직이 포함될 수 있습니다. 

 

데이터 변환 : 위에서 본 것처럼 JSON 데이터를 앱의 객체로 변환하거나, 반대로 앱의 객체를 JSON으로 변환하는 로직도 모델에서 처리됩니다.

 

Flutter에서 모델은 이러한 의미로 사용됩니다. 따라서 Flutter 앱 개발 시 모델이라고 언급되면 데이터와 관련된 클래스나 객체를 떠올리면 됩니다. 

 

1. 모델이란?

모델은 데이터의 구조를 정의하는 클래스입니다.

// 서버에서 온 JSON
{"id": 1, "username": "ssar"}

// 모델로 변환
User user = User.fromMap(jsonData);
print(user.username); // "ssar"

 

2. User 모델 만들기

data/models/user.dart 파일을 생성합니다.

// User 모델 클래스 설계
// API 문서 기준으로 설계해 볼 수 있다.

class User {
  int? id; // API 에서 누락될 수 있다.
  String? username;
  String? imgUrl; // 프로필은 선택사항
  String? accessToken;

  User({
    this.id,
    this.username,
    this.imgUrl,
    this.accessToken,
  });

  // json to Dart 변환 생성자
  // dart 문법. 이름이 있는 생성자
  // dart 에서 json 문자열을 convert 패키지에서 Map 구조 변환
  // User() 객체를 생성해주는 코드이다.
  User.fromMap(Map<String, dynamic> data)
      : id = data['id'],
        username = data['username'],
        imgUrl = data['imgUrl'],
        accessToken = data['accessToken'];

  // 디버깅용 문자열 표현
  @override
  String toString() {
    return 'User{id: $id, username: $username, imgUrl: $imgUrl, accessToken: $accessToken}';
  }
}

 

핵심 포인트:

• ?: null일 수 있는 필드
• fromMap: JSON을 객체로 변환하는 생성자

Post 모델 클래스 설계

import 'package:flutter_blog/data/models/user.dart';

class Post {
  // TODO - (댓글은 추후 추가)
  int id; // 게시물 ID
  String title;
  String content;
  DateTime createdAt; // 생성일시
  DateTime updatedAt; // 수정일시
  User user; // 작성자 (관계형 데이터)
  int bookmarkCount; // 북마크 수

  // 현재 사용자의 북마크 여부 (로그인 상태에 따라 달라짐)
  bool? isBookmark;

  Post({
    required this.id,
    required this.title,
    required this.content,
    required this.createdAt,
    required this.updatedAt,
    required this.user,
    required this.bookmarkCount,
    this.isBookmark,
  });

  // User.fromMap(..)
  // 문자열을 DateTime 형변환 처리 해주어야 한다.
  Post.fromMap(Map<String, dynamic> data)
      : id = data['id'],
        title = data['title'],
        content = data['content'],
        createdAt = DateTime.parse(data['createdAt']),
        updatedAt = DateTime.parse(data['updatedAt']),
        isBookmark = data['isBookmark'],
        user = User.fromMap(data['user']),
        bookmarkCount = data['bookmarkCount'];
}