Flutter 면접 질문 (2022) (flutter tech interview questions)

Flutter Interview Questions (2022)

https://www.interviewbit.com/flutter-interview-questions/#flutter-advantages

For Freshers (신입용)

1. Flutter의 장점

1. 개발 시간 단축 (Hot Reload) : Hot Reload 기능으로 개발 시간을 단축할 수 있다.
2. 크로스 플랫폼 개발 가능 : 현재 Android, IOS, Web, Windows, macOS, Linux 지원
3. Live and Hot Reloading : 파일이 수정되거나 업데이트 되었을 때 Hot Reloading이 진행되면서 앱 개발 프로세스를 단축시킬 수 있다.
4. 풍부한 UI Widget : 유연하고 다양한 UI Widget을 제공하기 때문에 UI 작업을 간소화해준다.
5. 활발한 커뮤니티와 질 좋은 documents

2. Flutter Architechture (아키텍쳐)

Flutter의 구조는 세 개의 레이어로 구성됩니다.

1. Framework (Upper Layers) : app Widgets, Gestures, Animations, Illustrations, Materials를 처리하는 Dart 기반 플랫폼.
2. Engine : 새로 화면을 그릴 때 마다 화면을 래스터화한다. (디스플레이 처리)
3. Embedder : Plugins, Packages, and Event Loop를 관리한다.

정확한 설명인지 잘 모르겠음...

3. Flutter의 주요 특징

1. 유연성, 확장성, 통합성 : flutter의 framework는 easy-to-use, easy-to-integrate
2. Hot Reload : 코드 수정 시 Hot Reload로 변경사항을 즉시 앱에서 확인할 수 있다.
3. One-Stop Solution : 개발, 배포, 관리를 단일 framework와 platform에 의존한다.
4. 네이티브 성능과 국제화된 flutter library : Android, iOS, Google Fuchsia에 맞게 사용자 정의된 위젯을 제공하여 플랫폼의 모든 기능을 통합할 수 있다.
5. 굉장한 Widget Library

4. Flutter의 한계

1. 타사 라이브러리에 제한적
2. Release 크기가 큼
3. Dart의 요구사항
4. 제한된 복잡성 : 3D 모델링, Unity 통합 및 게임 엔진이 부족
5. 전반적인 지원 부족 : 아직 널리 사용되고 있지 않음

5. Flutter의 Build Mode

1. Debug Mode : 실기기, 에뮬레이터, 시뮬레이터에서 앱을 디버깅할 수 있다. Assertions와 Service extension이 활성화된다. 그런 다음 컴파일을 최적화하여 빠른 배포를 수행한다.
2. Profile Mode : 프로필 모드에서는 앱의 성능을 분석하기에 충분할 정도의 일부 디버깅 기능이 유지된다. 이 경우 추적 및 일부 확장이 활성화되지만 에뮬레이터와 시뮬레이터에서 프로필 모드는 동작이 실제 성능을 재현하지 않기 때문에 사용할 수 없다.
flutter run --profile 명령어로 실행.
3. Release Mode : 앱을 배포할 때, 릴리즈 모드는 설치 공간 크기를 최소화하고 최적화를 극대화한다. Debugging, Assertions, Service extensions는 여기서 사용할 수 없다. 빠른 시작, 빠른 실행, 작은 크기가 핵심 기능이다.
flutter run --release 명령어로 실행.

6. Flutter의 Widget과 그의 중요성

일반적으로 Flutter 앱은 여러 위젯으로 구성된다. (위젯을 서로 중첩하여 구축된다.)
위젯은 사용자 인터페이스를 선언하고 생성하는 방법이다.
Flutter에서 무엇이든 빌드하려면 위젯 내부에 코드를 작성해야 합니다.

Class ImageWidget extends StatelessWidget {   
    // Class Stuff   
}  

7. StatelessWidget vs StatefulWidget

StatelessWidget : 화면이 로드될 때 한 번만 그려지는 State가 없는 위젯. 변경되지 않으며 이벤트 또는 사용자 상호 작용에 의해 동작하지 않는다.
StatefulWidget : 위젯이 동작하는 동안 Data 변경이 필요한 경우 화면을 다시 그려서 변경된 부분을 위젯에 반영하는 동적인 위젯으로 이벤트 또는 사용자 상호 작용에 의해 위젯의 모양을 변경한다.

위젯의 상태는 State 개체에 저장되며 위젯의 상태와 모양을 구분한다.
상태는 변경할 수 있는 값으로 구성되며, 위젯의 상태가 변경되면 상태 개체가 setState()를 호출하여 프레임워크에 위젯을 다시 그리도록 지시한다.

8. Dart 란?

Google에서 개발한 프로그래밍 언어인 Dart는 Flutter 앱과 서버 및 데스크톱 애플리케이션을 코딩하는 데 사용된다.
Dart를 사용함으로써 Flutter는 JSX 또는 XML과 같은 별도의 선언적 레이아웃 언어를 사용하지 않는다.

Dart의 중요성

• Dart의 레이아웃이 선언적이고 프로그래밍적이기 때문에 매우 쉽고 쉽게 읽고 시각화할 수 있다.
• 다른 프로그래밍 언어와 달리 Class, Inteface 및 functions 와 같은 기본 프로그래밍 개념의 대부분을 지원한다.
• 배열(Array)은 Dart에서 직접 지원하지 않습니다. 오히려 arrays, generics, optional typing 과 같은 데이터 구조를 복제하는 컬렉션을 지원한다.
• JavaScript와 유사하지만 Dart는 코드를 몇 배 더 빠르게 실행한다.
• 더 나은 성능과 코드 실행 시간을 줄이기 위해 Dart 가상 머신(VM)은 JIT(Just-in-Time) 및 AOT(Ahead-of-Time) 컴파일러를 모두 사용한다.
• Dart는 객체 지향 프로그래밍이므로 복잡한 응용 프로그램을 만드는 데에도 매우 확장 가능하고 안정적이다

9. App State 란?

App State는 shared state 또는 application state라고도 한다. 앱의 여러 섹션에서 앱 상태를 공유하고 동일한 방식으로 사용자 세션을 유지할 수 있다.

10. runApp() vs main()

main()은 프로그램의 시작점 역할, runApp()은 주어진 위젯을 화면에 부착하는 역할을 한다.
첫 번째 위젯이 화면에 올라오기 전에 main()에서 여러 항목들을 미리 구성할 수 있다.

• Theme colors
• Home page
• User's sign-in status
• Version-specific widgets

11. Packages vs Plugins

Packages : 네이티브 코드를 사용하여 사용성이 향상되고 장치와의 호환성이 좋다.
Plugins : Dart 만으로 구성된 코드들이다.
(결국 plugin은 package에 속한다.)

12. Flutter와 맞는 editor

• Android Studio
• Visual Studio
• IntelliJ IDEA
• Xcode
• Eclipse
• Emacs
• Vim

13. Flutter를 주로 사용하는 앱

• Google Ads
• Reflectly
• Alibaba
• Birch Finance
• Coach Yourself
• Tencent
• Watermaniac

14. Flutter에서의 key 란?

Key : 각 요소의 식별자. 키를 사용하여 동일한 위젯으로 구성된 컬렉션을 재정렬하고 수정할 수 있다. 키의 주된 용도는 StatefulWidget을 포함하는 Widget Tree를 수정하는 것이다.

15. Flutter의 Container 란?

Container : 여러 child Widget을 수용하고 margin, padding, color을 통해 효율적으로 사용할 수 있는 위젯이다. color, shape, size 제한으로 인해 위젯의 배경에 스타일을 지정하려는 경우 컨테이너 위젯을 사용할 수 있다.

16. Flutter vs React-Native

Flutter : Dart 프로그래밍언어를 사용하는 크로스 플랫폼 앱 개발 프레임 워크.
React Native : 사용자 인터페이스를 구축하기위한 크로스 플랫폼 모바일 프레임 워크. React 프레임 워크와 Javascript의 기능을 활용하여 iOS 및 Android 앱 개발.

17. mainAxisAlignment vs crossAxisAlignment

mainAxisAlignment : Row의 경우 horizontal axis, Column의 경우 vertical axis
crossAxisAlignment : Row의 경우 vertical axis, Column의 경우 horizontal axis

18. Flutter는 OpenSource인가?

YES. Flutter는 개발자가 크로스 플랫폼 모바일 앱을 쉽게 구축할 수 있도록 해주는 Google의 무료 오픈 소스 UI tool kit이다.

19. Flutter의 Build 시간이 오래 걸리는 이유

Flutter 앱을 처음 빌드할 때 Flutter가 기기별 IPA나 APK 파일을 빌드하기 때문에 평소보다 시간이 매우 오래 걸린다.
이 프로세스에서 Xcode와 Gradle은 파일을 빌드하는 데에 사용되는데 이 또한 시간이 오래 걸린다.

20. Flutter Inspector 란?

Flutter Inspector를 사용하면 위젯과 해당 속성의 blueprint를 시각화해서 볼 수 있다.
Flutter Inspector 다음과 같은 이점을 제공한다.

• Select widget mode
• Toggle platform
• Show paint baselines
• Show debug paint
• Refresh widget
• Enable slow animations
• Show/hide performance overlay

21. Flutter에서 Ticker 란? (Ticker vs Timer)

Ticker : flutter에서 animation을 얼마나 자주 새로고침하는지 확인하기 위해 사용. 신호는 초당 60회 등 일정한 주파수로 전송된다. Ticker는 화면의 새로 고침 빈도를 사용하기 때문에 Fluter가 새 프레임을 렌더링할 때마다 UI를 업데이트할 수 있다. Ticker의 콜백은 위젯이 현재 보이는 경우에만 호출된다. 애플리케이션 상태가 (setState() 또는 다른 수단을 통해) 변경되고 Flutter가 UI를 업데이트해야 한다고 판단하면, 다음 예정된 프레임에서 진행한다.

Timer : Timer 개체를 사용하여 UI를 정기적으로 업데이트하도록 사용한다. 정기적으로 UI를 업데이트하려면 StatefulWidget을 만들고 initState() 내부에 타이머를 구성할 수 있다.

22. 디버그 모드에서만 코드를 실행하려면?

import 'package:flutter/foundation.dart' as Foundation;    

// The next step is to use kReleaseMode as follows: 

if (Foundation.kReleaseMode){     // is Release Mode??   
	print('release mode');   
} else {   
	print('debug mode');   
}

23. Mixin 이란?

Dart에서 다중 상속을 지원하지 않기 때문에 Flutter/Dart에서 다중 상속을 구현하려면 Mixin이 필요하다.
믹스인을 사용하면 여러 클래스 계층 수준에서 재사용 가능한 클래스 코드를 쉽게 작성할 수 있습니다.

---

For Experienced (경력용)

24. Stream 이란?

Stream : Stream이란 데이터나 이벤트가 들어오는 통로. 비동기 프로그래밍에서 데이터 시퀀스를 제공하는 데에 사용된다. 한 쪽에서 값을 넣고 반대쪽에서 listener가 값을 받는 구조이다. 하나의 스트림에 여러 listener가 존재할 수 있으며, 모두 동일한 값을 얻는다. Stream Cotroller를 통해 스트림을 생성하고 관리할 수 있다.

25. Stream의 유형은?

Single Subscription Streams(단일 구독 스트림) : 이벤트를 순차적으로 전달한다. 이벤트가 수신되는 순서가 중요한 경우에 사용된다. 시퀀스 전체에서 수신자는 한 명만 있을 수 있으며, 수신자가 없으면 이벤트가 트리거되지 않는다. 이러한 스트림은 한 번만 수신할 수 있다.

Broadcast Stream : 다른 종류의 스트림은 한 번에 하나씩 처리할 수 있는 개별 메시지를 위한 것이다. 구독자에게 이벤트를 전달하는 용도로 구독자는 이벤트에 가입하면 즉시 이벤트에 대한 청취 작업을 시작할 수 있다. 여러 청취자가 동시에 청취할 수 있는 다용도 스트림이며, 이전 구독을 취소한 후에도 다시 들을 수 있다.

26. Flutter SDK 란?

Flutter SDK(소프트웨어 개발 키트)를 사용하면 개발자가 단일 코드베이스를 사용하여 모바일, 웹, 데스크톱용 애플리케이션을 빌드할 수 있다.
ex) flutter build windows

27. Hot Reload vs Hot Restart

Hot Reload : 새로운 코드를 파일에 빠르게 컴파일해 DVM(Dart Virtual Machine)으로 전송할 수 있으며, DVM이 업데이트를 완료하면 앱 UI가 업데이트된다. Hot Reload 시 보존 상태가 파괴되지 않는다.

Hot Restart : 앱의 보존 상태가 파괴되고 코드가 처음부터 다시 컴파일된다. Hot Reload보다 시간이 오래 걸리지만 full restart 보다 빠르다.

28. BuildContext 란?

BuildContext : widget tree에서 현재 widget의 위치를 알 수 있는 정보. 각 위젯에는 고유한 BuildContext가 있으며, 이는 StatelessWidget.build 또는 State.build 에 의해서 반환된 위젯의 상위 컨텍스트가 된다. 상위 위젯과 상호 작용하고 위젯 데이터에 액세스하는데 사용할 수 있다.

29. Widget Testing 이란?

Flutter는 세 가지 유형의 테스트를 지원한다.

1. 단위 테스트(Unit Tests) : 단위 테스트를 사용하여 클래스 또는 메서드를 테스트할 수 있다. 단위 테스트는 화면에 대한 렌더링, 외부 서비스와의 상호 작용 또는 사용자 상호 작용은 확인하지 않는다.
2. 위젯 테스트(Widget Tests) : 위젯 테스트를 사용하여 단일 위젯을 테스트할 수 있다. 위젯의 UI가 예상대로 표시되고 이벤트에 적절하게 응답하는지 확인한다. 즉, 위젯 디자인, 렌더링 및 다른 위젯과의 상호 작용을 보장한다.
3. 통합 테스트(Integration Tests) : 통합 테스트를 사용하여 전체 앱의 중요한 흐름을 테스트할 수 있다. 모든 위젯과 서비스가 예상대로 함께 작동하는지 확인하는 것이 중요하다. 또한 이를 사용하여 앱의 성능을 측정하고 벤치마킹할 수 있다.

30. 상태관리란? (State Management)

State Management(상태관리) : Flutter는 앱의 현재 상태를 반영하기 위해 사용자 인터페이스를 구축한다. 예를 들어 앱 상태가 변경되면 사용자 인터페이스의 다시 그리기가 트리거된다. 이를 사용하면 다양한 UI 컨트롤의 상태가 중앙 집중화되어 애플리케이션 전반의 데이터 흐름을 처리할 수 있습니다

1. Ephemeral state(임시 상태) : 임시 상태는 UI 상태 또는 로컬 상태라고도 하며 특정 위젯에 포함된 상태이다.
2. App State : 사용 후 삭제되지 않은 상태, 앱의 많은 부분에서 공유하고자 하는 상태이자 사용자 세션 간에 유지하고자 하는 상태를 애플리케이션 상태(또는 공유 상태)라고 한다. (사용자 설정, 로그인 정보 등)

31. pubspec.yaml 파일이란?

프로젝트에 필요한 패키지 및 해당 버전, 글꼴 등과 같은 종속성에 대한 정보를 가진 파일.
다음에 프로젝트를 빌드할 때 동일한 패키지 버전을 얻게 된다. 또한 앱에 대한 제약 조건을 설정할 수 있다.

포함된 내용

• 프로젝트 이름, 버전, 설명 등과 같은 일반 프로젝트 설정
• 프로젝트 내의 종속성.
• 프로젝트의 자산(예: 이미지, 오디오 등)

32. Tween Animation 이란?

flutter의 animation 중 하나로 시작점과 끝점이 있으며 타이밍과 속도에 대한 곡선을 정의할 수 있다. 이 방법을 사용하면 애니메이션은 start point부터 시작할 수 있으며 end point에 도달할 때까지 일련의 값을 통해 진행할 수 있다. 전환 속도 및 지속 시간도 애니메이션을 사용하여 결정된다.

33. Flutter에서 HTTP Request

import 'package:http/http.dart' as http;

http.get(url); 

Future <http.Response>로 반환한다.

34. Flutter에서 주로 사용되는 데이터베이스 패키지

Firebase

사용자에게 클라우드 데이터베이스에 대한 액세스 권한 및 제어 권한을 제공한다. Firebase는 기본적으로 NoSQL 데이터베이스를 제공하는데, 이는 JSON 프로토콜을 통해 데이터 검색 및 저장을 관리할 수 있는 기능을 갖춘 Flutter 앱용이다. 데이터 동기화 와 빠른 로딩으로 Flutter 앱에 가장 적합한 옵션 중 하나이다.

• Features :
  NoSQL DB
  APIs (REST only)
  Authentication
  Analytics
  Storage

SQFite

사용자에게 SQLite 데이터베이스에 액세스 권한 및 제어 권한을 제공한다. SQLite를 사용하면 데이터베이스, 쿼리, 관계 및 원하는 모든 것을 완벽하게 제어할 수 있다.

• Features:
  Serverless
  Zero configuration
  Open-Source
  Compact
  Single DB file

35. Flutter Provider 란?

Provider는 상태 관리를 처리하는 가장 간단한 방법이다. 생성(Provider) 부분에서는 사용할 데이터 타입을 결정하고 해당 데이터에 대한 Provider를 만들고, 소비(Consumer) 부분에서는 Provider를 통해 데이터를 불러오거나 수정하는 등의 작업을 진행한다.

ChangeNotifier : 데이터가 변경되면 Consumer에게 notify
ChangeNotifierProvider : 하위 위젯에 "ChangeNotifier"를 제공해주는 클래스
Consumer : Provider의 데이터를 받아서 사용하는 클래스

36. await 이란?

Async 메서드가 종료될 때 까지 프로세스를 중단하는 것. 일반적으로 반환 값을 얻을 수 있도록 비동기 메서드가 완료될 때까지 대기하는 것이다. await은 async method에만 사용할 수 있다.

37. Container vs SizedBox

Container : 여러 child widget을 가질 수 있으며 색상이나 형태를 쉽게 변경할 수 있다. height와 width가 지정되지 않으면 최대 크기로 지정한다.
SizedBox : 하나의 child widget만 가질 수 있으며, child widget이 특정 크기를 갖도록 강제한다. height나 width가 지정되지 않으면 child widget의 크기에 맞춘다.

38. null operator (Null 연산자)

"??=" assignment operator (할당 연산자) : 변수가 null인 경우에만 변수에 값을 할당

a ??= 10;		// a가 null이면 10 할당.

"??" null-aware operator (null 인식 연산자) : 첫 번째 단계에서 null 여부를 확인하고 null인 경우 해당 값 반환. 그렇지 않으면 표현식 2가 평가되고 해당 값이 반환.

a = b ?? 10;		// b가 null이면 b, null이 아니면 10.

"?." Safe Navigation operator (안전 탐색 연산자 / Elvis 연산자) : 객체가 null이 아니면 객체의 메서드를 가져온다. null이면 null 반환.

obj?.child?.getter		// obj, child 모두 null이 아니면 getter.

---

My own experience

39. Abstract (extends) vs Interface (implements) vs Mixin (with)

Abstract와 Interface는 메소드만 선언하고 자식클래스에서 구현.
Abstract는 다중 상속이 불가능하고, Interface는 다중상속 가능.

Abstract와 Interface는 모든 메소드를 상속받아야 함.
Mixin은 필요한 것만 상속받아 사용할 수 있음.

40. FutureBuilder vs StreamBuilder

FutureBuilder와 StreamBuilder는 둘 다 비동기처리이지만 FutureBuilder는 일회성 응답에 사용되고, StreamBuilder는 데이터를 여러번 가져오는 데에 사용된다. 즉, 계속해서 데이터의 변화를 감지하고 그에 맞춰 적절한 처리를 할 때 사용된다.

flutter 면접 준비하다가 좋은 사이트를 찾아서 가져와봤다. 영어로 되어있어서 정리할겸 하고 가볍게 시작했는데 몇시간이 걸렸는지..! 기술면접은 신입 때도 힘들었는데 경력직이어도 쉽지 않다..