이번 스터디에서는 Flutter를 활용한 '개인 맞춤형 자산 관리(가계부) 앱'을 만들었습니다. 원래 다른 걸 만들어 보려고 했는데 기능이 너무 복잡해서, 먼저 간단한 기능만 모은 앱이 필요했습니다. 이번 프로젝트를 통해 비밀번호(PIN) 잠금, 자산 비중 분석, 자산 증감 추이 등 핵심 기능을 직접 구현해보고, 특히 바이브코딩 방식을 통해 AI와 협업하여 실제 사용 가능한 수준의 앱을 완성하는 것을 목표로 했습니다.
진행 방법
어떤 도구를 사용했고, 어떻게 활용하셨나요?
도구: Flutter 3.x, Dart 3.x, Android Studio, stitch, Gemini
활용 방식:
AI 활용: "자산 비중을 파이 차트로 보여줘", "PIN 번호 입력 로직을 짜줘"와 같이 구체적인 기능을 요청하며 코드를 완성해 나갔습니다.
그래프 구현 집중: 단순히 숫자만 나열하는 게 아니라, 자산 변동 추이와 포트폴리오 비중을 한눈에 볼 수 있는 그래프(Chart)를 구현하는 데 가장 많은 시간을 쏟았습니다.
주요 코드 (PIN 인증 로직): 앱 보안을 위해 구현한 PIN 번호 검증 로직의 일부입니다. 설정된 비밀번호와 입력값이 일치하는지 확인합니다.
Dart
// PIN 번호 검증 및 이동 로직
void _onPinCompleted(String pin) {
if (pin == _savedPin) {
// 인증 성공 시 메인 화면으로 이동
Navigator.of(context).pushReplacement(
MaterialPageRoute(builder: (_) => const HomeScreen()),
);
} else {
// 인증 실패 시 에러 효과 및 초기화
_shakeController.forward(); // 진동 애니메이션
setState(() {
_errorMessage = '비밀번호가 일치하지 않습니다.';
_inputPin = '';
});
}
}
주요 코드 (차트 비율 조정): 그래프가 화면 밖으로 튀어나가는 문제를 해결하기 위해 AspectRatio를 사용하여 비율을 고정했습니다.
Dart
// 차트 크기 조절 예시 (fl_chart)
AspectRatio(
aspectRatio: 1.70, // 가로세로 비율 고정
child: FlChart(
// ... 차트 데이터 및 스타일 설정
),
)
결과와 배운 점
배운 점과 나만의 꿀팁을 알려주세요.
1. 안드로이드 스튜디오 & 에뮬레이터 세팅 이번에 안드로이드 스튜디오를 처음 사용해봤는데, 코드보다 환경 설정이 더 힘들었습니다. 특히 에뮬레이터를 띄우려고 할 때 'Hardware acceleration driver is not configured' 같은 오류가 계속 발생해서 애를 먹었습니다. 드라이버 가속기가 잘못 설정되어 겨우 해결했는데, 개발 환경 세팅이 개발의 절반이라는 말을 실감했습니다.
2. 차트 라이브러리(fl_chart) 핸들링 자산 추이와 비중을 시각화하기 위해 fl_chart를 도입했는데, 처음에는 그래프가 너무 작거나 데이터가 겹치는 문제가 있었습니다.
해결: 무작정 크기를 픽셀로 지정하기보다, 위 코드처럼
AspectRatio위젯으로 감싸서 기기 화면 크기에 상관없이 일정한 비율을 유지하도록 구현했습니다.
과정 중에 어떤 시행착오를 겪었나요?
외부 라이브러리 의존성 누락: 기능 구현에 집중하다 보니
device_info_plus같은 패키지를 코드에만 쓰고pubspec.yaml에 추가하는 것을 깜빡해 빌드 에러를 겪었습니다. AI가 코드를 짜줘도 설정 파일은 사람이 꼼꼼히 챙겨야 함을 배웠습니다.const 키워드 오남용: 습관적으로 위젯에
const를 붙였는데,excel패키지 등 일부 라이브러리는const생성자를 지원하지 않아 에러가 났습니다. 무조건적인const사용보다는 에러 로그를 읽고 대응하는 능력이 길러졌습니다.
앞으로의 계획이 있다면 들려주세요.
핵심 기능인 자산 CRUD, PIN 설정, 그래프 분석 기능은 모두 구현 완료했습니다. 원래 엑셀 내보내기 기능도 시도했으나, 안드로이드 파일 권한 문제 등이 복잡하여 잠시 보류했습니다. UI는 아직 보완해야 할 것 같습니다. stitch를 조금 더 써 봐야 할 것 같습니다. 이런 부분들은 다음 업데이트 때 차근차근 완성해볼 예정입니다.
