본문 바로가기

# 02/Flutter

[Flutter] Shorebird 코드 푸시(Code Push) 란? 리액트 네이티브로 개발하는 주된 원인이 바로 코드 푸시입니다. 코드 푸시는 개발자가 앱을 심사 없이 바로 업데이트할 수 있도록 하는 클라우드 서비스입니다. 이를 이용하여 사용자에게 영향을 미치는 버그를 신속하게 수정할 수 있고 새로운 기능이나 성능 개선도 즉각적으로 반영할 수 있습니다. 앱을 삭제 후 재설치 하지 않고 앱 스토어로 이동하지 않고 업데이트가 가능합니다. 단, 네이티브 코드 변경 시에는 스토어를 통해 배포해야 하며 코드 푸시를 통한 업데이트만 진행하고 스토어 배포를 하지 않는다면 신규 사용자는 스토어에서 다운로드한 후 다시 첫 실행에 코드 푸시 업데이트도 해야 한다는 단점이 있어 스토어를 통한 출시도 주기적으로 진행하는 것이 좋습니다. Shorebird 란..
[Flutter] Fcm Custom Sound 구현하기! (안드로이드 편) Flutter 앱에서 푸시 메시지가 왔을 때 메시지 타입별로 다른 사운드가 났으면 좋겠다고 하여 찾아봤는데, 검색 해보면 대부분 서버에서 "sound": "sound_file.mp3" 데이터 추가해주면 된다고 하는데.. 절대안됨... 결론은 안드로이드 알림 채널을 사운드 별로 생성해주고 서버에서 해당 채널 아이디를 넣어주면 등록된 채널 사운드가 울린다! 1. app/android/app/src/main/res/raw 폴더 생성 하여 사운드 파일 mp3 형식으로 넣어줍니다. 2. 위의 폴더에 keep.xml 파일을 만들고 mp3 파일 tools 에 등록해 줍니다. (이거 땜에 또 한참 헤맴...) 3. Flutter 에서 각 사운드 별 채널을 등록해 줍니다.(기존 알림 채널이 등록되어 있으면 사운드 변경이..
[Flutter] Impeller - Flutter의 새로운 렌더링 엔진 Flutter의 렌더링 방식 React Native는 자바스크립트 브릿지를 통해 플랫폼과 통신합니다. 플랫폼의 네이티브 컴포넌트(OEM 위젯)를 그대로 사용하기 때문에 플랫폼 별 유아이가 다르게 그려질 수 있고 플랫폼과 React Native 간 통신을 할 때 필요한 리소스 비용이 상당히 높습니다. Flutter는 바로 캔버스에 그림을 그리듯이 표현하고, 필요한 제스처 및 이벤트를 브릿지를 통하지 않고 바로 실행하기 때문에 속도가 빠른 편입니다. Flutter는 Skia 엔진을 이용해서 프레임 워크단에서 유아이를 직접 그리기 때문에 디바이스에 제한 없이 동일한 화면으로 렌더링이 가능합니다. 따라서 iOS에서 Material 디자인을, Android에서 Cupertino 디자인을 쉽게 구현할 수 있습니다...
[Flutter] What’s new in Dart and Flutter (Flutter 3.10 / Dart 3.0) Flutter의 앱개발 향상을 위한 5가지 핵심적 특징 Beautiful : 화면 위의 모든 픽셀을 완전히 제어할 수 있다. Fast : 하드웨어 가속 그래픽 덕분에 속도가 빠르다. Productive : 생산적이다. 핫 리로드와 DevTools로 워크플로를 지원한다. Portable : 이식가능하다. 코드베이스 하나를 공유하여 고객이 어떤 플랫폼을 사용하든 모두 지원한다. Open : 개방적이다. 무료 오픈 소스이다. 모든 코드를 볼 수 있어 배우고 수정할 수 있다. Flutter Forward 올해 초에 도입 개발자 경험에 계속 집중 하였으며 혁신적 그래픽 성능을 제공하고 웹, 데스크톱, 모바일을 매끄럽게 통합하는 방향을 지향하고 새롭게 떠오르는 아키텍처를 조기에 도입할 예정이다. 1. Flutter..
[Flutter] 면접 질문! 보호되어 있는 글입니다.
[Flutter] BuildContext 객체와 위젯 키 BuildContext 위젯 하나 당 BuildContext 가 존재한다. 위젯에 필요한 다양한 정보가 들어 있고 그중 위젯 트리에서 위치와 관련된 정보가 대표적이다. 이 정보를 이용하여 위젯 트리에서 상위 위젯 객체를 얻을 수 있다. MyApp? app = context.findAncestorWidgetOfExactType(); 엘리먼트 트리가 바로 BuildContext 객체의 트리이다. [Flutter] 위젯 트리 Flutter 에는 화면을 구성하는 3개 트리 구조가 존재 한다. 개발자가 코드를 작성하는 위젯 트리(Widget Tree)와 Flutter 프레임워크가 화면을 만들 때 만드는 엘리먼트 트리(Element Tree), 렌더 트리(Render T zoiworld.tistory.com abs..
[Flutter] State의 생명 주기 StatelessWidget 과 StatefulWidget 은 불변이며 화면이 다시 빌드될 때마다 매번 생성되므로 생명 주기를 논할 필요가 없다!! 단, State는 한 번 생성된 후 메모리에 유지되므로 생명 주기를 가진다. created, dirty, clean, defunct 는 상태를 나타낸다. clean 은 state에 의해 화면이 출력되고 있는 정상 상태이며, dirty는 state 화면을 다시 빌드해야 되는 상태를 의미 한다. initState() 최초 1회 실행. didChangeDependencies() initState() 함수가 호출된 후에 이어서 호출된다. 즉, State가 생성될 때 자동으로 호출된다. 단, 반복으로 호출되는 경우도 있는데 위젯 트리에서 상위 위젯의 상태 데이터를 하..
[Flutter] StatefulWidget 의 State 플러터에서 위젯은 불변이므로 StatelessWidget 이든 StatefulWidget 이든 화면을 다시 빌드하면 이전 객체를 다시 이용하는 것이 아니라 새로운 객체가 생성된다. StatelessWidget 은 상태를 관리하지 않으므로 보통은 데이터가 많거나 로직이 복잡하지 않는다. 따라서 상위 위젯으로 인해 화면이 다시 빌드될 때 객체가 새로 생성 되더라도 문제가 없다. StatefulWidget 은 보다 많은 데이터에 복잡한 로직을 가진다. 이런 객체를 다시 빌드될 때마다 다시 생성한다면 비효율적이다. 따라서 StatefulWidget은 위젯 트리 구조에 포함해 매번 생성되게 만들고, 실제 데이터와 업무 로직은 State 객체를 따로 두어 화면이 다시 빌드될 때마다 매번 생성되지 않게 한다. Sta..

티스토리툴바