개요 개발을 하다보면 기본적으로 제공하는 함수나 기능들 외의 기능들이 필요할 때가 많다. 스스로, 혹은 개발 팀에서 이를 직접 구현할 수 있고, 그러기로 결정이 났다면 다행이지만, 그럴 여유가 없어서 그 기능을 구현할 수 없을 때가 있다. 그럴 때는 보통 라이브러리를 받아와서 해결한다. ▼ Flutter는 이를 패키지라고 부르며, 빠른 개발을 위해서라면 패키지를 사용하는 것은 필수다. 패키지 혹은 플러그인이라고도 부르는데 엄연히 따지자면 패키지가 조금 더 큰 개념이다. 굳이 구별을 하자면 Dart코드로만 이루어진 것을 패키지라고 하고, JAVA, Swift, Kotlin과 같은 다른 언어를 포함하고 있는 것을 플러그인이라고 한다. 어쨌든 이번 포스트에서는 패키지 사용법에 대해 알아볼 것이다. 패키지 검색..

개요 Flutter로 크로스 플랫폼 앱 개발을 하다보면, 아래와 같이 `const`를 붙이라는 경고메세지가 등장한다. ▼ 이는 Error가 아닌 단순 Warning이라서 지키지 않아도 프로그램이 컴파일 되는 데에는 큰 문제가 없다. 하지만 아래에 파란줄이 남은 것을 볼 때면 굉장히 찝찝해져서 const를 붙이지 않고 넘어갈 수 없다. ▼ 이쯤되면 의문이 하나 생긴다. "도대체 왜 `const` 키워드를 붙이라고 권장하는걸까?" 프로그래밍 문법을 배울 때 const는 상수라고 배운다. 그리고 상수는 변하지 않는 값을 선언할 때 사용한다고도 배우는데, Dart에는 `const`외에 `final`이라는 키워드가 존재한다. 변하지 않는 값을 선언하는 것을 권장하는 것이라면 `const`가 아니라 `final`을..

Future 데이터들 다루기 너무나도 까다로운 Future 추천 정보 비동기를 잘 모른다면 간단하게 이해하고 보는걸 추천합니다. 동기와 비동기 개론 -> Dart 비동기 프로그래밍 찍먹 -> Future 변수들을 사용하여 비동기 작업을 하다보면 가장 힘든 부분이 화면에 그려주는 부분이다. 데이터가 바로 들어온다고 가정하고 화면을 그리게 되면 빨간색 에러 화면을 마주하기 쉽상이다. 데이터가 완성되는게 아무리 빠르다고 해도 화면을 그리는 부분이 별도의 장치가 없다면 선행되기 때문에 에러가 쉽게 발생한다. 데이터가 들어오는걸 기다리는 동안에… 상태관리로 전부 처리하자 그렇기에 데이터가 들어오는것을 기다리며 그 동안에는 로딩 화면을 보여주거나 빈 화면을 보여줘야 하는데, Stateful Widget이나 GetX..

Dart의 String 문법 다른 언어들은 안이러는데 Flutter는 Dart언어를 사용하기에 대부분 Dart를 사용하지 않다가 Flutter를 사용하기 위해 사용하게 되었을 것이다. 조금 범용적으로 사용되는 JAVA나 Python, C++ 와 같은 언어들에 익숙해져있다가 Dart로 오게 되면 한가지 의문점이 생기게 된다. 바로 문자열을 “”(큰 따옴표, Double quote) 로 감싸는게 아니라 ‘’ (작은 따옴표, Single quote) 로 감싸기 때문이다. Dart의 String 문법 Dart에서는 아래와 같이 문자열을 작성할 수 있다. String singleQuote = '안녕하세요. 고라니입니다.'; String doubleQuote = "안녕하세요. 고라니입니다."; 두 문자열에 차이가 ..

발단 (개요) 파이어베이스의 이상한 인증 순서 지나가던 사람을 붙잡고 회원가입을 할 때 물어본 것들을 말해보라고 하면 아마 대부분 아이디, 비밀번호, 이메일, 전화번호 등등을 이야기할 것이다. 그렇다면 이메일과 전화번호를 물어봤다면, 그게 정말 당신이 사용하고 있는 이메일과 전화번호가 맞는지도 물어봤다고 대답할 것이다. 위의 대답을 하고 회원가입 순서를 생각하면 일반적으로는 아래와 같이 생각하게 된다. 아이디, 비밀번호, 이메일, 전화번호 등등을 입력. 입력한 이메일과 전화번호가 정말 사용자의 것이 맞는지 인증. 인증이 완료되었다면 계정이 서버에 등록. 이게 대부분이 생각하는 회원가입과 인증 절차다. 하지만 파이어베이스에서는 이런 흐름과는 전혀 다르게 동작한다. 파이어베이스에서 제공하는 인증은 이미 등록..

들어가기 앞서 동기와 비동기에 대해 잘 모른다면 아래의 글을 먼저 읽고 오시는걸 추천드립니다! 동기와 비동기 개론 개요 동기와 비동기, 프로그래밍을 공부하다보면 항상 등장하는 개념이다. 중요한 개념이고 꼭 알아야한다고 하지만 이게 왜 중요한 개념인지 잘 이해하지 못하고 넘어간 적이 많다.▼ 하지만 noguen.tistory.com 개론 비동기 프로그래밍은 다른 작업이 끝나기를 기다리는 것이 아니라 그 동안에 다른 작업을 수행하게 해준다. 보통 아래의 작업들을 비동기로 수행하곤 한다. 네트워크를 통해 데이터 가져오기 데이터베이스에 데이터 쓰기 파일에서 데이터 읽어오기 이런 작업들은 읽어오거나 가져온 결과를 Future, 만약 여러개의 부분으로 나누어져 있는 결과라면 Stream으로 가져온다. 만약에 한 함..

개요 동기와 비동기, 프로그래밍을 공부하다보면 항상 등장하는 개념이다. 중요한 개념이고 꼭 알아야한다고 하지만 이게 왜 중요한 개념인지 잘 이해하지 못하고 넘어간 적이 많다.▼ 하지만 동기, 비동기라는 것은 사실 엄청나게 거창한 것은 아니고 우리의 상식 선에서 충분히 생각해 볼 수 있는 개념이다. 컴퓨터 공학과 학생이라면 아마 CS수업 중에서 이미 이와 비슷한 이야기를 듣기도 했을 것이다. 컴퓨터 전반에서 사용되고 있는 개념이면서 이해하고 보면 아주 당연한 이야기이기에 쉽게 이해할 수 있을 것이다. 동기(Synchronous) 동기란? 동기는 영어로 Synchronous이고, 다르게 번역하면 동시에라는 의미이다. 그렇다면 무엇을 동시에 수행하는 것이길래 `동기`라고 부르는 것일까? 그 답은 요청과 결과가..

보일러플레이트 코드를 피하자 보일러 플레이트 Flutter로 코드를 짜다보면 반복적인 코드가 등장하게 된다. 이런 반복적인 코드를 프로그래머들은 보일러플레이트 코드라고 부른다. 보일러플레이트 코드? 보일러 플레이트(Boilerplate)는 신문사업에서 납 대신 강철로 인쇄물을 찍기 시작하면서 나온 그 강철을 말한다. 보일러 플레이트 코드는 최소한의 변경으로 여러 곳에서 재사용 되며, 반복되는 형태를 띄는 코드를 말한다. 역사적으로 이런 반복되는 코드를 피하기 위해 함수란 개념이 나왔는데, 이 함수 조차도 반복될 수 있다는 것이다. 보일러플레이트 코드는 없어져야 한다 최소한의 변경으로 반복되는 코드는 실용적이지도 않고, 코드의 길이는 길어지며, 길어진 코드는 가독성을 해치게 된다. 개발자는 이런 상황을 막..

개요 Flutter 앱 개발 학습 초기에 위젯들을 넣는 방법을 배우다 보면 위젯들의 이름이 전부 StatelessWidget임을 알 수 있다. 그렇다면 StatefulWidget은 무엇이고 언제 쓰는걸까? 이제부터 StatefulWidget의 존재와 그 사용 방법에 대해서 알아보자. Imperative UI (명령형) vs Declarative UI (선언형) 가장 먼저 Flutter의 UI 구성 방식에 대해서 알아보자. UI를 짜는 방식으로는 두 가지 방식이 있다. 전통적으로 사용되어온 Imperative UI(명령형 UI)가 있고, 최근 들어 새롭게 등장한 Declarative UI(선언형 UI)로 만드는 방식이 있다. Imperative UI (명령형 UI) 란? 전통적인 방식이라고 부를 수 있는 ..

Flutter 위젯 디자인 개요 Flutter를 세팅하고 flutter 프로젝트를 만들었다면, 이제 위젯을 디자인하는 방법에 대해서 알아보자. Flutter의 특징을 하나씩 알아가며 어떤 식으로 앱을 디자인하게 되는지 학습한다. 위젯 Flutter에서 앱을 디자인할 때는 위젯을 생각하면 된다. 아래의 사진은 iOS와 Android OS의 위젯화면이다. ▼ Flutter에서 앱을 디자인 하는 방법은 쉽게 말해 위젯을 짜깁기 하는 것이다. Flutter는 선언형 UI를 채택하고 있기 때문에 각종 UI들이 위젯의 형태로 미리 구현이 되어있다. 글자를 넣고 싶다면 글자 위젯, 박스를 넣고 싶다면 박스 위젯을 넣는 식으로 디자인을 한다.▼ 위젯 내부에 위젯을 넣는 식으로 짜깁기 한다. 위젯 트리 그렇다면 이 위젯..