728x90 반응형 Frontend38 [flutter] 블로그 만들기 03 Json 타입보통 서버에서 문자열 형식 JSON 던져 줄 때 , 크게 사용하는 두가지 타입이 있다.Json Object 타입{ "status": "success", "users": \[ { "username": "ssar", "password": 1234 }, { "username": "cos", "password": 5678 } \] }Json Array 타입\[ { "username": "ssar", "password": 1234 }, { "username": "cos", "password": 5678 } \]플러터에서 파싱하는 형태JSON Object → Map 형태로 받아 바로 사용.JSON Array → List> 형태로 받아 바로 사용.DTO를 만들어서 활용가능, 또는 바로 모델 클래스로 변환.. 2025. 2. 3. [flutter] 블로그 만들기 02 - 로그인 페이지 구성하기 기본 파일 (이미지)로그인 ui 환경 구현하기디자인 시안1. assets 허용하기assets: - assets/2. 폴더 구조3. Login pageimport 'package:flutter/material.dart';import 'widgets/login_body.dart';class LoginPage extends StatelessWidget { const LoginPage({super.key}); @override Widget build(BuildContext context) { return LoginBody(); }}4. login bodyimport 'package:class_f_story/_core/constants/size.dart';import 'package:class_f_.. 2025. 2. 3. [flutter] 블로그 만들기01 - 프로젝트 기본설정 의존성cupertino_icons: ^1.0.8flutter_svg: ^2.0.6intl: ^0.18.1dio: ^5.2.0 # 서버와 통신하기 위해 필요한 라이브러리 입니다.flutter_riverpod: ^2.3.6 # 상태관리 Riverpod 라이브러리 입니다.logger: ^1.3.0 # 콘솔창에서 결과물을 쉽게 확인할 수 있도록 하는 Log 라이브러리입니다.flutter_secure_storage: ^8.0.0 # 어플리케이션 Secure Storage를 쉽게 사용할 수 있도록 도와주는 라이브러리입니다.pull_to_refresh: ^2.0.0linter#linter란? # 코드 스타일과 품질을 검사하여 코드에 있는 잠재적 오류 # 스타일 위반, 비효율적 패턴 등을 알려주는 도구입니다. l.. 2025. 1. 31. [flutter] 상태관리되는 ToDo List 만들어보기 Flutter 프로젝트: Riverpod과 ToDo 관리이 문서는 Riverpod과 Flutter를 활용한 상태관리 및 ToDo 리스트 구현에 대해 정리한 내용입니다. Tistory에 게시할 수 있도록 깔끔하게 정리하였습니다.1. Riverpod을 활용한 책 관리 시스템1-1. 책 관리 창고 생성NotifierProvider를 사용하여 책 리스트를 관리하는 상태 관리 시스템을 구현합니다.import 'package:flutter_riverpod/flutter_riverpod.dart';// 초기 데이터 선언String myBook = '홍길동전';List books = [];// Notifier 클래스 정의class MyBookStore extends Notifier> { @override List .. 2025. 1. 22. [Flutter] 상태관리가 되는 앱 만들어 보기 03 (RiverPod) Flutter 상태 관리: RiverPod 소개와 활용법Flutter에서 상태 관리를 위해 다양한 도구를 사용할 수 있지만, RiverPod는 코드의 간결성과 테스트 용이성을 높여주는 강력한 상태 관리 도구입니다. 이번 글에서는 RiverPod의 기본 사용 방법과 몇 가지 예제를 통해 이를 활용하는 방법을 알아보겠습니다.1. RiverPod란?RiverPod는 Flutter의 상태 관리 패키지로, Provider의 한계를 극복하기 위해 만들어졌습니다. 주요 특징은 다음과 같습니다:명확한 상태 관리: 상태를 명확하게 정의하고 관리할 수 있습니다.컴파일 타임 검증: 잘못된 사용을 컴파일 시점에 감지합니다.독립적 동작: Flutter 위젯 트리에 의존하지 않고 상태를 관리합니다.2. RiverPod 기본 사용.. 2025. 1. 21. [flutter] 상태관리가 되는 앱 만들어 보기 02 (inheritedWidget) 3단계 작업 (InheritedWidget 사용 해보기)앞의 단계를 보고싶다면 아래의 링크로 props Drilling을 해결하기 위한 방안Inherited_Parent// InheritedWidget 내장 데이터 타입을 상속받아 구현한다.import 'package:flutter/cupertino.dart';import '../common.utils/logger.dart';class InheritedParent extends InheritedWidget { // 공유 상태 데이터 관리에 목적 // List mySelectedBooks = []; List state; // 카드에 담긴 책 목록(공유 상태) // 부모에게 콜백 메서드를 관리하는 목적 void Function(String book).. 2025. 1. 20. [flutter] 상태관리가 되는 앱 만들어 보기 01 우리가 배울 여러 상태 관리 방법을 이용해 데이터 일관성을 유지해 봅시다.StatefulWidgetInheritedWidgetProvider(라이브러리)Riverpod(라이브러리)1단계 statelessWidget statefulWidget 위젯 만들어보기StatelessWidgetimport 'package:flutter/material.dart';void main() => runApp(MaterialApp( debugShowCheckedModeBanner: false, home: MyStatelessWidget(), ));//statelessWidget은//상태의 변화없이 항상 동일한 UI를 그린다.//이런 위젯은 데이터나 변수의 값이 변하지 않을때 사용합니다.//포인트!! =.. 2025. 1. 20. [flutter] 로컬 상태와 공유 상태 상태(State)의 종류상태는 공유 여부에 따라 로컬 상태(Local State)와 공유 상태(Shared State)로 나눌 수 있습니다.https://docs.flutter.dev/data-and-backend/state-mgmt/ephemeral-vs-app[Differentiate between ephemeral state and app stateHow to tell the difference between ephemeral and app state.docs.flutter.dev](https://docs.flutter.dev/data-and-backend/state-mgmt/ephemeral-vs-app)로컬 상태(Local State) : 공유되지 않는 상태BottomNavigationBar의 .. 2025. 1. 20. [flutter] StatelessWidget 과 StatefulWidget 상태란 뭘까?Stateless Widget과 고정상태import 'package:flutter/material.dart';void main() { runApp(MaterialApp(home: MyStatelessWidget()));}// Stateless// 상태의 변화 없이 항상 동일한 UI를 그립니다.// 이런 위젯은 데이터나 변수의 값이 변하지 않을 때 사용합니다.class MyStatelessWidget extends StatelessWidget { // 변수에 final 키워드 즉 상수이다. final msg = '안녕하세요! 저는 Stateless 위젯입니다.'; @override Widget build(BuildContext context) { return Scaffold( .. 2025. 1. 20. [flutter] Error 키보드 origin_client_hide_soft_input reason hide_soft_input_by_insets_api 문제 상황텍스트필드를 눌렀을때 , 키보드가 왔다갔다 거리면서 제대로 위치를 잡지 못하는 오류가 지속적으로 생겼다. I/ImeTracker: onRequestHide at ORIGIN_CLIENT_HIDE_SOFT_INPUT reason HIDE_SOFT_INPUT_BY_INSETS_APII/InputMethodManager_LC: notifyImeHidden: IInputMethodManagerGlobalInvoker.hideSoftInputI/ViewRootImpl: Resizing android.view.ViewRootImpl frame=[0,0][1080,2340]1. 키보드가 열릴때 : 화면 레이아웃이 재조정되며 화면이 다시 랜더링 되는 문제2. 키보드가 닫힐때 : 레이아웃이 충돌하여 UI가 흔들.. 2025. 1. 19. 이전 1 2 3 4 다음 728x90 반응형
