728x90
728x90

Flutter (앱 개발)/Flutter 트랙 7

[Flutter 숙련 TIL] 블로그 앱 만들기2 Firebase Firestore 사용 + Flutter에 Firebase 연동 + UI 구성까지(+예시 파일 제공)

목차 Ⅰ. 시작하며 📌 개념은 쉬운데, 실전에선 시행착오의 연속 📌 NoSQL 구조와 데이터 설계 Ⅱ. 본론 📌 1. Firebase 프로젝트 생성과 Firestore 세팅 📌 2. Firestore 데이터 저장 구조 📌 3. Firebase Storage와 이미지 처리 방식 📌 4. 실시간 반영을 위한 Stream 처리 Ⅲ. 정리하며 📌 Firebase의 위력을 실감 📌 MVVM 구조와 잘 어우러지는 느낌 🟣 시작하며 – Firebase를 처음 접했을 때의 느낌 개념은 쉬운데, 실전에선 시행착오의 연속 Firebase는 '서버 없이 앱을 만들 수 있다'는 간단한 소개와 달리, 실제로 연동해보니 익숙하지 않은 구조와 많은 설정 항목들이 처음엔 부담스럽게 다가왔습니다. 특히 Fires..

[Flutter 숙련 TIL] 블로그 앱 만들기1 MVVM 구조 + UI 구성까지(+예시 파일 제공)

목차 Ⅰ. 시작하며 📌 MVVM 구조에 적응 📌 Form 유효성 검사와 텍스트 컨트롤러 Ⅱ. 본론 📌 1. 전체 폴더 구조 및 기초 뼈대 작업 📌 2. HomePage 구성 – 리스트와 앱바, ListView 기본 UI 📌 3. etailPage – 아이콘 재사용과 텍스트 본문 구성 📌 4. WritePage – TextFormField와 Form 구조 잡기(GitHub link) Ⅲ. 정리하며 📌 TextFormField와 키보드 UX 고려 📌 구조화된 설계의 중요성 ✍ 시작하며 MVVM 구조에 적응하는 데 시간이 걸렸다 블로그 앱을 만들기 전, MVVM 아키텍처와 폴더 구조를 나누는 데 많은 고민을 했습니다. 특히 View와 ViewModel을 어떤 기준으로 나..

[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 연동, 막막함에서 출발 책 검색 앱을..

[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"이라는 단어는 자주 들었지만,정확히 어떤 역할을 하는지명확하게 와닿지 않았습니다. 단순히 {}와 []로 둘러싸인데이터를 텍스트처럼 보다가,실습을 통해 직접데이터를 주고받고 변환해보면서그 중요성과 구..

728x90
728x90