하몬드의 개발블로그

설정 참고자료 Internationalizing Flutter apps How to internationalize your Flutter app. docs.flutter.dev 이거 참고해서 설정하면 된다. 여기서 추가 설명이 필요한 부분만 밑에 더 써놨다. 언어추가 localizationsDelegates: const [ AppLocalizations.delegate, GlobalMaterialLocalizations.delegate, GlobalWidgetsLocalizations.delegate, GlobalCupertinoLocalizations.delegate, ], supportedLocales: const [Locale('en'), Locale('ko')], runApp(main.dart)에..

Provider Provieder를 쓰는 이유 1. 코드역할 분리 UI를 담당하는 코드, 네트워크를 담당하는 코드, 데이터를 담당하는 코드 등코드를 역할에 따라 나눌 수 있다. 한 클래스가 여러 역할을 할수록, 클래스가 커지고 관리가 어렵게 됩니다.따라서 클래스가 하나의 역할만 갖도록, 클래스를 나눈다. 2. 데이터 공유 하나의 데이터를 여러 페이지에서 공유해야 될 때가 있다. 그런데 페이지마다 데이터를 새로 불러온다면 앱이 복잡해지고, 비용도 많이 들 것이다. 이럴 때 Provider 패턴을 쓰면 데이터 공유를 쉽게 할 수 있다. 3. 간결한 코드 Provider 패턴을 쓰면 Bloc패턴에 비해좀 더 적은 코드로 클래스들을 구분해서 쓸 수 있다.  패키지 추가provider: ^6.0.5 예제(Todo..

null safety Flutter 2.12 버전부터는 null 관련 버그를 줄이고 코드 안정성을 향상시키기 위해 "null safety" 개념이 도입되었다. - Non-nullable 타입: int, double, String과 같이 null 값을 가질 수 없는 타입은 "non-nullable" 타입으로 분류된다. 변수에는 반드시 초기값이나 값이 할당되어야 합니다. - Nullable 타입: nullable 타입은 변수가 null 값을 가질 수 있는 상태를 의미한다. - Null Safety 연산자: Null safety에서는 변수가 null일 가능성이 있는 경우, ? 연산자를 사용한다. nullsafety는 null로 인해 의도치 않은 동작을 방지하는 것이 목적이다. nullable Dart는 변수의..

비동기 처리란?  일반적인 프로그래밍은 단일 스레드 환경에서 순차적(동기적)으로 수행이 이루어진다.애플리케이션에서 파일 읽기, 데이터베이스 접근, 웹 페이지 가져오기 등의상대적으로 긴 시간이 필요한 작업들을 처리할 때 비동기 처리를 쓰게 된다. (애플리케이션의 렌더링 시간을 줄이기 위해 하는 처리라고 볼 수 있다.)  Future란? Future는 비동기 작업의 결과를 나타내는 객체로, 비동기 작업이 완료되면 해당 결과가 Future 객체에 저장된다. Future는 "Future" 이런식으로 타입을 명시해야 한다.   Future는 2가지 상태를 가지며, (미완료/완료)2가지의 결괏값을 얻을 수 있다. (data/error)   예제 코드 then, catchError로 반환값이 data일 때와, err..

프로젝트 요구사항 프로젝트 기본 구조 - models 폴더엔 Todo 모델과 News 모델이 들어갈 것이다. - providers 폴더엔 데이터 관련 기능을 따로 빼서 작성한 파일이 들어갈 것이다. 자동로그인 구현 SharedPreferences란? SharedPreferences(shared_prefs)는 저장해야할 데이터 양이 적거나 아주 간단한 경우 사용할 수 있는 기법이다. shared_prefs는 키-값 방식으로 데이터를 저장하는 방법이다. 기기 내 xml 파일을 통해 앱의 데이터를 저장하는 방식인데 파일에 데이터를 쓰는 방식이기 때문에 앱을 껐다 켜도 데이터가 유지된다. 많은 양의 데이터를 관리하기 어려우며, 키-값 방식 외의 구조 설계가 불가능하므로 자동 로그인이나 도움말 스킵 여부 등 간단..

프로젝트 요구사항 화면은 하나만 구현하면 되고 구현할 기능들이 좀 많다.. 프로젝트 데모 폴더 구조 타이머 화면을 구성하는 dart파일을 하나 생성 후, main.dart에서 타이머 화면을 띄우도록 하면 된다. 타이머 UI 구현 import 'package:flutter/material.dart'; class TimerScreen extends StatefulWidget { const TimerScreen({super.key}); @override State createState() => _TimerScreenState(); } class _TimerScreenState extends State { @override Widget build(BuildContext context) { final List r..

알아볼 것들 1. DOM과 VDOM 2. Flutter LifeCycle DOM이란? DOM은 Document Object Model의 약자로 문서 객체 모델을 의미한다. 웹 페이지(HTML, XML)의 콘텐츠 및 구조, 그리고 스타일 요소를 구조화 시켜 표현하여 프로그래밍 언어가 해당 문서에 접근하여 읽고 조작할 수 있도록 API를 제공하는 일종의 인터페이스이다. DOM의 비효율성 웹페이지에서 동적으로 할 일(list)을 추가하는 기능을 구현하려면 JS를 사용해 DOM을 조작해야 한다. 항목 1 항목 2 항목 3 항목 추가 위 코드에선 "항목 추가" 버튼을 클릭할 때마다 새로운 요소를 생성하고, 그 요소를 목록에 추가한다. 위 코드가 비효율적인 점 2가지 1. 요소를 실제 DOM에 반복적으로 생성하고 ..

2번째 미팅에서 담당자님이 숙제를 하나 주셨다. 브라우저에서 화면을 렌더링 하는 순서를 조사해오세요. 바로 알아보도록 하자. 사전지식 1. 브라우저란? 브라우저(Browser)는 인터넷을 통해 웹 페이지와 웹 애플리케이션을 출력하고 사용자가 웹을 탐색하는데에 도움을 주는 소프트웨어이다. ex) chrome, firefox 등... 2. 렌더링이란? 브라우저는 웹 페이지를 요청하고 서버로부터 받은 HTML, CSS, JS 등의 웹 문서와 자원들을 해석해 사용자들에게 시각적으로 보여주는 것을 뜻한다. 3. 파싱이란? 특정 형식의 데이터나 문서를 분석하여 그 구조를 이해하고 원하는 정보를 추출하는 과정을 의미한다. 렌더링 순서 1. HTML 문서 파싱 웹 브라우저가 웹 페이지의 구조와 내용을 설명하는 HTML..