몽물고기의 IT 생존기

[Flutter 숙련 TIL ] 책검색 앱 만들기 Part 02 :: OpenAPI 연동하기

목차 Ⅰ. 시작하며 📌 처음 해보는 Open API 연동, 막막함에서 출발 📌구조를 이해하니 머릿속이 정리되기 시작했다 Ⅱ. 실습 요약 및 구성 📌 1. Open API란? 📌 2. NAVER Developers에서 API 등록하기 📌 3. Thunder Client로 API 테스트하기 📌 4. Flutter 프로젝트에서 구현한 구조 Ⅲ. 정리하며 📌 전 연동에서 발생한 실수들 📌 실전처럼 구성해보니 자신감 상승 Flutter에서 네이버 Open API를 활용한 책 검색 앱을 만들며, 실무에서 자주 사용되는 OpenAPI 연동, HTTP 요청 처리, 그리고 MVVM 구조 적용을 학습한 과정입니다.Ⅰ. ✨ 시작하며 처음 해보는 Open API 연동, 막막함에서 출발 책 검색 앱을..

[Thunder Client] Flutter REST API 테스트 도구 추천! VS Code 확장 Thunder Client 사용법과 후기

목차 Ⅰ. 이 프로그램이 무엇인지 📌 1. Thunder Client란? 📌 2. Thunder Client의 탄생 배경 Ⅱ. 어떻게 활용할 수 있을까? 📌 1. Flutter API 연동 전 기능 점검 📌 2. 컬렉션으로 프로젝트별 API 정리 📌 3. Header, Body, Auth 간편 설정 📌 4. 가볍고 빠른 UI – Postman의 대안 Ⅲ. 이 프로그램의 사용 후기 📌 1. Flutter 개발 속도, 정말 빨라졌어요 📌 2. 실무와 팀 프로젝트 모두에 적합 Thunder Client – VS Code에서 바로 API 테스트하기 Flutter로 앱을개발하다 보면백엔드 서버와의REST API 통신이중요한 요소로 떠오릅니다. 특히 외부 서버에서데이터를 받아오거나,회원가입/..

[홈화면 리뉴얼] 시행착오 속에서 피어난 목표 – 캐릭터 스튜디오 앱 개발기

목차 Ⅰ. 오늘 하루의 시작 📌 흐트러진 목표, 다시 잡은 방향 📌 ‘완성’보다 ‘작동하는 흐름’을 만들기 Ⅱ. ⚙️ 오늘의 주요 시행 내용 📌 1. Figma 기초 가이드 특강 참석 📌 2. 앱 UI/UX 설계 – 캐릭터 만들기 앱 홈화면 구성 📌 3. 그림 그리기 + 관절 체크 기능 구현 📌 4. 에셋 스토어 + 장바구니 기능 구현 Ⅲ. 결론 📌 계획보다 ‘속도감’이 중요했다 Ⅰ. 오늘 하루의 시작 흐트러진 목표, 다시 잡은 방향 사실 요즘 들어약간 흔들리고 있었습니다. 어떤 방향으로 앱을 만들어야 할지, 내가 정말 사용자 입장에서 필요로 하는 기능을 구현하고 있는 게 맞는지 계속 고민했거든요. 처음의 열정은 컸지만, 갈수록 기능은 늘고, 시간은 줄어드니 마음이 조급해졌죠. ..

Flutter 개인 프로젝트 – 감정 기반 웹툰 에디터 앱을 시작하며

목차 Ⅰ. Flutter 개인 프로젝트를 시작하며 📌 Flutter를 시작하게 된 계기 📌 왜 감성툰 앱인가? Ⅱ. 프로젝트 주요 내용 📌 1. 앱의 기본 구조 📌 2. 사용자 경험(UX) 고민 📌 3. 시행착오와 배움 📌 4. 앱에 반영한 나만의 요소 Ⅲ. 결론 📌 1. 6월 MVP 완성과 사용자 피드백 📌 2. 향후 기능 고도화 및 런칭 준비 Ⅰ. Flutter 개인 프로젝트를 시작하며 Flutter를 시작하게 된 계기 얼마 전까지 웹툰 자동화 플랫폼을 기획하면서도, 항상 "내가 만든 기획을 직접 구현해보고 싶다"는 생각이 머릿속을 맴돌았습니다. Flutter는 그 첫 시작점이었습니다. 디자인적으로 자유롭고, 모바일 앱에 적합하며, 무엇보다 비전공자도 접근할 수 있다는 점에서 ..

[Flutter 숙련 TIL] 책검색 앱 만들기 Part 01 - (TextField, GridView, BottomSheet, WebView)

목차 Ⅰ. 시작하며 📌 1. 앱을 직접 구성해보기 전, 내가 막혔던 지점들 📌 2. 직접 UI부터 하나씩 만들며 구조를 익힌 시간 Ⅱ. 본론 📌 1. MVVM 구조 잡기: 프로젝트 폴더 설계 📌 2. 검색창 UI 구현: TextField + AppBar 📌 3. GridView 구현: 격자 형태로 책 리스트 구성하기 📌 4. BottomSheet + WebView + DetailPage 연동(+GitHub) Ⅲ. 정리하며 📌 1. 실제 구현하면서 느꼈던 실수들 📌 2. 하나씩 쌓아가는 UI 구현 경험의 힘 Ⅰ. 시작하며 앱을 직접 구성해보기 전, 내가 막혔던 지점들 MVVM 구조를 Flutter에 어떻게 적용해야 할지 막막했습니다. 특히 구조를 나눌 때 어느 기준으로 폴더를 구성해야..

[Flutter 숙련 TIL] 상태관리 패키지 Riverpod 사용법과 MVVM 구조 적용하기

목차 Ⅰ. 들어가며 📌 Flutter 상태관리, 왜 Riverpod인가? Ⅱ. 본론 📌 1. Riverpod이란? 📌 2. 기본 사용법 요약 📌 3. 실전 예제 – "유저 정보를 가져와 화면에 표시하기" 📌 4. 상태유지 전략 – Notifier, AutoDispose, Family (+GitHub) Ⅲ. 정리하며 – 내가 겪은 시행착오와 배운 점 📌 시작하며 📌 Riverpod을 쓰고 나서 달라진 점 Ⅰ. 들어가며 Flutter 상태관리, 왜 Riverpod인가? Flutter를 공부하면서가장 큰 고민 중 하나는바로 “상태 관리”였습니다.기초적인 예제에서는setState()로 해결할 수 있었지만,앱이 커지면 커질수록위젯과 상태가 뒤섞이고 유지보수가 어려워졌죠. 이 때 등장하는..

[Flutter 숙련 TIL] MVVM 아키텍쳐 알아보기 -StatefulWidget 코드 이해

목차 Ⅰ. 서론 📌 1. 한눈에 보기 힘들었던 StatefulWidget 코드 📌 2. 한 번 구조가 잡히면 정말 편해진다 Ⅱ. 본론 📌 1. MVVM이란? – 구조와 역할 분리 📌 2. MVVM vs StatefulWidget 차이점 📌 3. MVVM의 장점 📌 4. Flutter에서의 MVVM 구현 방법 Ⅲ. 결론 📌 1. 처음엔 귀찮고 복잡하지만 결국 더 편해지는 구조 📌 2. Flutter에서의 성장 포인트 Ⅰ. 서론 한눈에 보기 힘들었던 StatefulWidget 코드 Flutter를 처음 접했을 때는 StatefulWidget 하나만으로도 로직부터 상태, UI까지 모두 구현할 수 있어서 나름 만족스러웠어요. 하지만 프로젝트가 커지면서 화면마다 복잡해진 로직이 겹치고, 기능..

[Flutter 트랙 TIL ]데이터 통신 기초와 JSON-Dart에서 배우는 JSON 활용법

목차 Ⅰ. 서론 📌 1. 처음에는 JSON이 어렵게 느껴졌다 📌 2. 시행착오가 주는 학습의 힘 Ⅱ. 본론 📌 1. JSON의 기본 구조와 특징 📌 2. jsonEncode & jsonDecode 📌 3. 클래스를 활용한 JSON 변환 📌 4. 중첩된 JSON 구조 다루기 (+ GitHub 링크) Ⅲ. 결론 📌 1. 단순한 문법 공부를 넘어선 데이터 사고 📌 2. 내가 만든 JSON 변환기가 돌아갈 때의 쾌감 Ⅰ. 서론 처음에는 JSON이 어렵게 느껴졌다 개발을 시작하면서"JSON"이라는 단어는 자주 들었지만,정확히 어떤 역할을 하는지명확하게 와닿지 않았습니다. 단순히 {}와 []로 둘러싸인데이터를 텍스트처럼 보다가,실습을 통해 직접데이터를 주고받고 변환해보면서그 중요성과 구..

목차 Ⅰ. 삼항 연산자 및 Null-aware 연산자가 중요한 이유 📌 삼항 연산자와 Null-aware 연산자가 왜 필요한가? 📌 Null 안정성(Null Safety)을 강화하는 연산자들 Ⅱ. 본론: 삼항 연산자 및 Null-aware 연산자 활용법 📌 Step 1: 삼항 연산자 (condition ? expr1 : expr2) 활용하기 📌 Step 2: Null-aware 연산자 (??) 활용하기 📌 Step 3: Null-aware 연산자 (?.) 활용하기 📌 Step 4: Null-aware 연산자 (??=) 활용하기 📌 Step 5: Null-aware 연산자 (!... null assertion operator) 활용하기 Ⅲ. 삼항 연산자 및 Null-aware 연산자를 효과적으..

목차 Ⅰ. 서론: break와 continue의 역할 이해하기 📌 반복문을 제어하는 이유 📌 break와 continue의 차이점 Ⅱ. 본론: break와 continue의 동작 방식과 활용 예제 📌 Step 1: break의 동작 방식과 예제 📌 Step 2: continue의 동작 방식과 예제 📌 Step 3: break와 continue를 함께 사용하는 예제 📌 Step 4: 중첩 반복문에서 break와 continue 활용하기 Ⅲ. break와 continue를 효과적으로 활용하는 방법 📌 break와 continue의 선택 기준 📌 반복문 최적화 및 성능 고려 사항  break와 continue의차이점 및 사용 예제 🚀🔍  Dart에서 break와 continue는반복문(for..