Flutter Operation Process
์ฑ ๊ฐ๋ฐ ํ๋ซํผ์๋ Android์ iOS๊ฐ ์์ผ๋ฉฐ, ๊ฐ๊ฐ ๊ณ ์ ํ ์ด์์ฒด์ ์์ ๋ ๋ฆฝ์ ์ผ๋ก ๊ตฌ์ถ๋์ด ์๋ค. ์ด์ ๋ฐ๋ผ ์ฑ์ ๊ฐ๋ฐํ๊ธฐ ์ํด์๋ ๊ฐ ์ด์์ฒด์ ๊ฐ ์๊ตฌํ๋ ๊ฐ๋ฐ ํ๊ฒฝ๊ณผ ๊ท๊ฒฉ์ ๋ง์ถฐ ๋ณ๋๋ก ๊ฐ๋ฐ์ ์งํํด์ผ ํ๋ค.
๊ทธ๋ฌ๋ Flutter๋ฅผ ํ์ฉํ๋ฉด ํ๋์ ์ฝ๋๋ฒ ์ด์ค๋ก Android์ iOS ๋ชจ๋์์ ๋์ํ๋ ์ฑ์ ํจ์จ์ ์ผ๋ก ๊ฐ๋ฐํ ์ ์์ด, ํ๋ซํผ๋ณ ๊ฐ๋ฐ์ ์์๋๋ ์๊ฐ๊ณผ ๋น์ฉ์ ํฌ๊ฒ ์ ๊ฐํ ์ ์๋ค.
Flutter๊ฐ ์ด๋ป๊ฒ ์ด๋ฌํ ๊ฐ๋ฐ ๋ฐฉ์์ ๊ฐ๋ฅํ๊ฒ ํ๋์ง ์ดํดํ๊ธฐ ์ํด, ๋จผ์ Flutter์ ์๋ ์๋ฆฌ๋ฅผ ์ดํด๋ณด์.
iOS์ Android์ ์๋ ๋ฐฉ์
Flutter์ ๊ตฌ์กฐ๋ฅผ ์ดํดํ๊ธฐ ์ํด, ๋จผ์ ๊ธฐ์กด iOS์ Android ์ฑ์ด ์ด๋ป๊ฒ ์๋ํ๋์ง๋ฅผ ์ดํด๋ณผ ํ์๊ฐ ์๋ค.
iOS
iOS๋ ๋ค์ดํฐ๋ธ ์ธ์ด์ธ Swift(๋๋ Objective-C)๋ฅผ ์ฌ์ฉํด ์ฑ์ ๊ฐ๋ฐํ๋ค. ๊ฐ๋ฐ๋ ์ฑ์ iOS๊ฐ ์ ๊ณตํ๋ ๋ค์ดํฐ๋ธ API(SwiftUI, UIKit)๋ฅผ ์ง์ ํธ์ถํ์ฌ ํ๋ฉด์ ๊ทธ๋ฆฌ๊ฑฐ๋ ์์คํ ๊ธฐ๋ฅ์ ์ ์ดํ๋ค.
์์ฑ๋ ์ฝ๋๋ ์ปดํ์ผ ๊ณผ์ ์ ๊ฑฐ์ณ iOS ๋๋ฐ์ด์ค ์์์ ์ง์ ์คํ๋๋ฉฐ, ๋ชจ๋ UI ์์์ ๋์์ iOS๊ฐ ์์ฒด์ ์ผ๋ก ์ ๊ณตํ๋ ๋ ๋๋ง ์์ง์ ์ํด ์ฒ๋ฆฌ๋๋ค.
Android
Android๋ Kotlin ๋๋ Java๋ฅผ ์ฌ์ฉํด ์ฑ์ ๊ฐ๋ฐํ๋ค. ๊ฐ๋ฐ๋ ์ฝ๋๋ Android SDK๋ฅผ ํตํด Android OS๊ฐ ์ ๊ณตํ๋ ๋ค์ดํฐ๋ธ API๋ฅผ ํธ์ถํ์ฌ ๋์ํ๋ค.
๋น๋๋ ์ฑ์ Dalvik ๋๋ ART(Android Runtime) ์์์ ์คํ๋๋ฉฐ, Android OS์ ์์ฒด ๋ ๋๋ง ์์ง์ ํตํด ํ๋ฉด์ ๊ตฌ์ฑํ๊ณ ์ฒ๋ฆฌํ๋ค.
๐ Android SDK: Android ์ฑ ๊ฐ๋ฐ์ ์ํ ๋๊ตฌ ๋ชจ์. API, ๋ผ์ด๋ธ๋ฌ๋ฆฌ, ๋น๋ ๋๊ตฌ ๋ฑ์ ํฌํจํ๋ค. ๐ ART (Android Runtime): Android ์ฑ์ ์คํํ๋ ๋ฐํ์ ํ๊ฒฝ. Android 5.0 ์ดํ Dalvik์ ๋์ฒดํ์ฌ ๊ธฐ๋ณธ ๋ฐํ์์ผ๋ก ์ฌ์ฉ๋๊ณ ์๋ค.
์ด์ฒ๋ผ iOS์ Android๋ ๊ฐ๊ฐ ๋ ๋ฆฝ๋ ๋ฐฉ์์ผ๋ก ์ฑ์ ์คํํ๊ณ ๋ ๋๋ง์ ์ฒ๋ฆฌํ๊ธฐ ๋๋ฌธ์, ํ๋์ ์ฑ์ ๋ ํ๋ซํผ์ ๋ง๊ฒ ๋ณ๋๋ก ๊ฐ๋ฐํด์ผ ํ๋ ๋ฒ๊ฑฐ๋ก์์ด ์กด์ฌํ๋ค.
ํ์ง๋ง Flutter๋ ์ด๋ฌํ ๊ตฌ์กฐ์ ํ๊ณ๋ฅผ ๋์ด, ๋จ์ผ ์ฝ๋๋ฒ ์ด์ค๋ก ์ ํ๋ซํผ ๋ชจ๋์์ ๊ตฌ๋ํ ์ ์๋ ์๋ก์ด ์ ๊ทผ ๋ฐฉ์์ ์ ์ํ๋ค.
Flutter์ ์๋ ๋ฐฉ์
Flutter๋ ๊ฐ ์ด์์ฒด์ ์ ๋ค์ดํฐ๋ธ API๋ฅผ ์ฌ์ฉํ์ง ์๊ณ , ์์ฒด ๋ ๋๋ง ์์ง์ ํตํด ํ๋ฉด์ ์ง์ ๊ทธ๋ฆฌ๋ ๋ฐฉ์์ ์ฑํํ๊ณ ์๋ค.
์กฐ๊ธ ๋ ๊ตฌ์ฒด์ ์ผ๋ก ๋งํ๋ฉด, Flutter๋ Dart ์ธ์ด๋ก ์์ฑ๋ ์ฝ๋๋ฅผ Skia ๊ทธ๋ํฝ ์์ง์ ํตํด ๋ ๋๋งํ์ฌ UI๋ฅผ ํ๋ฉด์ ์ง์ ๊ทธ๋ฆฐ๋ค. ์ด ๊ณผ์ ์ ํตํด Flutter๋ ์ด์์ฒด์ ์ ๊ด๊ณ์์ด ์ผ๊ด๋ UI/UX๋ฅผ ์ ๊ณตํ ์ ์๋ค.
๐ Skia: ๊ตฌ๊ธ์ด ๊ฐ๋ฐํ ์คํ์์ค 2D ๊ทธ๋ํฝ ๋ ๋๋ง ์์ง. Chrome, Android, Flutter ๋ฑ ๋ค์ํ ์ ํ์์ ์ฌ์ฉ๋๊ณ ์๋ค.
Flutter ๋ด๋ถ ์๋ ๋ฐฉ์: flutter run
์ดํ ๊ณผ์
flutter run
์ดํ ๊ณผ์ ์ด์ ๋ณธ๊ฒฉ์ ์ผ๋ก Flutter๊ฐ ๋ด๋ถ์ ์ผ๋ก ์ด๋ป๊ฒ ๋์ํ๋์ง ์์ธํ ์ดํด๋ณด์.
Flutter์์ Dart๋ก ์์ฑํ ์ฝ๋๋ฅผ ์คํํ๊ธฐ ์ํด ํฐ๋ฏธ๋์ flutter run
๋ช
๋ น์ด๋ฅผ ์
๋ ฅํ๋ฉด, ๋ค์๊ณผ ๊ฐ์ ๊ณผ์ ์ด ์์ฐจ์ ์ผ๋ก ์งํ๋๋ค.
1. ํ๋ก์ ํธ ์์กด์ฑ ํ์ธ
Flutter CLI๋ ํ๋ก์ ํธ ๋ด pubspec.yaml
ํ์ผ์ ํ์ธํ์ฌ ํ์ํ ํจํค์ง ์์กด์ฑ์ ๊ฒํ ํ๋ค.
์ด๋, ์์กด์ฑ ์
๋ฐ์ดํธ๋ ์ค์น๊ฐ ํ์ํ ๊ฒฝ์ฐ flutter pub get
๋ช
๋ น์ด๋ฅผ ํตํด ํจํค์ง๋ฅผ ์ค์นํ๋ค.
๐ pubspec.yaml: Flutter ํ๋ก์ ํธ์ ๋ฉํ๋ฐ์ดํฐ(์ฑ ์ด๋ฆ, ๋ฒ์ ๋ฑ)์ ํ์ํ ํจํค์ง ์์กด์ฑ์ ์ ์ํ๋ ํ์ผ.
2. ์ฝ๋ ๋ถ์ ๋ฐ ๋น๋ ์ด๊ธฐํ
Flutter๋ Dart Analyzer๋ฅผ ์ด์ฉํด ํ๋ก์ ํธ์ Dart ์ฝ๋๋ฅผ ๊ฒ์ฌํ๋ค.
์ฝ๋์ ๋ฌธ์ ๊ฐ ์์ผ๋ฉด, ๋น๋๋ฅผ ์ค๋นํ๊ธฐ ์ํด ํ๋ก์ ํธ๋ฅผ ์ด๊ธฐํํ๊ณ , Android/iOS ๋ฑ ๊ฐ ์ด์์ฒด์ (OS)์ ํ์ํ ์ค์ ์ ์ ์ฉํ๋ค.
๐ Dart Analyzer: ์ฝ๋์ ๋ฌธ๋ฒ ์ค๋ฅ๋ ํ์ ์ค๋ฅ๊ฐ ์๋์ง ์ ์ ๋ถ์์ ์ํํ๋ ๋๊ตฌ.
3. ์ปดํ์ผ ๋ฐ ๋ฒ๋ค ํจํค์ง
Debug ๋ชจ๋์์๋ JIT(Just-In-Time) ์ปดํ์ผ์ ์ฌ์ฉํ์ฌ Dart ์ฝ๋๋ฅผ ๋น ๋ฅด๊ฒ ์ปดํ์ผํ๋ค. ์ด ๋๋ถ์ ์ฑ์ ๋น ๋ฅด๊ฒ ์คํํ๊ณ , Hot Reload๋ฅผ ํตํด ์ฝ๋ ๋ณ๊ฒฝ์ฌํญ์ ์ค์๊ฐ์ผ๋ก ๋ฐ์ํ ์ ์๋ค.
๋ฐ๋ฉด, Release ๋ชจ๋์์๋ AOT(Ahead-of-Time) ์ปดํ์ผ์ ์ฌ์ฉํ๋ค. AOT ์ปดํ์ผ์ ์ฑ ์คํ ์ ์ Dart ์ฝ๋๋ฅผ ๊ธฐ๊ณ์ด(native code)๋ก ์์ ํ ๋ณํํ์ฌ ๋น๋ํ๋ฏ๋ก, ์คํ ์๋๊ฐ ๋น ๋ฅด๊ณ ์ต์ ํ๋ ์ฑ๋ฅ์ ๋ผ ์ ์๋ค. ํ์ง๋ง AOT ํน์ฑ์ ๋น๋ ์๊ฐ์ด ๋ ์ค๋ ๊ฑธ๋ฆฌ๊ณ , Hot Reload ๊ธฐ๋ฅ์ ์ง์๋์ง ์๋๋ค.
์ปดํ์ผ๋ ์ฝ๋๋ ์ฑ์ ๋ฆฌ์์ค, ์ฝ๋, ๋ฉํ๋ฐ์ดํฐ ๋ฑ์ ํฌํจํ๋ ๋ฒ๋ค(bundle)๋ก ํจํค์ง๋๋ค.
๐ JIT (Just-In-Time) ์ปดํ์ผ: ํ๋ก๊ทธ๋จ ์คํ ์ค์ ์ฝ๋๋ฅผ ์ฆ์(๋ฐํ์ ์์ ) ์ปดํ์ผํ์ฌ ์คํํ๋ ๋ฐฉ์. ๊ฐ๋ฐ ๋จ๊ณ์์ ๋น ๋ฅธ ์คํ๊ณผ Hot Reload๋ฅผ ๊ฐ๋ฅํ๊ฒ ํ์ง๋ง, ์ต์ข ๋น๋(Release)๋ณด๋ค ์ฑ๋ฅ์ด ๋ค์ ๋จ์ด์ง ์ ์๋ค.
4. Flutter ์์ง ๊ตฌ๋
๋ฒ๋ค ํจํค์ง์ด ์๋ฃ๋๋ฉด, ๊ฐ๋ฐ ๋๋ฐ์ด์ค(์ค์ ๋๋ฐ์ด์ค ๋๋ ์๋ฎฌ๋ ์ดํฐ)์ Flutter ์์ง์ ๊ตฌ๋ํ๋ค. Flutter ์์ง์ ๋ค์๊ณผ ๊ฐ์ ํต์ฌ ์ญํ ์ ์ํํ๋ค:
Skia๋ฅผ ํตํ UI ๋ ๋๋ง
Dart VM์ ํตํ ์ฝ๋ ์คํ
ํ๋ ์ ์์ฑ ๋ฐ ์ ๋๋ฉ์ด์ ๊ด๋ฆฌ
์ฌ์ฉ์ ์ ๋ ฅ ๋ฐ ์ด๋ฒคํธ ์ฒ๋ฆฌ
๐ Dart VM: Dart ์ธ์ด๋ก ์์ฑ๋ ์ฝ๋๋ฅผ ์คํํ๋ ๊ฐ์ ๋จธ์ (Virtual Machine).
5. ํ๋ซํผ Shell ์ฐ๊ฒฐ
Flutter ์์ง์ ๊ฐ ์ด์์ฒด์ ์ ํต์ ํ๊ธฐ ์ํด ํ๋ซํผ ๋ณ๋ก Shell์ ์์ฑํ๋ค.
๐ Shell: Flutter ์์ง๊ณผ ๊ฐ ์ด์์ฒด์ (Android, iOS) ๊ฐ์ ๋ฉ์์ง๋ฅผ ์ฃผ๊ณ ๋ฐ๊ณ , ๋ ๋๋ง ๊ฒฐ๊ณผ๋ฅผ ์ ๋ฌํ๋ ์ค๊ฐ ๊ณ์ธต.
Android์์๋
FlutterActivity
๋ฅผ ํตํด ๋ค์ดํฐ๋ธ ํ๊ฒฝ๊ณผ ์ฐ๊ฒฐ๋๋ค.๐ FlutterActivity: Android Native ์ฑ ์์์ Flutter ์์ง์ ๊ตฌ๋ํ๊ณ ํ๋ฉด์ ํ์ํ๋ ๊ธฐ๋ณธ ์ํธ๋ฆฌ ํฌ์ธํธ(Activity).
iOS์์๋
FlutterViewController
๋ฅผ ํตํด ์ฐ๊ฒฐ๋๋ค.๐ FlutterViewController: iOS ์ฑ์์ Flutter ์์ง์ ํธ์คํ ํ๊ณ , Flutter์ ๋ทฐ๋ฅผ ํ์ํ๋ ์ปจํธ๋กค๋ฌ(ViewController).
6. ์ฑ ์คํ ๋ฐ ์ฒซ ๋ฒ์งธ ํ๋ ์ ๋ ๋๋ง
Flutter๋ ์ฑ์ ์ง์
์ ์ธ main()
ํจ์๋ฅผ ํธ์ถํ์ฌ ์คํ์ ์์ํ๋ค.
๊ทธ ํ, ์์ ฏ ํธ๋ฆฌ๋ฅผ ๊ตฌ์ฑํ๊ณ , Skia ์์ง์ ํตํด ์ฒซ ๋ฒ์งธ ํ๋ ์์ ํ๋ฉด์ ๋ ๋๋งํ๋ค.
์์ฝ
Flutter๋ ๊ธฐ์กด iOS์ Android์ ๋ณต์กํ ๋ค์ดํฐ๋ธ ๊ฐ๋ฐ ๋ฐฉ์์ ๋์ฒดํ์ฌ, ํ๋์ ์ฝ๋๋ฒ ์ด์ค๋ก ์ ํ๋ซํผ์ ๋์์ ์ง์ํ ์ ์๊ฒ ํ๋ค. Flutter ๋ด๋ถ ๊ตฌ์กฐ๋ฅผ ์ดํดํ๋ฉด, ๋จ์ํ "ํฌ๋ก์ค ํ๋ซํผ"์ด๋ผ๋ ์ฅ์ ์ ๋์ด, ์ด๋ป๊ฒ Flutter๊ฐ ๋น ๋ฅธ ๊ฐ๋ฐ ์๋์ ์ผ๊ด๋ ์ฌ์ฉ์ ๊ฒฝํ์ ์ ๊ณตํ ์ ์๋์ง ๋ณด๋ค ๊น์ด ์๊ฒ ์ดํดํ ์ ์๋ค.
Last updated