본문 바로가기

전체 글

Flutter MVVM 구조 (Officially recommended by Google) 구글이 Flutter 앱 개발을 위한 MVVM(Model-View-ViewModel) 아키텍처를 공식적으로 권장한다고 발표했다. 이 발표는 현대적이고 유지보수가 용이하며 확장 가능한 애플리케이션을 구축하는 데 있어 MVVM의 중요성을 다시 한번 확인시켜주는 중요한 순간으로 평가되고 있다. 구글의 MVVM 아키텍처 공식 권장은 2024년 7월 11일, Flutter 3.27 버전 출시와 함께 발표되었습니다. 이번 블로그에서는 MVVM이 인기를 얻고 있는 이유를 알아보고, 기본 사항을 분석하며, Flutter 프로젝트에서 이 아키텍처를 구현하는 데 도움이 되는 자세한 폴더 구조의 예시를 제공해 보도록 한다. 왜 구글의 권장이 중요한가?당연히 구글꺼니까 이번 구글의 MVVM 지원은 Flutter 개발자들에게 .. 더보기
Flutter에서의 메모리릭 Flutter 애플리케이션에서 메모리 누수란?메모리 누수는 프로그램이 더 이상 필요하지 않은 메모리를 계속 점유하는 현상으로, 애플리케이션이 불필요하게 많은 메모리를 사용하게 만들어 성능 저하, 충돌, 그리고 나쁜 사용자 경험을 초래할 수 있다. 1. 메모리 누수 (Memory Leak) 이란?메모리 누수는 프로그램이 특정 메모리 공간을 더 이상 참조하지 않으면서도, 가비지 컬렉터가 이를 회수하지 못하는 상황을 의미합니다. Flutter에서 메모리 누수는 아래와 같은 상황에서 발생할 수 있다.캐싱된 객체: 사용되지 않는 객체가 메모리에 남아 있는 경우리스너 제거 실패: 리스너를 적절히 제거하지 않아 객체가 계속 참조되는 경우스트림(Stream) 관리 실: 스트림 구독을 제대로 취소하지 않아서 백그라운드에.. 더보기
Flutter 스피드 다이얼 구현 단일 버튼에서 다양한 동작이나 선택 사항을 제공해주는 Speed Dial은 Flutter에서 일반적으로 잘 알려진 FAB(Floatin Action Button) 중 하나이다. 버튼을 탭하면 빠르게 확장되어 더 작은 버튼이나 동작 목록을 발견하여 사용자가 관련 작업을 수행할 수 있도록 한다. 오늘은 flutter_speed_dial 패키지를 소개하는 블로그를 읽고 정리해 보기로 한다. 시작하기Flutter의 Speed ​​Dial은 단일 플로팅 액션 버튼에서 다양한 액션을 처리할 때 사용하기 좋은 방법이다. 아래의 데모를 통해 Flutter에서 Speed ​​Dial을 사용하는 방법과 Flutter 애플리케이션에서 flutter_speed_dial 패키지를 사용하여 Speed ​​Dial이 작동하는 방식.. 더보기
Flutter 웹 로딩 속도 최적화 Flutter로 관리자페이지나 관제페이지와 같은 웹 개발을 하면서 느꼈던 점은 기존에 사용했었던 ReactJS와 비교해서 특별히 아쉬웠던 점은 없지만 초기 로딩 속도가 좀 불만족스러웠다는 것이다. 둘 다 사용했던 입장에서 각각 자신들만의 장단점은 존재하나 이 부분은 확실히 ReactJS쪽의 우세라고 생각한다. (물론 상대적으로 느린 것이지 실제 사용에는 불편함이 없었다.) 오늘은 Flutter에서 웹 로딩 속도 퍼포먼스를 최적화하는데 도움이 되는 블로그를 찾게 되어 정리해 보았다. 1. CanvasKit과 Wasm 렌더링  1) CanvasKit    - Flutter 웹에서 기본 렌더러 중 하나로 사용되며 WebGL을 활용해 고성능과 픽셀 일관성을 제공한다.    - 복잡한 그래픽 애니메이션이 필요한 .. 더보기
Flutter에서 Hooks 사용하기 Flutter에서 Hooks는 UI 로직을 관리하는 새로운 방식으로, 기존의 StatefulWidget을 대체하거나 보완하여 코드의 가독성을 높이고 로직을 간결하게 만들어준다. React에서 처음 도입된 Hooks는 Flutter에서도 비슷한 개념으로 사용되며, 특히 반복적인 초기화 및 해제 작업을 줄이고 재사용성을 높이는 데 유용하다.(단, React Hooks 처럼 공식 지원이 아니고 flutter_hooks 라는 서드파티 패키지 설치를 통해 사용이 가능하다.) Hooks란 무엇인가?1. React에서의 Hooks - 클래스 없이 상태를 관리할 수 있도록 도와주는 기능 - https://honken.tistory.com/140 (예전 React Hooks 정리글)2. Flutter에서의 Hooks -.. 더보기
Dart/Flutter 프로토타입 디자인 패턴 프로토타입 디자인 패턴이란?프로토타입 디자인 패턴은 생성(Creational) 디자인 패턴 중 하나로, 기존 객체를 복제(clone) 하여 새로운 객체를 생성하는 방식이다. 이 패턴은 다음과 같은 상황에서 주로 사용된다.객체 생성 비용이 높은 경우네트워크 호출이나 복잡한 초기화 과정이 필요한 객체를 새로 생성하는 대신 복제하여 효율성을 높일 수 있다.객체의 내부 구조를 보호해야 하는 경우외부 코드가 객체의 내부 구현에 의존하지 않고 복제를 수행할 수 있다.불변 객체(Immutable Object)속성이 변경되지 않는 객체를 복제하여 새로운 값을 가진 객체를 생성할 때 유용하다.프로토타입 디자인 패턴의 장점런타임 시 객체 추가 및 제거새로운 객체 클래스를 시스템에 추가하려면 프로토타입을 등록하면 된다. 이.. 더보기
Flutter 기반 함수형 에러핸들링 Flutter에서의 함수형 에러 처리 Dart 언어는 에러를 처리하기 위해 try, catch, 그리고 throw와 같은 기본적인 메커니즘을 제공한다. 하지만 함수형 프로그래밍(FP)을 활용하면 더 명확하고 안전한 방식으로 에러를 처리할 수 있다. 이 글에서는 Flutter에서 fpdart 패키지의 Either 타입을 활용한 함수형 에러 처리 방법을 소개한다. 함수형 프로그래밍이란? 함수형 프로그래밍(FP)은 다음과 같은 특징을 지닌 프로그래밍 패러다임이다.순수 함수: 동일한 입력에 대해 항상 동일한 출력을 반환하며, 외부 상태를 변경하지 않음불변성: 데이터가 변경되지 않으며, 새로운 데이터는 기존 데이터를 복사하여 생성선언적 스타일: "무엇을" 해야 하는지에 집중하며, "어떻게" 해야 하는지는 추상화이.. 더보기
SOLID 원칙 Flutter 프로젝트에 적용하기 SOLID 원칙은 소프트웨어 개발에서 객체 지향 프로그래밍(OOP)의 설계 원칙으로, 유지보수성과 확장성을 높이며 변경에 따른 부작용을 줄이는 데 도움을 준다. 이 원칙은 2000년 Robert C. Martin(일명 Uncle Bob)에 의해 소개되었으며, 이후 Michael Feathers가 SOLID라는 약어를 만들면서 사용되기 시작했다. 각 원칙과 이를 Flutter 프로젝트에 적용하는 방법을 정리해 보았다. 1. S - 단일 책임 원칙 (Single Responsibility Principle, SRP) 정의: 클래스나 모듈은 하나의 책임만 가져야 하며, 변경의 이유도 하나여야 한다. 책임이란 특정 작업이나 기능을 의미하며, 단일 책임 원칙은 클래스가 너무 많은 기능을 담당하지 않도록 설계하는 .. 더보기

티스토리툴바