서론 Flutter 는 Code Generation 기능이 상당히 많이 활성화되어 있어요. 흔히들 많이 사용하는 json_serializable 라이브러리도 있고 retrofit 및 chopper 라이브러리도 있습니다. 오늘 알려드릴 freezed 또한 데이터 클래스에 편의 기능들을 제공해주는 code generation 라이브러리입니다. Freezed...
서론 안녕하세요 코드팩토리입니다. 오늘은 Equatable 플러그인 사용법에대한 강의를 가져왔어요. 외부 플러그인들을 보거나 튜토리얼을 보면 클래스들이 Equatable 부모 클래스를 익스텐드하는걸 자주 볼 수 있는데 커뮤니티에서도 종종 질문이 들어와서 왜 Equatable 플러그인을 사용해야하는지 설명을 해보려고 합니다. Equatable 이란?...
Google Mobile Ads? 기존에 Flutter 에서는 firebase_admob 이라는 플러그인으로 Admob 설정을 했었어요. 이 Admob 플러그인을 사용해보신 분들은 모두 느끼셨겠지만 단점이 정말 많습니다. 여러 단점중 가장 유저들이 불편해 했던건 Flutter 의 위젯 형태로 광고가 들어가는게 아니라 ListView 같은 곳에 배너를...
새로운 버튼! Flutter 2.0 업데이트가 되면서 버튼 위젯이 크게 업데이트 되었습니다. 기존에는 버튼을 사용하려면 FlatButton, OutlineButton, RaisedButton 중 하나를 사용하는게 일반적이었는데 이 버튼들이 1.25버전 기준으로 deprecate 되면서 TextButton, OutlinedButton,...
Flutter 2.0! 어제 Flutter 2.0 버전 및 Dart 2.12 버전에서 추가된 Null Safety 기능에 대해 말씀 드렸었습니다. 이번시간에는 Flutter 2.0 에서 추가된 버튼들의 기능을 정리하면서 FVM 이라는 편리한 라이브러리를 알게되서 FVM에 대해 먼저 알려드리려고 해요! FVM 이란? FVM 은 Flutter Version...
Flutter 2.0! 2021년 3월 4일 기준으로 드디어 Flutter 2.0 버전이 Stable Channel 에 머지가 되었습니다. 머지된 pull request 리스트를 보면 정말 어마어마하게 많은 새로운 기능들이 머지가 된것을 볼 수 있는데 Flutter 개발자들이 오랫동안 요구해왔던 기능들이 머지가 되어서 업데이트 사항을 공부하며 목요일을...
강의 소개 안녕하세요 코드팩토리입니다! 제가 최근에 타짜라는 영화를 봤는데요 섯다를 치는 신세경이er 로 화투 카드 뒤집는 애니메이션을 만들어보려고 합니다. 이미지 다운로드 자 일단은 아래 이미지들을 다운받아 주세요. 위부터 아래로 각각 화투의 뒷면, 3광, 8광입니다. 이 카드를 렌더링하는 함수를 먼저 작성 해보겠습니다. renderCard({...
Form 으로 손쉽게 여러개의 텍스트필드 상태관리하기! 서론 Flutter 에서 기본적으로 TextField 입력을 받으려면 기본적으로 TextEditingController 를 사용해야 합니다. TextField 가 하나면 괜찮지만 여러개가 되면 될수록 컨트롤러 관리가 굉장히 어려워지죠. 하지만 TextFormField 라는 TextField 의 살짝...
서론 이번 시간에는 Flutter 의 매우 강력한 기능중 하나인 Custom Painter 에 대해 배워보도록 하겠습니다. 연습으로 아래 Apple Watch Hermes 에디션의 워치 페이스를 그려보도록 하겠습니다. 아 전 물론 Hermes 에디션이 없습니다. 없으니 그려서라도 갖어보려구요. Youtube Custom Paint Init 일단...
서론 오늘은 Flutter 로 커스텀 키보드를 만들어보려고 합니다. 특수한 상황이 아닌 경우 각 OS 에서 제공해주는 기본 키보드의 기능이 충분하지만 만약에 특수한 키보드를 사용해서 UI/UX 를 대폭 증진 시킬 수 있다면 직접 키보드를 제작해야하는 상황이 올 수도 있습니다. 예를들면 금융 앱에서 숫자를 입력할때라던가 캘린더 앱에서 날짜를 쉽게 지정할 수...
Retrofit 은 annotation 으로 저희가 일반적으로 작성하는 HTTP 엔드포인트에 대한 액션들을 클래스화 시켜주는 라이브러리입니다. Flutter 에만 존재하는게 아니라 다른 프레임워크나 언어에도 존재하니 혹시 마음에 드시면 찾아보세요! 📦 GitHub Repository
React Mobx 에 대한 강의입니다. 간단한 세팅과 action, observable 사용법에 대해 알아봤습니다. 개인적으로 Redux 보다 Mobx 가 간편함 및 편의성에 대한 장점이 크다고 생각해서 React 프로젝트에 거의 디폴트로 사용하는 글로벌 상태관리 툴입니다. 꼭 한번 사용해보세요!
Headless CMS 인 Strapi 사용법에 대한 강의입니다. MVP, POC 등 퍼포먼스 및 커스터마이제이션 니즈가 심하지 않고 시간적 요소가 중요한 프로젝트에 상당히 유용하게 쓰일 수 있는 툴입니다. Javascript 기반으로 되어있기 때문에 Backend 를 모르는 프론트엔드 엔지니어가 가볍게 사용 해볼수도 있습니다. 혹시 Firebase 를...
Git & GitHub 액기스만 17분만에 마스터
Kubernetes v1.20 버전부터 Docker 가 Deprecate 된다는 흉흉한 소문이 돌고 있습니다. OCI (Open Container Initiative), CRI (Container Runtime Interface) 에 대한 설명과 더불어 정말로 Docker 를 이제는 Kubernetes 에서 사용하지 못하게 되는건지 팩트체크 해보겠습니다!
Client Side Rendering vs Server Side Rendering (CSR vs SSR) 비교하는 영상입니다. Client Side Rendering 은 흔히 ReactJS, VueJS, AngularJS 에서 많이들 사용하시죠? 일반적으로 SPA (Single Page Application) 들이 개발하기 편해서 좋지만 Client...
React hooks 에 대한 강의입니다. 이 강의에서는 useState, useEffect, customHooks 세가지에 대해서 다뤄보고 있습니다.
React, swr, axios 를 사용해서 효율적인 ajax 요청 캐싱 및 optimistic response 를 구현하는 방법입니다. 구독과 좋아요는 영상 제작에 큰 힘이 됩니다!
Flutter GetX 상태관리에 대한 모든걸 알려드리는 강의입니다. 📦 GitHub Repository
Flutter CustomScrollView 및 각종 Sliver 사용법에 대한 강의입니다. UI 는 아래 링크의 Flutter 공식 채널 영상에서 영감을 받았습니다. 링크 📦 GitHub Repository
![[Flutter] Flutter Freezed 플러그인! Entity Code Generation 은 이거 하나로 끝](https://pub-3ad37726f8c34a0a9104469d07033021.r2.dev/blog-migration/flutter-freezed/cover.jpg)
![[Flutter] Equatable 플러그인, 도대체 어디에 쓰는건가요?](https://pub-3ad37726f8c34a0a9104469d07033021.r2.dev/blog-migration/flutter-equatable/cover.jpg)
![[Flutter] Flutter 2.0 Null Safety](https://pub-3ad37726f8c34a0a9104469d07033021.r2.dev/blog-migration/flutter-null-safety/cover.jpg)
![[앱개발] [Flutter] 화투 카드 뒤집는 애니메이션 만들기](https://pub-3ad37726f8c34a0a9104469d07033021.r2.dev/blog-migration/flutter-card-flip/cover.jpg)
![[Flutter] Flutter 로 Hermes 애플워치 페이스 그려보기](https://pub-3ad37726f8c34a0a9104469d07033021.r2.dev/blog-migration/flutter-custom-paint-hermes-apple-watch/cover.jpg)
![[Flutter] Flutter 로 커스텀 키보드 구현하기 feat. 카카오뱅크](https://pub-3ad37726f8c34a0a9104469d07033021.r2.dev/blog-migration/flutter-custom-keyboard/cover.jpg)
![[앱개발] [Flutter] Rest API 엔드포인트 따느라 삽질 하셨나요? 제가 도와드릴게요 Retrofit!](https://pub-3ad37726f8c34a0a9104469d07033021.r2.dev/blog-migration/flutter-retrofit-intro/cover.jpg)
![[웹개발] [React] React Hooks 10분만에 배우기 (useState, useEffect, customHooks)](https://pub-3ad37726f8c34a0a9104469d07033021.r2.dev/blog-migration/react-hooks/cover.jpg)
![[웹개발] [React] React 개발자라면 꼭 알아야하는 SWR](https://pub-3ad37726f8c34a0a9104469d07033021.r2.dev/blog-migration/react-swr-intro/cover.jpg)
![[앱개발] [Flutter] GetX 상태관리 이 영상 하나면 끝! [#2 - State Management]](https://pub-3ad37726f8c34a0a9104469d07033021.r2.dev/blog-migration/flutter-getx-state-management/cover.jpg)
![[앱개발] [Flutter] Flutter 리스트 신기하고 이쁘게 만드는법](https://pub-3ad37726f8c34a0a9104469d07033021.r2.dev/blog-migration/flutter-beautiful-list/cover.jpg)