Search

Flutter ์†Œ๊ฐœ

Flutter ์†Œ๊ฐœ

ํ”Œ๋Ÿฌํ„ฐ์— ๋Œ€ํ•˜์—ฌ ์†Œ๊ฐœํ•˜๊ณ  ํ”Œ๋Ÿฌํ„ฐ์˜ ํ•ต์‹ฌ์ ์ธ ๋‚ด์šฉ์— ๋Œ€ํ•˜์—ฌ ์•Œ์•„๋ด…๋‹ˆ๋‹ค.
โ€ข
ํ”Œ๋Ÿฌํ„ฐ๋ž€?
โ€ข
์ฃผ์š” ํŠน์ง•
โ€ข
ํŠน์žฅ์ 
โ€ข
ํ”Œ๋Ÿฌํ„ฐ ๊ณต์‹ ์‚ฌ์ดํŠธ

ํ”Œ๋Ÿฌํ„ฐ๋ž€?

Google์ด ๊ฐœ๋ฐœํ•œ ์˜คํ”ˆ์†Œ์Šค UI ์†Œํ”„ํŠธ์›จ์–ด ๊ฐœ๋ฐœ ํ‚คํŠธ
ํ•˜๋‚˜์˜ ์ฝ”๋“œ๋ฒ ์ด์Šค๋กœ iOS, Android, ์›น, ๋ฐ์Šคํฌํ†ฑ ๋“ฑ ๋‹ค์–‘ํ•œ ํ”Œ๋žซํผ์—์„œ ๋™์ž‘ํ•˜๋Š” ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ๊ฐœ๋ฐœํ•  ์ˆ˜ ์žˆ๊ฒŒ ํ•ด์ค๋‹ˆ๋‹ค.

์ฃผ์š” ํŠน์ง•

ํ”Œ๋Ÿฌํ„ฐ๋Š” ๋‹ค์ค‘ ํ”Œ๋žซํผ ์ง€์›, Dart ์–ธ์–ด, ์œ„์ ฏ ๊ธฐ๋ฐ˜ ๊ตฌ์กฐ, Hot Reload, ๋†’์€ ์„ฑ๋Šฅ, ํ’๋ถ€ํ•œ ์œ„์ ฏ๊ณผ ์ปค์Šคํ„ฐ๋งˆ์ด์ง•, ๊ทธ๋ฆฌ๊ณ  ํ™œ๋ฐœํ•œ ๊ฐœ๋ฐœ ์ปค๋ฎค๋‹ˆํ‹ฐ์™€ ์ƒํƒœ๊ณ„๋ผ๋Š” ๋‹ค์–‘ํ•œ ํŠน์ง•์„ ๊ฐ€์ง€๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

๋‹ค์ค‘ ํ”Œ๋žซํผ ์ง€์›

ํ•˜๋‚˜์˜ ์ฝ”๋“œ๋ฒ ์ด์Šค๋กœ iOS, Android, ์›น, ๋ฐ์Šคํฌํ†ฑ(Windows, macOS, Linux) ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ๊ฐœ๋ฐœํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Dart ์–ธ์–ด

ํ”Œ๋Ÿฌํ„ฐ๋Š” Google์ด ๊ฐœ๋ฐœํ•œ ๋‹คํŠธ(Dart) ์–ธ์–ด๋ฅผ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค. ๋‹คํŠธ๋Š” ๋น ๋ฅธ ๊ฐœ๋ฐœ ์†๋„์™€ ์„ฑ๋Šฅ์„ ์ œ๊ณตํ•˜๋ฉฐ, ๋‹จ์ˆœํ•˜๊ณ  ์ง๊ด€์ ์ธ ๋ฌธ๋ฒ•์œผ๋กœ ์‰ฝ๊ฒŒ ๋ฐฐ์šธ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์œ„์ ฏ ๊ธฐ๋ฐ˜ ๊ตฌ์กฐ

ํ”Œ๋Ÿฌํ„ฐ๋Š” ๋ชจ๋“  UI ์š”์†Œ๋ฅผ ์œ„์ ฏ์œผ๋กœ ๊ตฌ์„ฑํ•˜๋ฉฐ, ์ด๋Ÿฌํ•œ ์œ„์ ฏ๋“ค์€ ์กฐํ•ฉ๊ณผ ์ค‘์ฒฉ์„ ํ†ตํ•ด ๋ณต์žกํ•œ UI๋ฅผ ๊ตฌ์„ฑํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ปค์Šคํ„ฐ๋งˆ์ด์ง•๊ณผ ์žฌ์‚ฌ์šฉ์ด ์šฉ์ดํ•ฉ๋‹ˆ๋‹ค.

Hot Reload

์ฝ”๋“œ ๋ณ€๊ฒฝ ์‚ฌํ•ญ์„ ์ฆ‰์‹œ ๋ฐ˜์˜ํ•˜๋Š” Hot Reload ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•˜์—ฌ ๊ฐœ๋ฐœ ์†๋„๋ฅผ ํฌ๊ฒŒ ํ–ฅ์ƒ์‹œํ‚ต๋‹ˆ๋‹ค. UI ์ˆ˜์ •, ๊ธฐ๋Šฅ ์ถ”๊ฐ€ ๋“ฑ์„ ์‹ค์‹œ๊ฐ„์œผ๋กœ ํ™•์ธํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

๋†’์€ ์„ฑ๋Šฅ

ํ”Œ๋Ÿฌํ„ฐ๋Š” ์ž์ฒด ๋ Œ๋”๋ง ์—”์ง„์„ ์‚ฌ์šฉํ•˜์—ฌ ๋„ค์ดํ‹ฐ๋ธŒ ์„ฑ๋Šฅ์— ๊ฐ€๊นŒ์šด ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค. ์• ๋‹ˆ๋ฉ”์ด์…˜๊ณผ ๊ทธ๋ž˜ํ”ฝ์ด ๋ถ€๋“œ๋Ÿฝ๊ณ  ๋น ๋ฅด๊ฒŒ ๋™์ž‘ํ•ฉ๋‹ˆ๋‹ค.

ํ’๋ถ€ํ•œ ์œ„์ ฏ๊ณผ ์ปค์Šคํ„ฐ๋งˆ์ด์ง•

๋‹ค์–‘ํ•œ ๊ธฐ๋ณธ ์œ„์ ฏ๊ณผ ํ•จ๊ป˜ Material Design ๋ฐ Cupertino ์Šคํƒ€์ผ์„ ์ง€์›ํ•˜์—ฌ ํ”Œ๋žซํผ์— ๋งž๋Š” ๋„ค์ดํ‹ฐ๋ธŒ ๋Š๋‚Œ์˜ UI๋ฅผ ์‰ฝ๊ฒŒ ๊ตฌ์„ฑํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

๊ฐœ๋ฐœ ์ปค๋ฎค๋‹ˆํ‹ฐ์™€ ์ƒํƒœ๊ณ„

ํ”Œ๋Ÿฌํ„ฐ๋Š” ํ™œ๋ฐœํ•œ ์˜คํ”ˆ์†Œ์Šค ์ปค๋ฎค๋‹ˆํ‹ฐ๋ฅผ ๊ฐ€์ง€๊ณ  ์žˆ์œผ๋ฉฐ, ์ˆ˜๋งŽ์€ ํŒจํ‚ค์ง€์™€ ํ”Œ๋Ÿฌ๊ทธ์ธ์„ ํ†ตํ•ด ๊ฐœ๋ฐœ์„ ๋”์šฑ ํšจ์œจ์ ์œผ๋กœ ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

ํŠน์žฅ์ 

1.
๋น ๋ฅธ ๊ฐœ๋ฐœ
2.
์ผ๊ด€๋œ UI
3.
์ฝ”๋“œ ์žฌ์‚ฌ์šฉ์„ฑ

๋น ๋ฅธ ๊ฐœ๋ฐœ

Hot Reload์™€ ์ง๊ด€์ ์ธ ์œ„์ ฏ ๊ตฌ์กฐ๋กœ ๋น ๋ฅธ ๊ฐœ๋ฐœ๊ณผ ํ…Œ์ŠคํŠธ๊ฐ€ ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค. ๊ฐœ๋ฐœ์ž๋Š” ์ฝ”๋“œ ๋ณ€๊ฒฝ ์‚ฌํ•ญ์„ ์‹ค์‹œ๊ฐ„์œผ๋กœ ํ™•์ธํ•˜๋ฉฐ ํšจ์œจ์ ์œผ๋กœ ๊ฐœ๋ฐœํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์ผ๊ด€๋œ UI

๋‹ค์–‘ํ•œ ํ”Œ๋žซํผ์—์„œ ๋™์ผํ•œ UI์™€ ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค. ํ”Œ๋žซํผ๋ณ„ ๋””์ž์ธ ๊ฐ€์ด๋“œ๋ผ์ธ์„ ์ค€์ˆ˜ํ•˜๋ฉด์„œ๋„ ์ผ๊ด€๋œ ๋ธŒ๋žœ๋“œ ๊ฒฝํ—˜์„ ์ „๋‹ฌํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์ฝ”๋“œ ์žฌ์‚ฌ์šฉ์„ฑ

ํ•˜๋‚˜์˜ ์ฝ”๋“œ๋ฒ ์ด์Šค๋กœ ์—ฌ๋Ÿฌ ํ”Œ๋žซํผ์—์„œ ๋™์ž‘ํ•˜๋Š” ์•ฑ์„ ๊ฐœ๋ฐœํ•  ์ˆ˜ ์žˆ์–ด ์œ ์ง€๋ณด์ˆ˜์™€ ๊ฐœ๋ฐœ ๋น„์šฉ์„ ์ค„์ผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ํ”Œ๋žซํผ๋ณ„ ๋ณ„๋„ ๊ฐœ๋ฐœํŒ€์ด ํ•„์š”ํ•˜์ง€ ์•Š์•„ ํšจ์œจ์ ์ธ ๋ฆฌ์†Œ์Šค ๊ด€๋ฆฌ๊ฐ€ ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค.

ํ”Œ๋Ÿฌํ„ฐ ๊ณต์‹ ์‚ฌ์ดํŠธ