ALOHA CLASS
/
Front-End
/
Flutter
Search
Duplicate
Share
์ํ ๊ด๋ฆฌ
Provider
Provider
๋
Flutter์์ ๊ธฐ๋ณธ์ ์ผ๋ก ์ ๊ณตํ๋ ์ํ ๊ด๋ฆฌ ๋ผ์ด๋ธ๋ฌ๋ฆฌ
์ ๋๋ค.
โข
ChangeNotifier
๋ฅผ ํ์ฉํ
์ํ ๊ด๋ฆฌ
๊ฐ ๊ฐ๋ฅํ๋ฉฐ,
์์กด์ฑ ์ฃผ์ (DI)
๊ธฐ๋ฅ๋ ์ง์
โข
๋น๊ต์
๊ฐ๋จํ ์ฑ
์์ ์ฌ์ฉํ๊ธฐ ์ข์ผ๋ฉฐ,
Flutter ๊ณต์์ ์ผ๋ก ๊ถ์ฅํ๋ ๋ฐฉ์
Provider์ ํต์ฌ ๊ฐ๋
์ฃผ์ ๊ฐ๋
๊ฐ๋
์ค๋ช
ChangeNotifier
์ํ ๋ณํ๋ฅผ ์๋ฆฌ๋ ํด๋์ค
ChangeNotifierProvider
ChangeNotifier
๋ฅผ UI์ ์ฐ๊ฒฐ
Consumer
์ํ ๋ณ๊ฒฝ์ ๊ฐ์งํ์ฌ UI ์ ๋ฐ์ดํธ
Provider.of()
Provider์์ ์ง์ ์ํ ๊ฐ์ ธ์ค๊ธฐ
context.watch()
์ํ ๋ณํ๋ฅผ ๊ฐ์งํ์ฌ ๋น๋
context.read()
์ํ ๋ณํ๋ฅผ ๊ฐ์งํ์ง ์๊ณ ์ฝ๊ธฐ
Provider์ ์ฃผ์ ๊ธฐ๋ฅ๊ณผ ํน์ง
1. ๊ฐ๋จํ ์ํ ๊ด๋ฆฌ
โข
ChangeNotifier
๋ฅผ ์ฌ์ฉํ์ฌ
์ํ๋ฅผ ๋ณ๊ฒฝํ๊ณ UI์ ๋ฐ์
โข
notifyListeners()
๋ฅผ ํธ์ถํ๋ฉด
์๋์ผ๋ก UI ์ ๋ฐ์ดํธ
2. ์์กด์ฑ ์ฃผ์ (DI) ์ง์
Provider
Riverpod
: Flutter ์ํ๊ด๋ฆฌ ๋ผ์ด๋ธ๋ฌ๋ฆฌ
Riverpod
์ Flutter ๊ณต์ ์ํ๊ด๋ฆฌ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ธ
Provider
์ ๊ฐ์ ๋ ๋ฒ์ ์ผ๋ก, ๋ ์์ ํ๊ณ ๊ฐ๋ ฅํ ์ํ ๊ด๋ฆฌ๋ฅผ ์ ๊ณตํฉ๋๋ค.
Riverpod์ ์ฃผ์ ํน์ง
1.
์ ์ญ ์ํ ๊ด๋ฆฌ ๊ฐ๋ฅ
โข
Provider์ฒ๋ผ
BuildContext
๊ฐ ํ์ํ์ง ์์ โ ์ ์ญ์์ ์ํ ๊ด๋ฆฌ ๊ฐ๋ฅ
2.
์์ ํ ์ํ ๊ด๋ฆฌ
โข
StateNotifier
๋ฅผ ์ฌ์ฉํด
๋ถ๋ณ ์ํ ๊ด๋ฆฌ
์ง์
โข
FutureProvider
,
StreamProvider
๋ก ๋น๋๊ธฐ ๋ฐ์ดํฐ ์ฒ๋ฆฌ ๊ฐ๋ฅ
3.
์์กด์ฑ ์ฃผ์ (DI)
์ง์
โข
์ฌ๋ฌ Provider ๊ฐ ์์กด ๊ด๊ณ๋ฅผ ์ฝ๊ฒ ์ค์ ๊ฐ๋ฅ
4.
ref.watch
,
ref.read
,
ref.listen
ํ์ฉ ๊ฐ๋ฅ
โข
ref.watch()
โ ์ํ๊ฐ ๋ณ๊ฒฝ๋ ๋๋ง๋ค UI ์ ๋ฐ์ดํธ
โข
ref.read()
โ ์ํ ๊ฐ์ ์ฆ์ ๊ฐ์ ธ์ค์ง๋ง UI ๋ฆฌ๋ ๋๋ง ์์
โข
ref.listen()
โ ํน์ ๊ฐ์ด ๋ณ๊ฒฝ๋ ๋ ์ฝ๋ฐฑ ์คํ
Riverpod ์ค์น
๋๋
Riverpod
GetX
: Flutter ์ํ๊ด๋ฆฌ, ๋ผ์ฐํ , ์์กด์ฑ ์ฃผ์ ๋ผ์ด๋ธ๋ฌ๋ฆฌ
GetX
๋ Flutter์์
์ํ๊ด๋ฆฌ, ๋ผ์ฐํ , ์์กด์ฑ ์ฃผ์ (DI)
์ ํ ๋ฒ์ ํด๊ฒฐํ ์ ์๋ ๊ฐ๋ ฅํ๊ณ ๊ฐ๋ฒผ์ด ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ ๋๋ค.
GetX์ ์ฃผ์ ํน์ง
๊ฐ๋จํ ์ํ๊ด๋ฆฌ
โ
obs
(Observable) ๋ณ์๋ฅผ ์ฌ์ฉํ์ฌ ์ํ ์๋ ์ ๋ฐ์ดํธ
๋น ๋ฅธ ์ฑ๋ฅ
โ ์ต์ํ์ ๋ฆฌ์์ค๋ฅผ ์ฌ์ฉํ์ฌ ์ต์ ํ๋จ
๋ผ์ฐํ ๊ด๋ฆฌ
โ
Get.to()
,
Get.off()
๋ก ๊ฐํธํ๊ฒ ํ๋ฉด ์ด๋
์์กด์ฑ ์ฃผ์ (DI)
โ
Get.put()
,
Get.find()
๋ก ๊ฐ์ฒด๋ฅผ ์ฝ๊ฒ ์ฃผ์
๋ณ๋์
context
๋ถํ์
โ
BuildContext
์์ด UI ์ ๋ฐ์ดํธ ๊ฐ๋ฅ
๋ค์ํ ํ๋ซํผ ์ง์
โ ๋ชจ๋ฐ์ผ, ์น, ๋ฐ์คํฌํฑ๊น์ง ์ง์
GetX ์ค์น
GetX
Bloc (Business Logic Component)
Bloc
(Business Logic Component)์
Flutter ๊ณต์ ํ์์ ์ง์ํ๋ ๊ฐ๋ ฅํ ์ํ๊ด๋ฆฌ ๋ผ์ด๋ธ๋ฌ๋ฆฌ
์ ๋๋ค.
์ด๋ฒคํธ ๊ธฐ๋ฐ ์ํ ๊ด๋ฆฌ ๋ฐฉ์์ ์ฌ์ฉํ๋ฉฐ,
๋๊ท๋ชจ ํ๋ก์ ํธ
์์
๊ตฌ์กฐ์ ์ด๊ณ ์ ์ง๋ณด์๊ฐ ์ฌ์ด ์ฝ๋
๋ฅผ ์์ฑํ๋ ๋ฐ ์ ํฉํฉ๋๋ค.
Bloc์ ํต์ฌ ๊ฐ๋
Cubit vs Bloc
โข
Cubit
: ๊ฐ๋จํ ์ํ ๊ด๋ฆฌ (๋จ์ผ ์ํ ๋ณ๊ฒฝ)
โข
Bloc
: ์ด๋ฒคํธ ๊ธฐ๋ฐ ์ํ ๊ด๋ฆฌ (์ฌ๋ฌ ์ด๋ฒคํธ ์ฒ๋ฆฌ ๊ฐ๋ฅ)
๊ตฌ๋ถ
Cubit
Bloc
์ฌ์ฉ ๋ฐฉ์
emit()
์ผ๋ก ์ํ ๋ณ๊ฒฝ
์ด๋ฒคํธ โ ์ํ ๋ณ๊ฒฝ
์ฝ๋ ๋ณต์ก๋
๊ฐ๋จํจ
๋ค์ ๋ณต์ก
์ด๋ฒคํธ ์ฒ๋ฆฌ
์์
์์
์ฑ๋ฅ ์ต์ ํ
๋น ๋ฆ
์ฐ์ํจ
์ถ์ฒ ์ฉ๋
๊ฐ๋จํ ์ํ ๊ด๋ฆฌ
๋ณต์กํ ์ํ ๋ก์ง
Bloc์ ์ฃผ์ ๊ธฐ๋ฅ๊ณผ ํน์ง
1. ์ด๋ฒคํธ ๊ธฐ๋ฐ ์ํ ๊ด๋ฆฌ
โข
Bloc
์ ์ฌ์ฉํ๋ฉด **์ฌ์ฉ์์ ์ ๋ ฅ(์ด๋ฒคํธ)**์ ๋ฐ์
์๋ก์ด ์ํ
๋ก ๋ณ๊ฒฝ
โข
์ด๋ฒคํธ์ ์ํ๊ฐ ๋ถ๋ฆฌ๋์ด
ํ ์คํธ๊ฐ ์ฉ์ด
Bloc