
โ . ์ค๋์ ์ฃผ์ ์งํ ์ฌํญ
โ ก. ์ค๋ ์ํํ
๐ 1. Flutter 1์ฃผ์ฐจ ๊ฐ์ 1~3๊ฐ – ์ฃผ์ ๋ด์ฉ ์ ๋ฆฌ
๐ 2. Flutter ์์ต – ๊ฐ๋ ํ์ต ๋ฐ ์ค์น ๋ฐฉ๋ฒ ์ ๋ฆฌ
๐ 3. Flutter ์ค์น ๋ฐฉ๋ฒ ์ ๋ฆฌ ๋ฐ ํ๊ฒฝ ์ค์ ์๋ฃ
๐ 4. ์ค๋์ ํ๊ณ – ์ฌ์ ์บ ํ 4์ผ์ฐจ๋ฅผ ๋ง์น๋ฉฐ
โ ข. ์ฌ์ ์บ ํ 4์ผ์ฐจ ํต์ฌ ์ ๋ฆฌ

์ด์ฌํ ๊ณต๋ถํ๊ณ ์๋ค.
๋ฟ๋ฏ



โ . ์ค๋์ ์ฃผ์ ์งํ ์ฌํญ
โ
1. Flutter ํธ๋ 1์ฃผ์ฐจ ๊ฐ์ 1~3๊ฐ ์๊ฐ ๋ฐ ์ ๋ฆฌ
โ 1-1. ๊ฐ์ ์๊ฐ
โ 1-2. Why Flutter?
โ 1-3. ์ด๋ฒ์ ๋ฐฐ์ธ ๊ฒ
โ
2. ์์ต ๊ฐ๋
์ ๋ฆฌ ๋ฐ ํฌ์คํ
โ Flutter๋? ๊ฐ๋
์ ๋ฆฌ ๋ฐ ํฌ์คํ
โ ๋ค์ดํฐ๋ธ ์ฑ ๊ฐ๋ฐ๊ณผ์ ์ฐจ์ด์ ์ ๋ฆฌ
โ Flutter๋ก ๋ง๋ค ์ ์๋ ์ฑ์ ์ข
๋ฅ ์ ๋ฆฌ
โ
3. Flutter ์ค์น ๋ฐ ํ๊ฒฝ ์ธํ
ํ์ต
โ Windows / Mac / Linux์์ Flutter ์ค์น ๋ฐฉ๋ฒ ์ ๋ฆฌ
โ SDK ๋ค์ด๋ก๋ ๋ฐ ํ๊ฒฝ ๋ณ์ ์ค์ ์ ๋ฆฌ
โ ์ค์ ์ค์น ์๋ฃ ํ ๋ด์ผ์ ์ค์ต์ ์ํ ์์ต ์งํ
โ
4. TIL ์ ๋ฆฌ ๋ฐ ํฌ์คํ
โ 4์ผ์ฐจ ํ์ต ๋ด์ฉ ์ ๋ฆฌ ํ ํฌ์คํ
์๋ฃ
โ ก. ๋ณธ๋ก
Flutter 1์ฃผ์ฐจ ๊ฐ์ 1~3๊ฐ – ์ฃผ์ ๋ด์ฉ ์ ๋ฆฌ
์ค๋ ๊ฐ์ฅ ์ค์ํ ์ ๋ฌด๋
Flutter ๊ธฐ์ด ๊ฐ๋ ์ ์ตํ๊ณ ,
๊ฐ์๋ฅผ ์๊ฐํ๋ฉด์
์ฃผ์ ๊ฐ๋ ์ ์ ๋ฆฌํ๋ ๊ฒ์ด์์ต๋๋ค.
๊ฐ ๊ฐ์๋ณ ์ฃผ์ ๋ด์ฉ๊ณผ
ํ์ตํ ์ ์ ์์ฝํ๋ฉด
๋ค์๊ณผ ๊ฐ์ต๋๋ค.
๐น 1-1. ๊ฐ์ ์๊ฐ
๐ Flutter ํธ๋์ ๋ชฉํ์ ์ปค๋ฆฌํ๋ผ ์๊ฐ
โ Flutter๊ฐ ์ ์ค์ํ์ง, ์ด๋ค ๋ฐฉ์์ผ๋ก ์ฑ์ ๊ฐ๋ฐํ ์ ์๋์ง ๊ฐ๊ด์ ์ค๋ช
๐น 1-2. Why Flutter?
๐ ์ Flutter๋ฅผ ์ ํํด์ผ ํ ๊น?
โ ํฌ๋ก์ค ํ๋ซํผ ๊ฐ๋ฐ → ํ ๋ฒ์ ์ฝ๋ ์์ฑ์ผ๋ก iOS์ Android ๋์ ์ง์
โ ๋น ๋ฅธ ๊ฐ๋ฐ ์๋ → Hot Reload ๊ธฐ๋ฅ์ ํ์ฉํ ์ค์๊ฐ UI ๋ณ๊ฒฝ
โ ๊ฐ๋ ฅํ UI ํ๋ ์์ํฌ → ๋ค์ดํฐ๋ธ๊ธ ์ฑ๋ฅ ์ ๊ณต
๐น 1-3. ์ด๋ฒ์ ๋ฐฐ์ธ ๊ฒ
๐ 1์ฃผ์ฐจ์ ํ์ตํ ๋ด์ฉ ๊ฐ์
โ Dart ๊ธฐ์ด ๋ฌธ๋ฒ ํ์ต
โ Flutter ๊ธฐ๋ณธ ๊ตฌ์กฐ ์ดํด ๋ฐ ํ๊ฒฝ ์ค์
Flutter ์์ต – ๊ฐ๋ ํ์ต ๋ฐ ์ค์น ๋ฐฉ๋ฒ ์ ๋ฆฌ
์ค๋์ ๋ ๋ค๋ฅธ ์ฃผ์ ๋ชฉํ๋
Flutter ๊ฐ๋ ์ ์์ตํ๊ณ ,
์ฑ ๊ฐ๋ฐ์ ํ์ํ
ํ๊ฒฝ ์ค์ ์
์ ๋ฆฌํ๋ ๊ฒ์ด์์ต๋๋ค.
โ Flutter์ ๊ธฐ๋ณธ ๊ฐ๋ ๋ฐ ํน์ง ํ์ต
โ ๋ค์ดํฐ๋ธ ์ฑ ๊ฐ๋ฐ๊ณผ์ ์ฐจ์ด์ ๋น๊ต
โ Flutter๋ก ๋ง๋ค ์ ์๋ ๋ค์ํ ์ฑ ์ ํ ์ ๋ฆฌ
โ
1. Flutter๋?
โ Google์์ ๊ฐ๋ฐํ ํฌ๋ก์ค ํ๋ซํผ UI ํ๋ ์์ํฌ
โ ํ ๋ฒ์ ์ฝ๋ ์์ฑ์ผ๋ก iOS, Android, ์น, ๋ฐ์คํฌํฑ ๋์ ์ง์
โ
2. ๋ค์ดํฐ๋ธ ์ฑ ๊ฐ๋ฐ๊ณผ์ ์ฐจ์ด์
โ ๋ค์ดํฐ๋ธ ์ฑ → ํ๋ซํผ๋ณ ๊ฐ๋ณ ๊ฐ๋ฐ ํ์ (Swift, Kotlin ์ฌ์ฉ)
โ Flutter ์ฑ → ํ๋์ ์ฝ๋๋ฒ ์ด์ค๋ก ๋ชจ๋ ํ๋ซํผ ์ง์
โ
3. Flutter๋ก ๋ง๋ค ์ ์๋ ์ฑ ์ ํ
โ ๋ชจ๋ฐ์ผ ์ฑ (iOS & Android)
โ ์น ์ฑ
โ ๋ฐ์คํฌํฑ ์ฑ (Windows, Mac, Linux)
๐ Flutter ๊ฐ๋ ์ ๋ฆฌ ํฌ์คํ ๋ณด๊ธฐ
[์ฑ ๊ฐ๋ฐ ๊ธฐ์ด] Flutter๋ ๋ฌด์์ผ๊น? ๊ฐ๋ ๊ณผ ํน์ง ํ๋์ ๋ณด๊ธฐ
[์ฑ ๊ฐ๋ฐ ๊ธฐ์ด] Flutter๋ ๋ฌด์์ผ๊น? ๊ฐ๋ ๊ณผ ํน์ง ํ๋์ ๋ณด๊ธฐ
๋ชฉ์ฐจ โ . ์๋ก : Flutter๋ ๋ฌด์์ธ๊ฐ? ๐ 1. ํฌ๋ก์ค ํ๋ซํผ ๊ฐ๋ฐ์ ํ์์ฑ ๐ 2. ๊ธฐ์กด ๊ฐ๋ฐ ๋ฐฉ์๊ณผ Flutter์ ์ฐจ์ด โ ก. ๋ณธ๋ก : Flutter์ ์ฃผ์ ํน์ง ๐ 1. ํ ๋ฒ์ ์ฝ๋๋ก ๋ชจ๋ ํ๋ซํผ ๊ฐ๋ฐ
grmeems.tistory.com
[์ฑ ๊ฐ๋ฐ ๊ธฐ์ด] Flutter์์ ํฌ๋ก์ค ํ๋ซํผ ๊ฐ๋ฐ์ด ํ์ํ ์ด์
[์ฑ ๊ฐ๋ฐ ๊ธฐ์ด] Flutter์์ ํฌ๋ก์ค ํ๋ซํผ ๊ฐ๋ฐ์ด ํ์ํ ์ด์
๋ชฉ์ฐจ โ . ์๋ก : ํฌ๋ก์ค ํ๋ซํผ ๊ฐ๋ฐ์ด๋? ๐ 1. ๋ค์ดํฐ๋ธ ๊ฐ๋ฐ vs ํฌ๋ก์ค ํ๋ซํผ ๊ฐ๋ฐ ๐ 2. ํฌ๋ก์ค ํ๋ซํผ ๊ฐ๋ฐ์ด ํ์ํ ์ด์ โ ก. ๋ณธ๋ก : ํฌ๋ก์ค ํ๋ซํผ ๊ฐ๋ฐ ๋ฐฉ์ ๋น๊ต ๐ 1. ๋ค์ดํฐ
grmeems.tistory.com
[์ฑ ๊ฐ๋ฐ ๊ธฐ์ด] ์ปดํจํฐ ์ธ์ด์ ์ข ๋ฅ์ ํน์ง: ํ๋ก๊ทธ๋๋ฐ ์ธ์ด๋ ์ด๋ป๊ฒ ์ด๋ฃจ์ด์ง๊น?
๋ชฉ์ฐจ โ . ์๋ก : ํ๋ก๊ทธ๋๋ฐ ์ธ์ด๋? ๐ 1. ์ปดํจํฐ๊ฐ ์ดํดํ๋ ์ธ์ด ๐ 2. ํ๋ก๊ทธ๋๋ฐ ์ธ์ด์ ๊ธฐ๋ณธ ๊ฐ๋ โ ก. ๋ณธ๋ก : ํ๋ก๊ทธ๋๋ฐ ์ธ์ด์ ์ข ๋ฅ์ ํน์ง ๐ 1. ์ ๊ธ ์ธ์ด vs ๊ณ ๊ธ ์ธ์ด ๐ 2.
grmeems.tistory.com
[์ฑ ๊ฐ๋ฐ ๊ธฐ์ด] Flutter๊ฐ ์ธ๊ธฐ ์๋ ์ด์ : ๋ค์ดํฐ๋ธ ์ฑ ๊ฐ๋ฐ๊ณผ Flutter์ ์ฐจ์ด์
[์ฑ ๊ฐ๋ฐ ๊ธฐ์ด] Flutter๊ฐ ์ธ๊ธฐ ์๋ ์ด์ : ๋ค์ดํฐ๋ธ ์ฑ ๊ฐ๋ฐ๊ณผ Flutter์ ์ฐจ์ด์
๋ชฉ์ฐจ โ . ์๋ก : Flutter๊ฐ ๋์ธ์ธ ์ด์ ๐ 1. ๋ชจ๋ฐ์ผ ์ฑ ๊ฐ๋ฐ ๋ฐฉ์์ ๋ณํ ๐ 2. ํฌ๋ก์ค ํ๋ซํผ์ ํ์์ฑ ์ฆ๊ฐ โ ก. ๋ณธ๋ก : ๋ค์ดํฐ๋ธ ์ฑ ๊ฐ๋ฐ๊ณผ Flutter์ ์ฐจ์ด์ ๐ 1. ๊ฐ๋ฐ ๋ฐฉ์ ๋น๊ต: ๋ค
grmeems.tistory.com
[์ฑ ๊ฐ๋ฐ ๊ธฐ์ด] Windows์์ Flutter ์ค์น ๋ฐฉ๋ฒ (๋จ๊ณ๋ณ ์งํ ๊ณผ์ ์์ธ/๋ช ๋ น์ด ์ฒจ๋ถ ํ์ผ ๆ )
๋ชฉ์ฐจ โ . ์๋ก : Windows์์ Flutter๋ฅผ ์ค์นํ๋ ์ด์ ๐ 1. Windows์์ Flutter ๊ฐ๋ฐ์ด ๊ฐ๋ฅํ ์ด์ ๐ 2. Windows์์ Flutter ๊ฐ๋ฐ์ ์ฅ์ โ ก. ๋ณธ๋ก : Windows์์ Flutter ์ค์น ๋ฐฉ๋ฒ (๋จ๊ณ๋ณ ์งํ)
grmeems.tistory.com
[์ฑ ๊ฐ๋ฐ ๊ธฐ์ด] Mac์์ Flutter ์ค์นํ๋ ๋ฐฉ๋ฒ (๋จ๊ณ๋ณ ์งํ ์์ธ/๋ช ๋ น์ด ํ๋กฌํํธ ์ฒจ๋ถ ํ์ผ ๆ)
๋ชฉ์ฐจ โ . ์๋ก : Mac์์ Flutter๋ฅผ ์ค์นํ๋ ์ด์ ๐ 1. Mac์์ Flutter ๊ฐ๋ฐ์ด ๊ฐ๋ฅํ ์ด์ ๐ 2. Mac์์ Flutter ๊ฐ๋ฐ์ ์ฅ์ โ ก. ๋ณธ๋ก : Mac์์ Flutter ์ค์น ๋ฐฉ๋ฒ (๋จ๊ณ๋ณ ์งํ) ๐ 1. Step 1
grmeems.tistory.com
[์ฑ ๊ฐ๋ฐ ๊ธฐ์ด] Linux์์ Flutter ์ค์นํ๋ ๋ฐฉ๋ฒ (๋จ๊ณ๋ณ ์งํ ์์ธ/ ๋ช ๋ น ํ๋กฌํํธ ์ฒจ๋ถ ํ์ผ ๆ)
๋ชฉ์ฐจ โ . ์๋ก : Linux์์ Flutter๋ฅผ ์ค์นํ๋ ์ด์ ๐ 1. Linux์์ Flutter ๊ฐ๋ฐ์ด ๊ฐ๋ฅํ ์ด์ ๐ 2. Linux์์ Flutter ๊ฐ๋ฐ์ ์ฅ์ โ ก. ๋ณธ๋ก : Linux์์ Flutter ์ค์น ๋ฐฉ๋ฒ (๋จ๊ณ๋ณ ์งํ) ๐ 1. S
grmeems.tistory.com
[์ฑ ๊ฐ๋ฐ ๊ธฐ์ด] Flutter SDK ๋ค์ด๋ก๋ ๋ฐ ํ๊ฒฝ ๋ณ์ ์ค์ (์ค์น ๋ฐฉ๋ฒ ์์ธ/๋ช ๋ น ํ๋กฌํํธ ์ฒจ๋ถ ํ์ผ
๋ชฉ์ฐจ โ . ์๋ก : Flutter SDK๋? ๐ 1. Flutter SDK์ ์ญํ ๐ 2. Flutter SDK ์ค์น๊ฐ ํ์ํ ์ด์ โ ก. ๋ณธ๋ก : Flutter SDK ๋ค์ด๋ก๋ ๋ฐ ํ๊ฒฝ ๋ณ์ ์ค์ ๐ 1. Step 1: Flutter SDK ๋ค์ด๋ก๋ (Windows, macOS,
grmeems.tistory.com
Flutter ์ค์น ๋ฐฉ๋ฒ ์ ๋ฆฌ ๋ฐ ํ๊ฒฝ ์ค์ ์๋ฃ
์ค๋
Flutter ์ค์น ๋ฐ ํ๊ฒฝ ์ธํ ๋
๋ง๋ฌด๋ฆฌํ์ต๋๋ค.
โ Windows / Mac / Linux์์ Flutter ์ค์น ๋ฐฉ๋ฒ ํ์ต
โ SDK ๋ค์ด๋ก๋ ๋ฐ ํ๊ฒฝ ๋ณ์ ์ค์ ์งํ
โ Flutter ์ค์น ์๋ฃ ํ ๋ด์ผ๋ถํฐ ์ค์ต ์ค๋น ์๋ฃ!
โ
1. Windows, Mac, Linux๋ณ ์ค์น ๋ฐฉ๋ฒ ์ ๋ฆฌ
โ OS๋ณ Flutter ์ค์น ๊ณผ์ ๋น๊ต ์ ๋ฆฌ
โ ์ค์น ํ ๊ธฐ๋ณธ์ ์ธ ์คํ ํ
์คํธ ์งํ
โ
2. SDK ๋ค์ด๋ก๋ ๋ฐ ํ๊ฒฝ ๋ณ์ ์ค์
โ Flutter SDK ์ค์น ๋ฐ ํ๊ฒฝ ๋ณ์ ์ธํ
๋ฐฉ๋ฒ ํ์ต
โ ๋ช
๋ น์ด ์
๋ ฅ์ ํตํด ์ ์ ์๋ ํ์ธ
์ค๋์ ํ๊ณ – ์ฌ์ ์บ ํ 4์ผ์ฐจ๋ฅผ ๋ง์น๋ฉฐ
โ ์ค๋์ ๋ณธ๊ฒฉ์ ์ผ๋ก Flutter ๊ฐ๋
์ ํ์ตํ๊ณ , ํ๊ฒฝ ์ค์ ๊น์ง ์๋ฃํ ํ๋ฃจ์๋ค.
โ ์ฑ ๊ฐ๋ฐ์ด ์ฒ์์ด๋ผ ์ต์ํ์ง ์์ ๊ฐ๋
๋ ๋ง์์ง๋ง, ๊ธฐ์ด ๊ฐ๋
๋ถํฐ ์ฐจ๊ทผ์ฐจ๊ทผ ์ตํ๊ฐ๋ฉด์ ์ ๋ฆฌํ๋ ์ดํด๊ฐ ํจ์ฌ ์ฌ์ ๋ค.
โ ๋ด์ผ๋ถํฐ๋ Flutter์ ๊ธฐ๋ณธ ๋ฌธ๋ฒ๊ณผ UI ๊ตฌํ ๋ฐฉ๋ฒ์ ๋ฐฐ์ฐ๋ฉฐ, ์ค์ ํ๋ก์ ํธ ๊ฐ๋ฐ์ ์ค๋นํ ๊ณํ!
๐ ๋ค์ ๋ชฉํ:
โ Dart ๊ธฐ๋ณธ ๋ฌธ๋ฒ ํ์ต
โ Flutter UI ๊ตฌ์ฑ ์์ ํ์ต
โ ์ฒซ ๋ฒ์งธ ๊ฐ๋จํ ์ฑ ๋ง๋ค๊ธฐ ์ค์ต
โ ข. ์ฌ์ ์บ ํ 4์ผ์ฐจ ํต์ฌ ์ ๋ฆฌ
โ Flutter ํธ๋ 1์ฃผ์ฐจ ๊ฐ์ 1~3๊ฐ ์๊ฐ ๋ฐ ์ ๋ฆฌ ์๋ฃ!
โ Flutter ๊ฐ๋
ํ์ต ๋ฐ ๋ค์ดํฐ๋ธ ์ฑ ๊ฐ๋ฐ๊ณผ์ ์ฐจ์ด์ ์ ๋ฆฌ ์๋ฃ!
โ Flutter ์ค์น ๋ฐ ํ๊ฒฝ ์ค์ ์๋ฃ!
โ TIL ์ ๋ฆฌ ๋ฐ ํฌ์คํ
์๋ฃ!
๐ก ๋ด์ผ๋ถํฐ๋
๋ณธ๊ฒฉ์ ์ธ Dart ๋ฌธ๋ฒ ํ์ต๊ณผ
Flutter UI ๊ตฌ์ฑ ์ค์ต์
์งํํ ์์ ! ๐๐ฅ
