Kitworks Team Study

1. Flutter

2. 2017년 5월 Google에서 출시
오픈소스 크로스 플랫폼 프레임워크
내부적으로 Skia 렌더링 엔진을 가지고 있음
Google에서 만든 Dart 언어를 사용
Flutter?

3. 2011년 Google에서 Javascript를 대체하기 위해 개발
멀티 플랫폼 상에서 동작되도록 하는 앱을 위해 디자인된 프로그래밍 언어
Dart의 목표는 다양한 종류의 기기에서 동작되도록 하는 것

4. 두 가지 컴파일 방법 지원 (JIT + AOT)
- JIT(Just-In-Time) 컴파일러는 프로그램 실행 중에 즉시 컴파일이 가능합니다.
- AOT(Ahead-of-time) 컴파일러는 프로그램 작성 중(런타임 이전에) 컴파일을 실행합니다.
네이티브에 필적하는 성능

5. 랜더링 방식
Hybrid
App
Reactive View (React
Native)
자주 Bridge 에 접근하게 되면서 결국 퍼포먼스 이슈
JavaScript의 코드가 OEM Widget, 서비스들을 사용 하기 위해 Bridge 사용

6. 랜더링 방식
Flutter
Dart라는 컴파일 프로그래밍 언어를 사용하여 Bridge로 인해 발생하는 성능 문제를 해결

7. 코드를 변경하면 이전에 동작하던 상태를 유지하며 변경된 코드 동작이 적용
앱 전체를 다시 로드하는 시간도 빨라서 개발할 때 굉장히 편리
Hot Reload

8. Google Material, Apple Cupertino 디자인 시스템 제공
커스텀 디자인

9. 플러터 앱에서 화면 상에 보이는 것은 전부 위젯이다. 하나도 빠짐없이!
Flutter = Widget
https://gallery.flutter.dev/
flutter로 만들 수 있는 UI 위젯 종류

10. 트리구조로 구성

11. 상태에 따른 분리

12. Stateless Widget
상태(State)를 가지고 있지 않은 정적인 위젯

13. Stateful Widget
상태(State)를 가지고 있으며, 상태(State) 에 의해 움직이거나 변하는 위
젯

14. Scaffold Widget
UI를 구성하는 요소를 간편하게 배치할 수 있게 해주는 위젯

15. 멀티 플랫폼 지원
빠른 시간에 좋은 성능의 앱을 개발 할 수 있다.
업데이트가 자주 된다.
선언형 방식의 UI
장점

16. 네이티브 앱 보다 용량을 많이 차지한다.
네이티브 앱 보다 CPU 사용량이 많다.
네이티브 앱 보다 RAM 사용량이 많다.
Code Push 지원 안함
Dart 언어 학습
단점

17. “Flutter랑 React Native 중에 어떤걸 사용해야 하냐?”

18. [플러터 공식문서]
https://flutter-ko.dev
[웹사이트에서 Dart 언어를 실행시켜볼 수 있는 사이트]
https://dartpad.dev/
[플러터 레이아웃 치트시트]
https://medium.com/flutter-community/flutter-layout-cheat-sheet-5363348d037e
[Flutter Flow]
https://flutterflow.io/
[검증된 라이브러리 모음]
https://github.com/Solido/awesome-flutter
유용한 사이트

19. 자료 출처
https://andrewlee1228.github.io/til/Flutter/1.%ED%94%8C%EB%9F%AC%ED%84%B0%EC%86%8C%EA%B0%9C.html
https://velog.io/@tykan/Flutter-%EC%86%8C%EA%B0%9C-%EB%82%98%EB%8A%94-%EC%99%9C-
Flutter%EB%A5%BC-%ED%95%98%EB%8A%94%EA%B0%80
https://velog.io/@kineo2k/Flutter-%EC%86%8C%EA%B0%9C
https://skuld2000.tistory.com/69
https://dev-youngjun.tistory.com/66
https://jaceshim.github.io/2019/01/22/flutter-study-about-flutter/index.html
https://beomseok95.tistory.com/315