Archiving/Flutter
-
Figma 같은 확대 / 축소 / 이동 구현이 궁금했다Archiving/Flutter 2024. 10. 5. 21:18
"눈에서 멀어지면 마음에서 멀어진다" 라는 말 하나도 틀린게 없다. 막상 구현을 하려고 보니 예전에 어떻게 했더라? 부터 시작된다. 하루종일 Gemini와 수다를 떨다보니 새로운 시각이 눈에 들어왔다. 초심으로 돌아가는 것처럼 하나 하나 글로 작성해보고자 한다. 운이 좋다면 발표도 해봐야겠다. 그래야 머리에 남을테니까. 오늘의 궁금증은 Flutter로 Figma앱을 구현해볼 수 있느냐?이것에 대한 검증을 다룬 이야기다. 내가 만약 피그마를 구현한다면 어떤게 가장 고민스러울까? 생각해봤다.컴포넌트들을 드래그&드롭으로 위치시킨다.화면에 배치된 다양한 컴포넌트들을 확대/축소를 통해 볼 수 있어야 한다.만들어진 컴포넌트들을 소스 코드로 제공해줘야 한다.물론 여러가지가 더 있겠지만 사실상 이 3가지 고민이 가..
-
[마테리얼위젯] 날짜 선택 (DatePicker)Archiving/Flutter 2024. 2. 7. 15:48
요약 설명DatePicker는 사용자로부터 날짜를 입력 받을 수 있는 위젯이다. 가입시 생년월일을 입력 할 때 주로 사용되며 사용자가 직접 입력할 수 있거나 달력형태를 통해 시각적으로 이해가 편한 상태에서 일정을 입력 받을 수 있다. 주요 내용사용자 입력을 대기하고 있기 때문에 비동기 상태(Future)로 DateTime 클래스를 리턴받는다. 아래는 필수적으로 입력받아야 하는 항목들이다.필수 입력 항목BuildContextfirstDate, 선택 가능한 날짜의 범위 중 시작일을 의미한다.lastDate, 선택 가능한 날짜의 범위 중 종료일을 의미한다.생년월일을 입력 받는 경우라면 150년 정도를 기준으로 잡으면 되고, 필터링 조건으로 만드는 경우라면 기획 의도에 맞게 조정하면 된다.DatePicker 처..
-
4화. AI를 이용한 통합테스트 코드 작성Archiving/Flutter 2024. 1. 30. 11:07
원래 일지 같은 느낌으로 글을 작성하려고 했던 건데, 어느 순간 강의 글처럼 쓰고 있었다. 안된다.. 이런 생각을 가지면 큰일난다. 다시금 마음을 돌려서 일지 형태로 글을 작성한다. 검색을 통해 들어오신 분들에게는 다소 죄송하나 블로그의 글 처럼 나의 발자취이다. 내가 어떻게 생각하고 어떻게 검색하고 어떻게 진행했는지를 나타내는 글이라는 것을 다시금 상기시켜주길 바란다. 플러터의 기본적인 것들을 모두 찍먹해봤다. 궁금한게 많지만 처음부터 그 모든 것들을 다 알고 지나갈 수 없지 않은가? 나는 클래스 정의 문서를 살펴보고 개발을 진행하는 사람이 아니었다. (난 설명서를 보지 않지.) 그러다보니 뭘 해볼까? 라는 생각을 계속 가지고 있었다. 그리고 곰곰히 생각하던 차에 '할 일 목록'을 만들어볼까? 라는 ..
-
3화. 플러터 통합테스트 찍먹Archiving/Flutter 2024. 1. 26. 17:50
통합테스트를 진행하는 것을 통해 플러터 기초를 마무리 하려고 한다. 위젯 테스트와 큰 차이가 없다보니 간단하게 몇가지만 집고 넘어가려고 한다. 통합테스트를 위해서는 integration_test 패키지를 추가하면 된다. 플러터에서는 기존에 flutter_driver 패키지를 사용하라고 권장했는데 이제 integration_test 패키지로 전환됐고 마이그레이션을 하라고 말하고 있다. flutter pub add 'dev:integration_test:{"sdk":"flutter"}' pubspec.yaml 에 보면 dev_dependencies 밑으로 integration_test 가 추가된 것을 볼 수 있다. 기존에 존재하던 flutter_drirver는 과감하게 지워주자. 모든걸 다 끝냈다면 pub..
-
2화. 위젯도 테스트 코드부터Archiving/Flutter 2024. 1. 25. 14:13
1화에서는 잠시 머리를 식힐겸 유닛테스트를 진행해봤다. 켄트벡 선생님께서 말씀하신 내용도 잘 따랐고 놀랍게도 책에 나온 것처럼 된다는 사실에 웃음이 나는 경험을 했다. 그럼 이번에는 위젯을 이용한 테스트를 진행해봐야 실전 플러터 TDD라고 생각되지 않을까?! 프로젝트를 처음 생성하면 카운터 샘플이 생성된다. test 폴더에 들어있는 widget_test.dart 를 보면 위젯 테스트 샘플 코드가 들어있다. 설레는 마음으로 가볍게 살펴보자. import 'package:flutter/material.dart';import 'package:flutter_test/flutter_test.dart';import 'package:flutter_widget_test/main.dart';void main() { ..
-
1화. 항상 시작합니다. TDDArchiving/Flutter 2024. 1. 23. 23:07
매년 새해가 되면 회고를 하면서 올해는 꼭! 해보고 싶은게 있었다. 그 버킷리스트 중 하나가 TDD이다. 참고로 매년 제대로된 TDD를 해보겠다고 많은 노력을 했었다. 하지만 번번히 실패했고 바쁜 업무를 이겨내고자 세상과 타협하곤 했다. 이 기록은 다시 기본으로 돌아가 하나 하나 직접 해보고 그 결과를 기록한 일지이다. 혹여나 TDD를 해보고 싶으신 분이 있다면 이 기록이 어디서 멈추는지 지켜봐주길 바란다. (그렇게 어려우니까!!!) 첫번째. 기록을 남기기 위한 Github 저장소를 생성한다. 기왕 시작하는거 Github에 꾸준히 나의 기록을 남겨 나도 남들처럼 잔디 좀 심어보겠다. 라는 생각으로 저장소를 만들었다. 그렇다 과거형이다. 이 글 작성 기준으로 3개월 전에 만들어진 저장소다. 인간적이서 ..
-
[Flutter more:] Navigator 는 페이지 스택을 어떻게 관리하는가?Archiving/Flutter 2024. 1. 18. 23:11
평소 궁금했지만 왠지 시간없어서 지나쳤던 것들을 분석해보는 코너! Flutter more 입니다.오늘은 Navigator 페이지 스택에 대해 분석해보려고 합니다. 이 글에서는 네비게이터 객체에 대한 메카니즘과 프레임워크에 구현된 소스를 분석하는 것으로 네비게이터에 대해 분석한 내용이 작성됩니다.네비게이터(Navigator)?플러터에서 네비게이터('Navigator')는 앱 내의 화면과 이동을 관리하는 위젯입니다. 이 위젯은 화면들을 식별(Routing)하거나 이동 (Navigation) 하는데 필요한 기능을 제공해주고 있습니다. 이름으로 구성된 화면을 식별하여 사용자에게 필요로 하는 요소를 제공 할 수 있으며 화면간 데이터를 전달하고 그 결과를 받아 흐름을 제어 할 수 있습니다. 화면 이동 관리 메카니..