White Cat's Paw

전체 글 40

[플러터] RiverPod을 사용하여 상품등록+구매버튼 만들어보기

1. Product 클래스 (product.dart)Product 클래스는 각 상품 데이터를 정의한다. 상품명, 수량, 재고 여부를 속성으로 가진다.class Product { final String name; // 상품 이름 final int quantity; // 상품 수량 bool isAvailable; // 재고 여부 // 생성자를 통해 데이터를 초기화한다. Product( {required this.name, required this.quantity, required this.isAvailable}); // 데이터를 복사하면서 일부 속성을 변경할 수 있는 메서드다. Product copyWith({String? name, int? quantity, bool? isAvaila..

[플러터] RiverPod 상태 관리를 활용한 To-Do List 앱 만들기

1. TodoItem 클래스 (todo_item.dart)TodoItem 클래스는 할 일 데이터를 정의한다. 각 할 일은 제목(title)과 완료 여부(isDone)를 속성으로 가진다.// To-Do 데이터를 관리하는 모델 클래스이다.class TodoItem { String title; // 할 일의 제목이다. bool isDone; // 완료 여부를 나타낸다. // 생성자를 통해 데이터를 초기화한다. TodoItem({required this.title, this.isDone = false}); // 새로운 객체를 생성하면서 일부 데이터를 변경할 수 있는 메서드다. TodoItem copyWith({String? title, bool? isDone}) { return TodoItem..

[플러터] RiverPod을 사용한 간단한 버튼 상태관리

1. book.dart 파일book.dart는 Riverpod 창고와 관련된 설정을 관리한다. 데이터를 선언하고, 상태를 관리하는 창고(Notifier)를 생성하고, 이를 Provider에 등록하는 과정이 포함되어 있다.데이터 선언// 창고에 저장할 초기 데이터를 선언한다.String myBook = '홍길동전';창고 생성 (Notifier)// 상태 관리를 위한 창고를 생성한다.class MyBookStore extends Notifier { @override String build() { // 초기 상태 값을 설정한다. return myBook; } // 상태를 변경하는 메서드를 정의한다. void changeData(String book) { state = book; // ..

카테고리 없음 2025.01.22

[플러터] MVVM 아키텍쳐

1. 앱 아키텍처란?앱 아키텍처는 애플리케이션의 전반적인 구조와 구성요소, 그리고 이러한 구성요소 간의 관계와 상호작용을 정의하는 청사진 또는 설계 원칙을 의미합니다. 쉽게 말해, 앱을 구축하는 데 필요한 구성요소와 이러한 구성요소들이 어떻게 함께 작동하고 연결되는지를 설명하는 방법론이라고 할 수 있습니다.MVC, MVP, MVVM, VIPER 등 너무나 많은 아키텍처가 존재 한다. 하지만 원리는 거의 동일 하다.역할 별로 레이어를 나눈다. 각 레이어는 각자의 역할에만 집중하게 설계하고 자신 밖에 업무에서 가능한 신경을 끈다. 각 레이어를 나누게 되면 수정 및 테스트 유지 보수가 용이하다.MVVM 패턴에 대해 알아 보자MVVM 패턴(Model-View-ViewModel)은 소프트웨어 아키텍처 패턴 중 하..

[플러터] MVVM 패턴으로 TODOList 만들기

1. TodoItem 클래스TodoItem은 할 일의 데이터를 관리하는 클래스다. 각 할 일은 제목과 완료 여부를 속성으로 가진다.class TodoItem { String title; // 할 일 제목이다. bool isDone; // 완료 여부를 나타낸다. // 생성자를 통해 데이터를 초기화한다. TodoItem({required this.title, this.isDone = false});} title: 할 일의 제목이다.isDone: 기본값은 false이며, 완료 여부를 나타낸다.2. TodoListViewModel 클래스TodoListViewModel은 할 일 데이터를 관리하고, 로직을 처리하는 클래스다. 할 일을 추가하거나 완료 상태를 변경하는 메서드를 포함하고 있다.import 'p..

[플러터] 상태관리 -2 상태의 종류

상태의 종류 : 로컬, 공유상태는 공유 여부에 따라 로컬(Local State), 공유상태(Shared State)로 나눌 수 있다.로컬 상태(Local State) : 공유되지 않는 상태 BottomNavigationBar의 현재 선택한 탭 공유 상태(Shared State) : 여러 위젯에서 공유되어 표현되는 상태 로그인한 유저 정보 특정 게시글의 좋아요 표시 쇼핑 앱의 장바구니  따라서 공유상태는 상태가 변경될 경우, 동일한 상태를 보여주기 위해 동기화가 필요하다. 상태관리 - 상태관리 : 공유상태가 변경될 때 동기화 하는 것을 의미한다. 필요한 이유 ? 상태관리가 안되면 데이터 일관성을 잃게 됨 ex : 유저가 프로필을 변경해도 다른 화면에서는 이전 프로필이 보이는 문제ex : 쇼핑 카트에 표시된..

[플러터] 상태관리 -1 상태관리란?

Stateless 위젯?  Stateful위젯?Stateless 위젯을 "변화할 수 있는 요소가 없기 때문에 상태가 없다"라고 표현함 Stateless 위젯은 고정된 상태를 가지며, UI를 그릴 때마다 항상 동일하게 지는데 이러한 특성 때문에 데이터나 변수의 값이 변경되지 않는 경우에 적합하다.Statefull 위젯은 반대로 고정된 상태를 가지지 않으며 상태가 변할 수 있으며 그에 따라 UI가 변경 된다. 핵심 즉 Stateless vs StatefulStateless: 상태가 없고 UI가 항상 동일함. (예: 고정된 텍스트, 단순 버튼)Stateful: 상태가 변할 수 있으며, 그에 따라 UI가 변경됨. (예: 버튼 클릭 시 증가하는 카운터) 상태란?상태는 변수에 할당된 값임. Stateful 위젯에서..