Jetpack Compose๋ ๋ค์ดํฐ๋ธ UI๋ฅผ ๋น๋ํ๊ธฐ ์ํ Android์ ์ต์ ๋๊ตฌ ํคํธ์ ๋๋ค. ์ ์ ์์ ์ฝ๋, ๊ฐ๋ ฅํ ๋๊ตฌ ๋ฐ ์ง๊ด์ ์ธ Kotlin API๋ฅผ ์ฌ์ฉํ์ฌ ์ฑ์ ๋น ๋ฅด๊ณ ์๋๊ฐ ์๊ฒ ๊ตฌํํ ์ ์์ต๋๋ค.
Compose๋ก UI ๊ตฌ์ฑ ๋ฐฉ๋ฒ
ใ์ค์ค์์ ์๋๋ก์ด๋ ์์กด์ฝ๋ฉ ์ฝํ๋ฆฐํธใ์ ์์ ๋ฅผ Compose๋ก ์์ฑํ๊ธฐ
Compose์ ์ฐ๋ํ๊ธฐ ์ํ ViewModel ์์ฑ ๋ฐฉ๋ฒ
Jetpack Compose์ ํจ๊ป
์ข ๋ ๋ชจ๋ํ ์๋๋ก์ด๋ UI ๋ง๋ค๊ธฐ
๊ธฐ์กด ์๋๋ก์ด๋ ๊ฐ๋ฐ์๋ ์ด๋ค ์ด๋ ค์์ด ์์๊น์? ์ถ์ํ๋ ์ด๋ํฐ์ ์์ฑ, ๋ณต์กํ ํ๋ ์์ํฌ์ ์ฝ๋๋ค, ๋ฆฌ์กํธ ์ฑ ๊ฐ๋ฐ์ ์ด๋ ค์...
Compose๋ ์ด๋ฌํ ๋ถ๋ถ๋ค์ ๊ฐ์ ํ๊ธฐ ์ํ ๋ง์ ๋
ธ๋ ฅ์ด ๋ด๊ธด ๋ผ์ด๋ธ๋ฌ๋ฆฌ์
๋๋ค. Compose๋ฅผ ํตํด์ ๋ค์ดํฐ๋ธ ์๋๋ก์ด๋ ์ฑ์ ์ข ๋ ๋น ๋ฅด๊ณ ์ฝ๊ฒ ๋ง๋ค ์ ์์ต๋๋ค.
์คํฌ๋กค์ด ๋๋ ๋ฆฌ์คํธ๋ฅผ ์์ฑํ ๋๋ฅผ ์๋ก ๋ค์ด๋ด ์๋ค. ๊ธฐ์กด ์๋๋ก์ด๋ ์ฝ๋๋ก ๋ฆฌ์คํธ๋ฅผ ์์ฑํ๊ธฐ ์ํด์๋ ์ด๋ํฐ์ ๋ฆฌ์ฌ์ดํด๋ฌ๋ทฐ๋ฅผ ์์ฑํ๋ ๋ฐ๋ง ํด๋ ์์ฒญ๋๊ฒ ๋ง์ ์ฝ๋์ ์๊ฐ์ด ํ์ํฉ๋๋ค.
๊ธฐ์กด์ ์๋๋ก์ด๋ ๋ฆฌ์คํธ ์ฝ๋
ํ์ง๋ง Compose์์๋ ๋จ ๋ช ์ค์ ์ฝ๋๋ง ์์ฑํ๋ฉด ๋ฉ๋๋ค.
Jetpack Compose์ ๋ฆฌ์คํธ ์ฝ๋
์ด๋ ๋ฏ Compose๋ฅผ ์ฌ์ฉํ๋ฉด ๊ฐ๋ฐ์ด ํ๊ธฐ์ ์ผ๋ก ๋นจ๋ผ์ง๋๋ค. UI์ ๋น์ฆ๋์ค ๋ก์ง์ ๋ถ๋ฆฌ ๋ํ ํ์คํด์ง๋๋ค.
์ด๋ฌํ ์ ์ธ์ UI ๋ฐฉ์์ ๋ค๋ฅธ ํ๋ซํผ์ด๋ ํ๋ ์์ํฌ(Flutter, Swift UI)์์ ์ด๋ฏธ ๊ฒ์ฆ๋ ๊ฐ๋ฐ ๋ฐฉ์์
๋๋ค. ์์ผ๋ก๋ ์๋๋ก์ด๋๋ฅผ ๊ฐ๋ฐํ ๋๋ ํ์์ ์ผ ๊ฒ์
๋๋ค.
Compose์ ์ ์ ๋ฒ์ ์ด ๋ฐํ๋์์ง๋ง, ์์ง ๋ง์ ๋ถ๋ค์ด ์ ๋ชจ๋ฅด๊ฑฐ๋, ๊ด์ฌ์ด ์๊ฑฐ๋, ํน์ ์ฐธ๊ณ ํ ๋ ํผ๋ฐ์ค๊ฐ ๋ถ์กฑํ๋ค๋ ์ด์ ๋ก ์
๋ฌธ์ ์ด๋ ค์ํ๋ ์ํฉ์
๋๋ค.
์ด ๊ฐ์๋ Compose์ ์
๋ฌธํ๋ ค๋ ๋ถ๋ค์ด ์ฐธ๊ณ ํ ๋งํ ๋ ํผ๋ฐ์ค ์ญํ ์ ์ํด ์ ์๋์์ต๋๋ค.
์ด ๊ฐ์๋ ใ์ค์ค์์ ์๋๋ก์ด๋ ์์กด์ฝ๋ฉ ์ฝํ๋ฆฐํธใ์ ์๋ ์์ ๋ค์ Compose๋ฅผ ํ์ฉํ์ฌ ๋ค์ ๋ง๋ค์ด๋ณด๋ ํ์์ผ๋ก ์งํ๋ฉ๋๋ค. ์ด ๊ณผ์ ์ ํตํด ์ด๋ป๊ฒ ๊ธฐ์กด ๊ธฐ์ ๋ค์ด Compose์์ ๊ตฌํ๋ ์ ์๋์ง ์ ์ ์์ต๋๋ค.
์ฑ
์ ์ฝ๋ ๊ฒ์ด ์ด ๊ฐ์๋ฅผ ์๊ฐํ๋ ๋ฐ ๋์์ ์ค ์๋ ์์ผ๋, ๊ผญ ์ฑ
์ด ํ์ํ์ง๋ ์์ต๋๋ค. ์ฑ
์์ ๋ค๋ฃจ๊ณ ์๋ ๊ฒ๊ณผ ์์ํ๋ ์ง์์ ๊ฐ์ง ๋ถ์ด๋ผ๋ฉด ์ถฉ๋ถํ ๋์์ด ๋ ๊ฒ์
๋๋ค.
์ด ๊ฐ์๋ฅผ ์๊ฐํ๊ธฐ ์ํด์๋ ์ด๋ฏธ ์๋๋ก์ด๋ ๊ฐ๋ฐ ์ง์์ด ์ด๋ ์ ๋๋ ์์ด์ผ ํฉ๋๋ค. ์๋๋ก์ด๋ ๊ฐ๋ฐ ๊ฒฝํ์ด ์๊ฑฐ๋, ์ฝํ๋ฆฐ ๋ฌธ๋ฒ์ ๋ชจ๋ฅธ๋ค๋ฉด ์ด ๊ฐ์๋ฅผ ์๊ฐํ๊ธฐ ์ด๋ ต์ต๋๋ค. ์ ์ด๋ ๊ฐ๋จํ ์ฑ์ ์ฝํ๋ฆฐ ์ฝ๋๋ก ์์ฑํด๋ณด๊ณ ๊ณต๋ถํด๋ณธ ๊ฒฝํ์ด ์์ด์ผ ๊ฐ์ ๋ด์ฉ์ ์ดํดํ ์ ์์ต๋๋ค.
์ด ๊ฐ์์์๋ Compose์ ๊น์ ๋ด์ฉ๊น์ง ๋ค๋ฃจ์ง ์์ต๋๋ค. ใ์ค์ค์์ ์๋๋ก์ด๋ ์์กด์ฝ๋ฉ ์ฝํ๋ฆฐํธใ์ ์๋ก๋ 8๊ฐ์ง ์์ ๋ฅผ Compose๋ก ์์ฑํ๋ ๊ณผ์ ์ ํตํด ๊ธฐ์กด ๋ฐฉ์์ ์ด๋ป๊ฒ Compose์ ๋ง๊ฒ ์์ฑํ ์ ์๋์ง๋ฅผ ๋ฐฐ์ฐ๊ฒ ๋ฉ๋๋ค. ์์ ๋ฅผ ์์ฑํด ๋๊ฐ๋ฉด์ ํ์ํ ์ง์์ ์ต๋ํ ์ ์์ ๊ฒ์ ๋๋ค.
์ด ๊ฐ์์์๋ ๋จผ์ Compose์ ๊ธฐ์ด๋ฅผ ์ตํ ์ดํ ์์ ๋ฅผ ํตํด Compose์ ์ฌ์ฉ๋ฒ์ ๋ฐฐ์ฐ๊ฒ ๋ฉ๋๋ค.
๊ฐ ์์ ์์ ๋ฐฐ์ธ ์ ์๋ ๋ด์ฉ์ ๋ค์๊ณผ ๊ฐ์ต๋๋ค.
Q. ์๋๋ก์ด๋ ์ด๋ณด์ธ๋ฐ ์ด ๊ฐ์๋ฅผ ์๊ฐํด๋ ๋ ๊น์?
์ฝํ๋ฆฐ ๋ฌธ๋ฒ์ ๊ณต๋ถํ๋ค๋ฉด ์๊ฐํ ์ ์์ต๋๋ค. Compose๋ ๊ธฐ์กด ์๋๋ก์ด๋์ ๊ฐ๋ฐ ๋ฐฉ๋ฒ์ ์์ ๋ชจ๋ฅด๋๋ผ๋ ์๋กญ๊ฒ ๋ฐฐ์ธ ์ ์์ต๋๋ค. ๋ค๋ง ๋ฌธ๋ฒ์ ๋ํ ํ์ต์ ์ด๋ ์ ๋ ํ๊ณ ๋ฃ๋ ๊ฒ์ ์ถ์ฒํฉ๋๋ค.
Q. ์๊ฐ ์ ์ ๊ฐ์๊ฐ ์ด๋ป๊ฒ ์งํ๋๋์ง ์ ์ ์๋ ๋ฐฉ๋ฒ์ด ์์๊น์?
์ด ๊ฐ์์์๋ ๋น๋ง๋ ๊ณ์ฐ๊ธฐ ์์ ๋ฅผ ๋ฌด๋ฃ๋ก ๊ณต๊ฐํ๊ณ ์์ต๋๋ค. ๊ฐ์๋ฅผ ์๊ฐํ๊ธฐ ์ ์ ๋ฌด๋ฃ ๊ฐ์๋ฅผ ๋ค์ด๋ณด์๊ณ ๊ฐ์ ์คํ์ผ์ด ๋ง๋ค๋ฉด ์๊ฐ์ ์ฒญ์ ์งํํ์๋ฉด ๋ฉ๋๋ค.
Q. ๊ฐ์์์ ์ฌ์ฉํ๋ ์์ค ์ฝ๋๊ฐ ์ ๊ณต๋๋์?
๊ฐ์์์ ๋ค๋ฃฌ ๋ชจ๋ ์์ค ์ฝ๋๋ ๋ฌผ๋ก , ๊ฐ์์์๋ ๋ค๋ฃจ์ง ์์ง๋ง ใ์ค์ค์์ ์๋๋ก์ด๋ ์์กด์ฝ๋ฉ ์ฝํ๋ฆฐํธใ์๋ ์ธ๊ธ๋ ์์ ๋ฑ ์์ ์ ์์ค ์ฝ๋๋ ์ ๊ณต๋ฉ๋๋ค.
ํ์ต ๋์์
๋๊ตฌ์ผ๊น์?
์ฝํ๋ฆฐ ๋ฌธ๋ฒ์ ๋ฐฐ์ฐ์ ๋ถ
๊ธฐ์กด์ ์๋๋ก์ด๋ ๊ฐ๋ฐ์ ํด๋ณด์ ๋ถ ์ค์์ Compose์ ๊ด์ฌ์ด ์์ผ์ ๋ถ
์๋ก์ด ์ฑ ๊ฐ๋ฐ ๋ฐฉ์์ ๋ฐฐ์ฐ๊ณ ์ถ์ผ์ ๋ถ
ใ์ค์ค์์ ์๋๋ก์ด๋ ์์กด์ฝ๋ฉ ์ฝํ๋ฆฐํธใ์ ์ฝ์ผ์ ๋ถ
โ๋ชจ๋ ์๋๋ก์ด๋ - ์ฝํ๋ฆฐ๊ณผ Jetpack ํ์ฉโ ๊ฐ์๋ฅผ ์๊ฐํ์ ๋ถ
์ ์ ์ง์,
ํ์ํ ๊น์?
์ฝํ๋ฆฐ
์๋๋ก์ด๋ ๊ธฐ์ด ์ง์ (Activity, View, ViewModel...)
10,168
๋ช
์๊ฐ์
678
๊ฐ
์๊ฐํ
811
๊ฐ
๋ต๋ณ
4.7
์
๊ฐ์ ํ์
13
๊ฐ
๊ฐ์
๊ต์กํ๊ณ ์ฑ ์ฐ๋ ๊ฐ๋ฐ์ ์ค์ค์์ ๋๋ค.
'์ค์ค์์ ์์กด์ฝ๋ฉ' ์ ํ๋ธ ์ฑ๋๊ณผ ์์กด์ฝ๋ฉ (https://survivalcoding.com) ๊ต์ก ํ๋ํผ์ ์ด์์ค์ ๋๋ค.
์ ์
์ค์ค์์ ํ๋ฌํฐ ์์กด์ฝ๋ฉ (ํ๋น๋ฏธ๋์ด 2020)
์ค์ค์์ ์๋๋ก์ด๋ ์์กด์ฝ๋ฉ: ์ฝํ๋ฆฐ ํธ (ํ๋น๋ฏธ๋์ด 2018)
๋ ๋๊น์ง ์๋๋ก์ด๋ (๋ฃจ๋นํ์ดํผ 2018)
์ฃผ์๊ฒฝ๋ ฅ
์ค๋ ์ง(OhRange) ๋ํ
์ธ๋ฏผ์ง์ ์ ๋ฌธํ๊ต ์ ๋ณด๊ธฐ์ ๊ฐ๋ฐ ์ง์ ํ๋ จ๊ต์ฌ
์์์ค๋งํธ์ฑ๊ฐ๋ฐํ์ ์ด์
LG์ ์ MC์ฌ์ ๋ถ
์ผ๋ณธ ์์ด์นํ (ๆ ช)ๆฑๆตท็็ง Security์ฌ์ ๋ถ
์ผ๋ณธ ์์ด์นํ (ๆ ช)ๆฅๆฌใใฏใทใผใ IT์ฌ์ ๋ถ
LinkedIn: https://www.linkedin.com/in/junsuk5/
์ ์ฒด
50๊ฐ โ (7์๊ฐ 44๋ถ)
๊ฐ์ ์๊ฐ
08:40
์ฝํ๋ฆฐ ๋ฌธ๋ฒ
48:50
Column, Row, Text
10:26
Box
07:51
Image, Card, State
21:13
Navigation
14:13
ViewModel
08:07
State ์ฌํ
19:24