lgvv98

Dart에서 Future와 async/await 이해하기 1. Dart의 ThreadDart는 싱글 쓰레드 기반Event loop를 통해 비동기 작업 처리Android의 Looper와 유사한 개념 2. Future란?Future는 미래의 값을 나타내는 객체실행 순서:Dart가 Future 객체를 내부 배열에 등록관련 코드가 이벤트 큐에 등록불완전한 Future 객체 반환동기(Synchronous) 코드 먼저 실행Future 완료 시 실제 데이터 전달 예제: Future + thenFuture 실행은 비동기, then으로 결과 처리Future fetchData() { return Future.delayed(Duration(seconds: 2), () => "데이터 완료");}void main() { p..

Flutter Networking (api, json parsing) 실습 이번에는 Future를 통해서 통신 과정을 실습. await async가 웹이나 Swift Concurrency와도 비슷한데, 아직 이 개념이 익숙하지 않아서 Future를 이용 스크린샷 코드 샘플import 'package:flutter/material.dart';import 'package:futurejson/info.dart';import 'package:http/http.dart' as http;import 'dart:async';import 'dart:convert';void main() { runApp(MyApp( info: fetchInfo(), ));}class MyApp extends Stateless..

Flutter Future, async, await 이해하기 Flutter에서 비동기 처리(Future, async, await)는 RxSwift와 비슷한 흐름으로 이해할 수 있음.이번 시간에는 순차적 실행 → 지연 → 비동기 처리 → await 사용 순으로 발전하는 예제를 통해 학습 실습을 통해 하나하나 바꿔가면서 알아보자. 1. 기본 동기 실행 import 'dart:io';void main() { showData();}void showData() { startTask(); accessData(); fetchData();}void startTask() { String info1 = '요청 수행 시작'; print(info1);}void accessData() { String info2 ..

Flutter 로그인 페이지 실습 코드 리팩토링 이전 포스팅의 실습을 리팩토링을 진행할 것. 프로젝트 구조도login.dart import 'package:flutter/material.dart';import 'package:signin_refactoring/my_button/my_button.dart';class LogIn extends StatelessWidget { const LogIn({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( backgroundColor: Colors.blue, title: Tex..

Flutter 로그인과 주사위 앱 실습 로그인 화면과 주사위 게임 화면을 만드는 방법에 대해서 정리새로 배우는 위젯, 디자인 패턴, 클린 코드 활용법이 많음.코드를 천천히 읽으면서 핵심 포인트를 짚어보기. 실습 스크린샷스크린샷 예제 main.dart// main.dartimport 'package:flutter/material.dart';import 'dice.dart';void main() => runApp(MyApp());class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( debugShowCheckedModeBanner: false, ..

Flutter: StatefulWidget 살펴보기 StatefulWidget에 대해서 간단히 정리Flutter 프로젝트를 처음 생성하면 기본 템플릿에 포함되어 있는 구조를 기준으로 설명코드는 거의 동일하지만, 중요한 포인트는 Stateful과 관련된 연결 부분과 setState 사용법 핵심 포인트StatefulWidget은 상태(State)를 가지는 위젯상태 변경 시 화면을 다시 그리려면 setState()를 사용핫 리로드로는 Stateful 부분이 제대로 반영되지 않을 수 있으므로, 변경 후 에러가 나면 리빌드 필요 샘플 코드import 'package:flutter/material.dart';void main() { runApp(MyApp());}// 1️⃣ StatefulWidget 생성cla..

Flutter: Collection, Generic + Null Safety Flutter 2.0의 Null Safety, Collection, Generic에 대해 다룸. Flutter 2.0의 null SafetyFlutter 2.0에서는 변수가 null일 수 있는지 없는지를 명확히 구분변수 선언 시 기본적으로 null Safety가 보장되지 않으면 컴파일러가 경고를 발생시킬 수 있음. String Interpolationvoid main() { String name = 'Sean'; print(name); print("Hi $name, what's up?");}SeanHi Sean, what's up? Collection & Generic Collection : 데이터들을 모아서 가지고 있..

Flutter Navigator와 pushName 메소드 알아보기 특히 오타로 인한 슬래시(/)와 역슬래시(\) 문제 때문에 한참 헤맸던 경험이 있음.그리고 파일을 나눠서 작업하면서 import 관리의 중요성도 느낄 수 있었음. 생각할 점: import가 너무 많으면 관리가 불편하다.→ C/C++처럼 헤더 파일처럼 한 곳에서 모아서 관리할 수 있는 방법을 찾아보면 좋음.코드 샘플 main.dart// main.dart import 'package:flutter/material.dart'; // 데스크탑, 앱 등에 고루 UI를 적용할 수 있게 해주는 구글이 제공해주는 패키import 'package:untitled/ScreenA.dart';import 'ScreenB.dart';import 'ScreenC..

Flutter Navigator 간단 정리 네비게이터 간단하게 정리 목차Route의 개념스마트폰에서 보여지는 하나의 페이지 화면 ! Navigator의 정의와 push, pop 함수, stack 자료구조stack ( FILO ) push 데이터를 넣기pop 데이터를 빼기Route(페이지)는 Navigator라는 위젯이 담당하고 그 구조는 스택 구조MaterialPageRoute위젯과 context화면전환할 때, 바로 class 입력해서 이동하는 것이 아니라 화면을 지정해주면서 이동페이지 이동 기능 구현 완성 코드 샘플import 'package:flutter/material.dart'; // 데스크탑, 앱 등에 고루 UI를 적용할 수 있게 해주는 구글이 제공해주는 패키void main() => runA..

Flutter Column, Row 정리 이번 시간에는 Column 위젯과 Row 위젯에 대해 정리.이 두 위젯은 플러터 레이아웃의 기본 뼈대를 이루는 중요한 요소지만,개념 자체는 간단하다. 그러니 이번엔 쓱 보고 감각적으로 이해해보자 Flutter Layout Cheat Sheet 아래 사이트는 레이아웃을 바로 확인할 수 있는 사이트https://medium.com/flutter-community/flutter-layout-cheat-sheet-5363348d037e Flutter Layout Cheat SheetDo you need simple layout samples for Flutter? I present you my set of Flutter layout code snippets. I wil..