Mobile on philipjkim

크로스플랫폼 To-Do 앱 만들기 Part 4: UI 다듬기와 빌드/배포

Wed, 01 Apr 2026 09:12:52 +0900

이 글은 Claude Opus 4.6 을 이용해 초안이 작성되었으며, 이후 퇴고를 거쳤습니다.

시리즈 목차

Part 1: Flutter 소개와 개발 환경 설정
Part 2: 기본 UI 구성과 상태 관리
Part 3: 로컬 저장소 연동과 CRUD 완성
Part 4: UI 다듬기와 빌드/배포 (이번 글)

Part 3 회고

Part 3까지 진행하면서 할 일의 추가, 수정, 삭제, 완료 토글 기능과 로컬 저장소 연동까지 모두 구현했습니다. 기능적으로는 완성된 상태이지만, 실제로 사용자에게 배포하려면 몇 가지 더 다듬어야 할 부분이 있습니다.

크로스플랫폼 To-Do 앱 만들기 Part 3: 상태 관리와 로컬 데이터 저장

Wed, 01 Apr 2026 09:11:52 +0900

이 글은 Claude Opus 4.6 을 이용해 초안이 작성되었으며, 이후 퇴고를 거쳤습니다.

들어가며

Part 2에서는 Flutter 위젯을 활용해 To-Do 앱의 UI를 구성했습니다. 할 일을 추가하고, 완료 처리하고, 삭제하는 기본 기능까지 구현했는데요. 한 가지 치명적인 문제가 있었습니다. 앱을 종료했다가 다시 실행하면 모든 데이터가 사라진다 는 점입니다.

setState로 관리하던 List<Todo> 는 메모리에만 존재하기 때문입니다. 이번 Part 3에서는 Riverpod 을 사용한 상태 관리 리팩토링과 sqflite 를 이용한 로컬 데이터 영구 저장을 구현합니다.

1. setState의 한계

Part 2에서 사용한 setState는 간단한 프로토타입에는 충분하지만, 앱 규모가 커지면 여러 문제가 생깁니다.

크로스플랫폼 To-Do 앱 만들기 Part 2: Flutter 기초와 UI 구현

Wed, 01 Apr 2026 09:10:52 +0900

이 글은 Claude Opus 4.6 을 이용해 초안이 작성되었으며, 이후 퇴고를 거쳤습니다.

들어가며

Part 1에서 Flutter SDK 설치, 에디터 설정, 에뮬레이터 구성 등 개발 환경을 갖추었습니다. 이제 본격적으로 코드를 작성할 차례입니다.

이번 Part 2에서는 Dart 언어의 핵심 문법을 빠르게 훑어본 뒤, Flutter의 위젯 시스템을 이해하고, 실제로 동작하는 To-Do 리스트 앱의 UI를 구현합니다. 이 글을 따라 하면 할 일을 추가하고, 완료 표시하고, 삭제하는 기본 기능이 모두 갖춰진 앱을 만들 수 있습니다.

크로스플랫폼 To-Do 앱 만들기 Part 1: 프레임워크 선택과 개발 환경 설정

Wed, 01 Apr 2026 09:09:52 +0900

이 글은 Claude Opus 4.6 을 이용해 초안이 작성되었으며, 이후 퇴고를 거쳤습니다.

시리즈 소개

이 시리즈에서는 Flutter 를 사용하여 크로스플랫폼 To-Do 앱을 처음부터 끝까지 만들어 봅니다. 하나의 코드베이스로 Android, iOS, 그리고 웹까지 동작하는 앱을 완성하는 것이 목표입니다.

시리즈는 총 4개의 파트로 구성됩니다.

Part 1 (이번 글) : 프레임워크 선택과 개발 환경 설정
Part 2: UI 구성과 기본 기능 구현
Part 3: 상태 관리와 로컬 데이터 저장
Part 4: 마무리, 테스트, 빌드 및 배포

각 파트는 실습 중심으로 진행됩니다. 따라해 보시면서 자연스럽게 Flutter 개발의 흐름을 익히실 수 있습니다.