최신 글

Package 2023.07.20 17:43

Flutter Riverpod Concepts(6-2) - Reading a Provider

이 가이드를 읽기 전에 먼저 Provider에 대해 읽어보시기 바랍니다. 2023.07.18 - [Flutter/Package] - Flutter Riverpod Concepts(6-1) - Providers 이 가이드에서는 Provider를 사용하는 방법을 살펴봅니다. "ref" 객체 가져오기 무엇보다도 provider를 읽기 전에 "ref" 객체를 가져와야 합니다. 이 객체를 통해 위젯이나 다른 provider와 같은 provider와 상호 작용할 수 있습니다. provider로부터 ‘ref' 받기 모든 provider는 매개변수로 "ref"를 받습니다: final valueProvider = Provider((ref) { // 다른 provider를 얻으려면 ref를 사용하세요. final repo..

Package 2023.07.18 21:01

Flutter Riverpod Concepts(6-1) - Providers

Providers 이제 Riverpod를 설치했으니 " provider"에 대해 이야기해 보겠습니다. Provider는 Riverpod 애플리케이션에서 가장 중요한 부분입니다. provider는 상태의 일부를 캡슐화하고 해당 상태를 수신할 수 있도록 하는 객체입니다. 왜 Provider를 사용해야 하나요? provider안에 상태 부분을 넣습니다: 여러 위치에서 해당 상태에 쉽게 액세스할 수 있습니다. Provider는 Singleton, Service Locator, Dependency Injection 또는 InheritedWidgets와 같은 패턴을 완전히 대체합니다. 이 상태를 다른 상태와 결합하는 작업을 단순화합니다. 여러 개체를 하나로 병합하는 데 어려움을 겪은 적이 있으신가요? 이 시나리오는..

인기 글

Package 2023.07.16 22:25

Flutter Riverpod All Providers (5-2) - (Async)NotifierProvider

NotifierProvider는 Notifier를 수신하고 노출하는 데 사용되는 제공자입니다. AsyncNotifierProvider는 비동기 Notifier를 수신하고 노출하는 데 사용되는 provider입니다. 비동기적으로 초기화할 수 있는 Notifier입니다. (Async)NotifierProvider와 함께 Riverpod가 사용자 상호작용에 반응하여 변경될 수 있는 상태를 관리하기 위해 권장하는 솔루션은 (Async)Notifier입니다. 일반적으로 다음과 같은 용도로 사용됩니다: 사용자 정의 이벤트에 반응한 후 시간이 지남에 따라 변경될 수 있는 상태를 노출합니다. 일부 상태(일명 '비즈니스 로직')를 수정하는 로직을 한 곳에 집중시켜 시간이 지남에 따라 유지 관리성을 개선합니다. 예시로 N..

Package 2022.10.14 18:18

Flutter native splash screen 라이브러리

이번 글은 Splash Image이 어떤 것이고 flutter native splash 라이브러리를 사용하여 iOS, Android 두 개를 어떻게 구현하는지 에 대한 글입니다. Splash Screen? "Flutter 공식 홈페이지에서는 앱이 로딩되는 동안에 심플한 초기 경험을 제공합니다"라고 적혀있습니다. 여기에서 말하는 심플한 초기 경험(Simple initial experience)은 여러 내용을 담고 있습니다. 예를 들어, 사용자 입장에서 실행하고 싶은 앱이 맞는지 확인할 수 있는 시간이 될 수 있습니다. 그리고 앱을 제공하는 회사 입장에서는 자신의 회사의 정체성과 사용자에게 첫인상을 보여줄 수 있는 수단이기도 합니다. 이밖에도 개발자 입장에서는 앱이 로딩되는 시간 동안 백엔드 단에서 사용자의..

Document 2022.05.05 00:14

Flutter text over flow 적용안될때

개발을 하다 보면 text가 밀릴 때가 발생한다. TextScale을 설정하지 않았을 때 TextScale을 고정시키게 되면 시스템에 설정된 폰트 크기가 적용되지 않는다. 이는 눈이 침침해서 작은 글씨가 잘 안보이시는 어르신들이 사용하는 앱 같은 경우에는 글자가 잘 안 보이는 불편함을 야기시키기 때문에 대체적으로 눈이 침침하신 어르신들이 사용하는 앱을 개발하는 경우에는 안 하는 것이 좋다고 생각한다. 작은 width를 가진 스마트폰으로 발생하는 overflow text의 길이가 초과될 때 그래서 이를 해결하기 위해 나는 아래와 같은 코드 블록을 사용했었다. 하지만 overflow가 적용되지 않았다. Text 길이가 길어짐에 따라 Text 위젯은 확장된다 이로 인해 Text위젯 옆에 있는 위젯을 밀어버려 ..

Document 2022.08.25 17:57

Flutter Web App 개발 하면서 느낀 문제점

Web App 개발하면서 느낀 점 과 실수했던 점을 기록해보려고 합니다. 해당 경험은 로박스 Web App 개발하면서 느낀 점을 토대로 작성되었습니다. Flutter Web App 문제점 1. SEO 불가 SEO(검색 엔진 최적화)는 웹사이트가 검색 결과에 더 잘 보이도록 최적화하는 과정입니다. Flutter Web App은 검색 엔진(구글, 네이버)에 노출이 되지 않습니다. Flutter 로 개발되지 않는 웹의 경우 개발자 도구를 켜서 Element Inspect 텍스트를 눌러보면 해당 텍스트가 Select 됩니다. 하지만 Flutter Web App의 경우는 Web App 전체가 Selecte 됩니다. 이는 검색 엔진이 Flutter Web App을 읽을 수가 없다는 것입니다. 공식적으로 SEO를 지..

Document 2022.05.09 15:58

Dart shallow copy와 deep copy 비교 (class, list)

개발을 하다 보면 변수를 copy 할 일이 생긴다. 그런데 오랜만에 copy를 사용할 일이 생겨 사용을 하다 보니 shallow copy와 deep copy에 대해 까먹고 개발을 하다가 다시 공부하게 되었다. 그래서 Shallow, Deep Copy에 대해 정리해보려고 한다. Shallow Copy class Person { String? name; int? age; Person(this.name, this.age); } void main() { Person personA = Person('사람A',20); // instance 생성 // 본인은 여기서 deep copy가 될 것이라고 생각하고 코드를 작성했었다. Person personB = personA; // personB 에 personA의 ins..

Widget 2022.05.06 19:37

Flutter Drawer Widget 문서(DrawerHeader, width 조절, SafeArea)

Drawer 흔히 앱 왼쪽 상단의 메뉴 아이콘을 터치하면 오른쪽 사진과 같이 나온다. 이것이 Drawer 위젯이다. overflow를 생각해서 ListView, SingleChildScrollView를 사용한다. physics: const NeverScrollableScrollPhysics() 을 추가해서 over scroll glow effect를 제거할 수 있다. SafeArea를 사용해 Drawer 위젯이 스마트폰 상단바랑 겹치는 것을 방지할 수 있다. Drawer 위젯을 Container로 Wrap한 후 width 속성을 추가하여 크기 조절이 가능하다. + 배달의 민족 앱 같은 경우 화면을 온전히 덮었다. Drawer package 이 밖에도 pub.dev에 검색하면 여러 스타일의 drawer p..