Juwon

모바일 앱 개발을 하게되면 필요한 구조와 패턴이 있습니다. Andriod, iOS, Flutter 모두 최종 기능은 같습니다. 앱을 개발한다면 앱의 확장성과 유지보수의 편의성을 고려해 적용하는 아키텍처는 다양하지만 많이 쓰이는 아키텍처 MVVM을 소개하려합니다. Flutter 특성에 맞는 MVVM 디자인 패턴을 적용하여 사용하는 것이 목적입니다. Flutter MVVM (Model View ViewModel) 3가지 레이어로 구성된 패턴입니다. 각 레이어별 역활을 파악하고 Data와 Action의 흐름을 일관되게 구현한다면 확장성있고 이해하기 쉬워지며 유지보수의 편의성이 좋은 앱을 만들 수 있게 됩니다. View Layer UI/UX요소로 구성된 다양한 위젯으로 화면을 구성하는 레이어입니다. (시각적인 ..

이번 포스팅에서는 Flutter에서의 Widget의 LifeCycle에 대해 알아보겠습니다. Flutter에서 위젯 종류인 Stateless Widget과 Stateful Widget은 서로 다른 LifeCycle을 가지고 있습니다. 소스 코드와 함께 알아보겠습니다. Stateless Widget LifeCycle Stateless Widget은 단순히 화면을 구성하는 위젯이므로 단순한 생명주기를 가지고 있습니다. Stateless Widget의 Constructor flutter에서 위젯은 기본적으로 클래스를 사용하여 생성합니다. 위젯은 기본적으로 클래스로 구성이 되어있기 때문에 클래스의 생성자를 사용할 수 있습니다. 위젯의 생성자와 클래스의 생성자는 동일한 역할을 가지며 마찬가지로 해당 위젯 안에서 ..

이번 포스팅에서 알아볼 내용은 Flutter 프레임워크에서 자주 사용되는 UI Widget입니다. Stack Widget 하나의 위젯 위에 다른 위젯을 쌓아올릴 때 사용하는 위젯입니다. (겹쳐 사용할 수 있습니다.) Stack API를 이용해 화면의 경계에서 정확히 원하는 위치에 위젯을 추가할 수 있습니다. 주로 Stack Widget을 이용해 Background, 배경화면, 현재 시간 등을 그릴 수 있습니다. 위치를 지정하지 않은 child Widget을 Column이나 Row가 자식을 취급하는 것 처럼 처리합니다. (자식 위젯을 왼쪽 위 모서리로 정렬하여 나란히 놓습니다.) alignment Property로 정렬 방향을 설정합니다. ( align-content : 방향 설정과 유사합니다. ) Pos..

이번 포스팅에서 알아볼 내용은 Flutter의 Widget입니다. Flutter의 모든 위젯은 다루지는 않습니다. 하지만 필요한 위젯을 찾는 방법에 대해 학습하고 주로 사용하는 위젯을 알아볼 수 있습니다. Flutter는 위젯으로 시작하고 위젯으로 끝나는 프레임워크이며 Flutter의 위젯은 웹에서의 HTML Element로 취급한다면 간단히 이해할 수 있습니다. Widget?? Flutter는 위젯이 전부다라고 말해도 될 정도의 중요도를 가지고 있습니다. 화면에 표시되는 모든 요소가 위젯이며 눈에 보이지 않지만 화면을 구성하는 Layout도 위젯입니다. 위젯은 크게 두가지로 분류할 수 있습니다. Stateful Widget Stateles Widget 각각의 위젯을 살펴보겠습니다. Stateful Wi..

이번 포스팅에서는 Dart Factory Constructor에 대해 알아보겠습니다. factory dart의 factory 키워드는 flutter에서 모델 클래스를 만들 때 자주 사용되는 예약어입니다. JSON 직렬화 예제 코드와 함께 factory를 알아보겠습니다. // build runner에게 Human 클래스가 JSON 직렬화 로직이 구성되어야 한다고 미리 선언하는 어노테이션입니다. @JsonSerializable Class Human { final String gender; final String age; final String name; Human({required this.gender, required this.age, required this.name}); // Map에서 새로운 Huma..

이번 포스팅에서 알아볼 내용은 Flutter 3.0 버전의 변경 사항입니다. 5월 13일 Google I/O를 통해 Flutter 3.0 버전이 릴리즈 되었습니다. ( Dart도 버전업이 되었습니다. ) Flutter 3.0 버전 변경 사항 1. Apple Silicon의 Fully Native 지원 기존 Flutter에서는 Rosetta등을 통해 간접적으로 Fully 지원하였습니다. Flutter 3.0버전에서 부터는 빌드 할 때 ARM칩을 지원하는 빌드를 별도로 추가 지원하며 Flutter 프레임워크가 애플 실리콘에서 작동되기 때문에 속도도 이전 버전보다 빨라지게 되었습니다. 2. Yaru Ubuntu를 만드는 회사 Canonial에서 Yaru Design Language를 Pub.dev를 통하여 지..

이번 포스팅에서 다룰 내용은 Flutter와 Dart입니다. 🎯 Dart? 다트는 2011년 10월 GOTO 콘퍼런스에서 구글이 공개한 객체지향 프로그래밍 언어입니다. 구글이 멀티 플랫폼 상에서 동작되도록 하는 앱을 위해 디자인되었습니다. 기본적으로 C언어의 문법과 거의 유사하며 간결하고 강력한 기능을 지원합니다. Dart의 용도는 모바일, 데스크톱, 서버, 웹 앱 용도로 사용됩니다. Dart는 DVM( Dart VM )상에서 동작하거나 네이티브 컴파일링을 통해 모바일, 데스크톱, 브라우저, 서버 플랫폼 상에서 애플리케이션을 실행하고 지원합니다. Dart의 유연한 컴파일링 덕에 대상 플랫폼 및 목적에 따라 다양한 방식으로 실행할 수 있습니다. Dart Native 모바일, 데스크톱, 서버, 임베디드를 대..