플러터:개념 잡기 - 편집 역사

Sam: /* 마테리얼 디자인 */

2026-01-06T23:24:06Z

마테리얼 디자인

← 이전 판		2026년 1월 6일 (화) 23:24 판
97번째 줄:		97번째 줄:
	}		}
	}</syntaxhighlight>마테리얼과는 버튼, 앱바 등 디자인에서 차이가 있고, 하위 위젯의 이름이 조금씩 다르다.		}</syntaxhighlight>마테리얼과는 버튼, 앱바 등 디자인에서 차이가 있고, 하위 위젯의 이름이 조금씩 다르다.

			== 플러터의 특성(진한쌤의 코멘트) ==

			* 모든 것이 위젯으로 구성되어 있다.
			* 좋게 말하면 이미 마련된 기능을 이용하여 간단하게 앱을 만들 수 있고, 나쁘게 말하면 코드 자체보다 프레임워크에 대한 학습 소요가 크다.
			* 다행인 것은 AI의 발전으로 모르는 위젯에 대한 것도 필요 기능이 명확하다면 금방 찾아내어 적용할 수 있다는 것. 여러모로 최근 동향에 잘 맞는 기술이다.

	== 이름이 갈라지는 위젯들 ==		== 이름이 갈라지는 위젯들 ==

Sam: /* 쿠퍼티노 디자인 */

2026-01-06T23:21:03Z

쿠퍼티노 디자인

@@ 97번째 줄: / 97번째 줄: @@
+   }
 }</syntaxhighlight>마테리얼과는 버튼, 앱바 등 디자인에서 차이가 있고, 하위 위젯의 이름이 조금씩 다르다.
 = 팁 =

2026년 1월 6일 (화) 23:18에 Sam님의 편집

2026-01-06T23:18:29Z

@@ 3번째 줄: / 3번째 줄: @@
 == 개요 ==
 플러터 코드를 작성하는 데 있어 기본 개념에 대한 문서.
 == 기본 양식 ==
-<syntaxhighlight lang="dart">
+<syntaxhighlight lang="dart">import 'package:flutter/widgets.dart';
 import 'package:flutter/material.dart';  // 마테리얼 디자인 관련 라이브러리.(안드로이드 방식. 이지만 ios도 지원)
 void main() {
@@ 26번째 줄: / 70번째 줄: @@
      );
+   }
+}
-</syntaxhighlight>기본적인 흐름은 main>runApp>위젯 형식이다. 위젯을 상속한 클래스의 build를 오버라이딩 하는 방식으로 이루어진다.
+class MyApp extends StatelessWidget {
-위의 경우, MyApp에서 빌드를 진행한다.
+  @override
-== 팁 ==
+= 팁 =
 대부분 IDE에서 ctrl+s를 통해 핫 리로드를 제공한다.(코드의 빠른 반영 확인)
 = 코드 예제 =
 {| class="wikitable"
 |+

2025년 12월 31일 (수) 13:24에 Sam님의 편집

2025-12-31T13:24:07Z

← 이전 판		2025년 12월 31일 (수) 13:24 판
18번째 줄:		18번째 줄:
	Widget build(BuildContext context) {		Widget build(BuildContext context) {
	return const MaterialApp(		return const MaterialApp(
	debugShowCheckedModeBanner: false,		debugShowCheckedModeBanner: false, // 디버그 표시 지우기.
	home: Scaffold(		home: Scaffold(
	body: Center(		body: Center(

Sam: Sam (토론)의 10859 판 편집을 되돌림

2025-12-31T05:27:30Z

Sam (토론)의 10859 판 편집을 되돌림

← 이전 판	2025년 12월 31일 (수) 05:27 판
1번째 줄:	1번째 줄:
		{{플러터}}

		== 개요 ==
		플러터 코드를 작성하는 데 있어 기본 개념에 대한 문서.

		== 기본 양식 ==
		<syntaxhighlight lang="dart">
		import 'package:flutter/material.dart'; // 마테리얼 디자인 관련 라이브러리.(안드로이드 방식. 이지만 ios도 지원)

		void main() {
		runApp(const MyApp());
		}

		class MyApp extends StatelessWidget {
		const MyApp({super.key});

		@override
		Widget build(BuildContext context) {
		return const MaterialApp(
		debugShowCheckedModeBanner: false,
		home: Scaffold(
		body: Center(
		child: Text('Hello, World!'),
		),
		),
		);
		}
		}

		</syntaxhighlight>기본적인 흐름은 main>runApp>위젯 형식이다. 위젯을 상속한 클래스의 build를 오버라이딩 하는 방식으로 이루어진다.

		위의 경우, MyApp에서 빌드를 진행한다.

		== 팁 ==
		대부분 IDE에서 ctrl+s를 통해 핫 리로드를 제공한다.(코드의 빠른 반영 확인)



		= 학습 =
		{\| class="wikitable"
		!사이트
		!설명
		!비고
		\|-
		\|공식 문서
		\|
		\|https://docs.flutter.dev/get-started/codelab
		\|-
		\|다트 패드
		\|다트로 작성한 코드를 실행하는 코드 에디터. 간단한 플러터 코드를 실험해볼 수 있다.
		\|https://dartpad.dev/
		\|}

		= 예제 =
		{\| class="wikitable"
		\|+
		!사이트
		!설명
		!비고
		\|-
		\|공식 문서
		\|
		\|https://api.flutter.dev/
		\|-
		\|공식
		\|공식 예제 사이트.
		\|https://flutter.github.io/samples/#
		\|-
		\|
		\|
		\|
		\|-
		\|
		\|
		\|
		\|}

Sam: 문서를 비움

2025-12-31T05:27:12Z

문서를 비움

← 이전 판		2025년 12월 31일 (수) 05:27 판
1번째 줄:		1번째 줄:
	~~{{플러터}}~~

	~~== 개요 ==~~
	~~플러터 코드를 작성하는 데 있어 기본 개념에 대한 문서.~~

	~~== 기본 양식 ==~~
	~~<syntaxhighlight lang="dart">~~
	~~import 'package:flutter/material.dart'; // 마테리얼 디자인 관련 라이브러리.(안드로이드 방식. 이지만 ios도 지원)~~

	~~void main() {~~
	~~runApp(const MyApp());~~
	}

	~~class MyApp extends StatelessWidget {~~
	~~const MyApp({super.key});~~

	~~@override~~
	~~Widget build(BuildContext context) {~~
	~~return const MaterialApp(~~
	~~debugShowCheckedModeBanner: false,~~
	~~home: Scaffold(~~
	~~body: Center(~~
	~~child: Text('Hello, World!'),~~
	),
	),
	);
	}
	}

	~~</syntaxhighlight>기본적인 흐름은 main>runApp>위젯 형식이다. 위젯을 상속한 클래스의 build를 오버라이딩 하는 방식으로 이루어진다.~~

	~~위의 경우, MyApp에서 빌드를 진행한다.~~

	~~== 팁 ==~~
	~~대부분 IDE에서 ctrl+s를 통해 핫 리로드를 제공한다.(코드의 빠른 반영 확인)~~



	~~= 학습 =~~
	~~{\| class="wikitable"~~
	~~!사이트~~
	~~!설명~~
	~~!비고~~
	\|-
	~~\|공식 문서~~
	\|
	~~\|https://docs.flutter.dev/get-started/codelab~~
	\|-
	~~\|다트 패드~~
	~~\|다트로 작성한 코드를 실행하는 코드 에디터. 간단한 플러터 코드를 실험해볼 수 있다.~~
	~~\|https://dartpad.dev/~~
	\|}

	~~= 예제 =~~
	~~{\| class="wikitable"~~
	\|+
	~~!사이트~~
	~~!설명~~
	~~!비고~~
	\|-
	~~\|공식 문서~~
	\|
	~~\|https://api.flutter.dev/~~
	\|-
	~~\|공식~~
	~~\|공식 예제 사이트.~~
	~~\|https://flutter.github.io/samples/#~~
	\|-
	\|
	\|
	\|
	\|-
	\|
	\|
	\|
	\|}

Sam: 새 문서: {{플러터}} == 개요 == 플러터 코드를 작성하는 데 있어 기본 개념에 대한 문서. == 기본 양식 == import 'package:flutter/material.dart'; // 마테리얼 디자인 관련 라이브러리.(안드로이드 방식. 이지만 ios도 지원) void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({super.key}); @override Widget build(BuildContext context) { return const MaterialAp...

2025-12-31T05:27:08Z

새 문서: {{플러터}} == 개요 == 플러터 코드를 작성하는 데 있어 기본 개념에 대한 문서. == 기본 양식 == <syntaxhighlight lang="dart"> import 'package:flutter/material.dart'; // 마테리얼 디자인 관련 라이브러리.(안드로이드 방식. 이지만 ios도 지원) void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({super.key}); @override Widget build(BuildContext context) { return const MaterialAp...

새 문서

{{플러터}}

== 개요 ==
플러터 코드를 작성하는 데 있어 기본 개념에 대한 문서.

== 기본 양식 ==
<syntaxhighlight lang="dart">
import 'package:flutter/material.dart'; // 마테리얼 디자인 관련 라이브러리.(안드로이드 방식. 이지만 ios도 지원)

void main() {
runApp(const MyApp());
}

class MyApp extends StatelessWidget {
const MyApp({super.key});

@override
Widget build(BuildContext context) {
return const MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
body: Center(
child: Text('Hello, World!'),
),
),
);
}
}

</syntaxhighlight>기본적인 흐름은 main>runApp>위젯 형식이다. 위젯을 상속한 클래스의 build를 오버라이딩 하는 방식으로 이루어진다.

위의 경우, MyApp에서 빌드를 진행한다.

== 팁 ==
대부분 IDE에서 ctrl+s를 통해 핫 리로드를 제공한다.(코드의 빠른 반영 확인)

= 학습 =
{| class="wikitable"
!사이트
!설명
!비고
|-
|공식 문서
|
|https://docs.flutter.dev/get-started/codelab
|-
|다트 패드
|다트로 작성한 코드를 실행하는 코드 에디터. 간단한 플러터 코드를 실험해볼 수 있다.
|https://dartpad.dev/
|}

= 예제 =
{| class="wikitable"
|+
!사이트
!설명
!비고
|-
|공식 문서
|
|https://api.flutter.dev/
|-
|공식
|공식 예제 사이트.
|https://flutter.github.io/samples/#
|-
|
|
|
|-
|
|
|
|}