전체보기

https://riverpod.dev/docs/essentials/first_request Make your first provider/network request | RiverpodNetwork requests are the core of any application. But there are a lot of things to consider whenriverpod.dev1. 리버팟으로 네트워크 요청하기 - Make your first provider/network request1-1. Riverpod을 사용하려면 앱 최상단에 ProviderScope를 추가해야한다. - Setting up ProviderScopeProviderScope는 Riverpod의 상태 저장소 역할을 한다. 즉 각 Provid..

구현한 드랍다운 메뉴Flutter에서 드롭다운 메뉴의 구현 원리Flutter에서 드롭다운 메뉴는 사용자가 선택 가능한 목록을 제공하는 UI 요소다. DropdownButton, DropdownButtonFormField, 그리고 dropdown_button2 패키지를 활용하면 기본적인 드롭다운을 쉽게 구현할 수 있다. 하지만 서드파티를 쓰기에 앞서 구글이 구현한 드랍다운 버튼이 내부적으로 어떻게 동작하는지, dropdown_button2  패키지를 통해 어떤 최적화 포인트를 찾을 수 있는지 알아보자~ 😆 1. 기본적인 위젯 계층Flutter의 DropdownButton은 기본적으로 다음과 같은 계층 구조를 가진다.DropdownButton├─ StatefulWidget (_DropdownButtonSt..

구현 목표 🧐하단버튼이 키보드에 가려지지 않게 사진과 같이 키보드 높이에 맞춰 버튼을 올려보자. 아래 설명은 이해를 돕기위해 간단한 예제 코드로 진행해보았다.bottomNavigationBar: SafeArea( child: ElevatedButton( onPressed: () {}, child: Text("다음"), ),), 현재 코드는 네비게이션 바에 버튼을 배치하고 SafeArea 여백만 주고 있을 뿐 키보드가 올라와버리면 그대로 버튼을 가리게 되어버린다. 여기서 MediaQuery.of(context).viewInsets.bottom을 사용하면 키보드 높이를 감지하여 버튼을 자동으로 올릴 수 있다.bottomNavigationBar: AnimatedPadding( duration..

Flutter에서 Bloc 패턴을 사용할 때, 스트림을 다룰 일이 많다. 이 과정에서 forEach와 onEach라는 두 가지 메서드를 사용하게 되는데 처음에는 둘의 차이를 잘 몰랐다가 이번기회에 두 메서드의 차이점을 정리해보았다. 차이점을 알아보기전에 먼저 공통점부터 알아보자1. 공통점✅ 스트림(Stream) 기반의 데이터 처리forEach와 onEach는 모두 스트림에서 데이터를 받아 처리하는 메서드이다. 따라서, Stream을 활용하는 비동기 로직에서 주로 사용된다.✅ emit()을 활용한 상태 관리 가능두 메서드 모두 emit()을 통해 Bloc의 상태를 업데이트하는 것이 가능하다. (하지만 onEach에서는 상태 변경이 기본적으로 이루어지지 않으며, forEach는 상태 변경을 자동으로 처리한다..

일단 한국에서만 서비스하고 해외는 먼미래라 지역화 기능을 넣기 귀찮아서 계속 UI작업을 진행하다 급기야 데이터 피커와 텍스트 필드의 날짜 형식이 안맞는 지경에 이르렀다. (현재 내 아이폰은 영어로 설정해둔 상태)더이상 지역화 작업을 미룰 수 없기에 날잡아서 블로그에 정리도하고 프로젝트에 지역화 기능을 구현해보기로 했다.01.  intl 패키지와 flutter_localizations 넣어주기 먼저 intl 과 flutter_localization 패키지를 추가해야한다. 패키지 추가할 때 주의할 점은 flutter_localization은 flutter sdk 내부에 포함된 패키지라 flutter pub add 명령어로 못집어넣는다. yaml 파일가서 직접 위와 같이 넣어준다. 그렇다면 왜 패키지 두 개가..

이전에 쓰던 계정이 아닌 다른 iOS계정으로 등록된 프로젝트를 실기기로 돌렸다가 위와 같은 에러가 떳다. 에러원인은 프로젝트에 등록된 디벨로퍼 팀 계정이 현재 내 xcode 계정과 다르기 때문에 에러가 발생한 것으로 추정되었다, 이를 해결하기 위해 아래와 같은 프로세스를 진행하면 ios 실기기 테스트가 가능해진다.01. Xcode로 가서 해당 계정 로그인 -> 팀등록후 Automatically manage signing을 체크해준다. 02. Apple Developer 에 들어가서 내 기기 identifier 를 등록해준다. 이때 내 기기 id는 앞선 에러코드에서 확인할 수 있다 03. flutter clean 해주고 IDE를 껏다 다시킨다다시키면 flutter pub get -> ios pod inst..

이름을 입력하고 생년월일을 피커뷰를 띄웠다가 바깥부분을 눌러 피커뷰를 내리면 키보드가 갑자기 다시 올라와버리는 이슈가 발생했다.🧐 문제원인문제 발생 플로우를 살펴보자면 위와 같다. 요점은 텍스트필드 포커싱이 유지된채로 바텀시트가 올라와버려 바텀시트가 닫히자마자 바로 유지되었던 텍스트 필드 포커싱 때문에 불필요하게 키보드가 올라오는 것이었다.🥲 문제 해결 1차 시도 (실패)처음에는 외부 탭했을 때 키보드가 사라지는 코드를 모든 텍스트필드마다 작성해주는게 중복된다고 생각해서 애초에 최상위 MaterialApp 위젯에서  키보드 외부를 탭하면 포커싱을 해제하는 코드를 적었다. 이때 HitTestBehavior.opaque 를 주어 다른 위젯이 터치이벤트를 가져가더라도 상위 위젯이 이벤트를 받아 포커싱을 해..

프로젝트를 진행하다보면 고칠 수 있는 노란색 주의문구를 미쳐 발견못하고 커밋-푸시하거나 라인 정렬을 자주 까먹곤한다. 이러한 사소한 녀석들이 각 브랜치에 축척되고 브랜치를 변경해서 작업을 하게되다보면 종국엔 컨플릭트의 근원이 되기도 한다. 이러한 사소한 것들을 바로잡아줄 시스템을 고민하게 되었고 깃훅을 이용해 팀원 간 포맷팅이나 경고 에러잡기 같은 룰을 강제시킬 수 있는 방법을 알게되었다.1. Githook 이란?Git Hook은 Git의 특정 이벤트(예: commit, push, merge)가 발생할 때 자동으로 실행되는 스크립트이다. 이를 활용하면 CI/CD 없이도 개발자 로컬 환경에서 특정 룰을 강제하거나, 자동화된 워크플로우를 실행할 수 있다.  Hook 이름실행시점주요 목적활용 예시pre-com..

현재 API문서에서 생년월일을 보낼 때 String타입이기는 하지만 YYYY-MM-DD 날짜 형식을 지켜서 보내지 않으면 바로 서버에서 에러를 보내주는 상태였다.  물론 Presentation Layer에서 텍스트필드에 정규식을 넣고 아예 입력값 자체를 형식에 맞는 것만 데이터 레이어로 보내는 방법도 있었지만 가장 확실한 방법은 DTO레벨에서 형식을 검증하는 것이라고 생각했다. 플러터에서 어떻게 DTO에서 형식을 검증할 수 있을까? 현재 나는 DTO를 JsonSerializable 패키지를 통해 직렬화/역직렬화 작업을 수행하고 있다. birthday 프로터피도 다른 프로퍼티와 마찬가지로 선언해주고 위 코드와 같이 함수선언과 프로퍼티 위에 코드 한줄을 더 넣어주면 된다. 위 코드의 의미를 구체적으로 살펴보..

API 문서를 확인해보 응답코드와 데이터로 네스팅되어있는 구조로 되어었는 동일한 response dto 구조를 파악할 수 있었다. 따라서 매번 같은 구조를 반복해서 코드로 DTO를 선언하기보다 BaseResponse 모델을 만들어 선언해보기로 했다. 1. BaseResponseDto먼저 대부분의 API 응답은 아래와 같은 공통적인 구조를 가진 상황이다{ "code": 200, "data": { "id": 1, "phone": "1234567890", "email": "test@example.com", "name": "John Doe" }}이를 Flutter에서 BaseResponseDto 형태로 관리하면 모든 API 응답을 재사용할 수 있다 . 위와같이 공통구조를 짜주어 dto..