플러터

Write Your First App.dart

import 'package:flutter/material.dart';
​
// void main() { ... } 로 적어도 되지만, shorthand 버전으로 => 심볼을 활용 가능
void main() => runApp(MyApp());
​
/*
StatelessWidget 과 StatefulWidget 사이의 차이. StatelessWidget은 단 한번만 Build를 한다. 
한번 그려진 화면은 계속 유지되며, 성능상 장점이 생긴다. StatefulWidget은 state를 포함하며, 
setState가 발생할때마다 Build과정이 일어나고, 동적 화면을 쉽게 구현이 가능하다.
-  [출처] https://security-nanglam.tistory.com/478

쨋든 Widget 이라는 놈이 화면에 그려지는 (Invalidation) 일은 Build 라는 메서드를 통해서 일어난다.
*/
class MyApp extends StatelessWidget {
  /*
    화면에 디스플레이 하는 역할의 build 함수는 결국 Widget 이라는 놈을 반환함.
    - 시스템은 Widget 을 디스플레이 하는 방법을 알고 있음.
    - 들은바로는 플러러에서 거의 모든것이 Widget 으로 표현된다고 함.
    - return MaterialApp 이 결국 Widget 의 한 종류라는 것인데.... 확인해보니 맞음
      class MaterialApp extends StatefulWidget {
        /// Creates a MaterialApp.
      https://github.com/flutter/flutter/blob/c99f60b82f03db3c4a6cfee2a53ffb73e53ab431/packages/flutter/lib/src/material/app.dart#L154-L155

    - 그런데 MaterialApp 은 또 StatefulWidget 의 일종임  
  */  
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Welcome to Flutter',
      /*
        들은바로는 Scaffold, AppBar, Center, Text 모두 Widget 의 한 종류라고 함.
        - MaterialApp 생성시, 딕셔너리 처럼 넣어진 저 구조는 아무것도 의미하지 않음.
        - 단지 MaterialApp 내부적으로, 합당한 위치에 지정된 Widget 을 담아두겠다는 뜻임.
        - MaterialApp 이 만들어지면, 내부적으로 가진 각 Widget 을 배치한 하나의 최상위 Widget 을 반환하는 구조로 추측

        Scaffold 라고 정의된 위젯은 디폴트 appBar 와 body 를 이미 포함한 Widget 임.
      */      
      home: Scaffold(
        appBar: AppBar( // https://api.flutter.dev/flutter/material/AppBar-class.html
          title: Text('Welcome to Flutter'),  // https://api.flutter.dev/flutter/widgets/Text-class.html 
        ),
        body: Center( // https://api.flutter.dev/flutter/widgets/Center-class.html
          child: Text('Hello World'),
        ),
      ),
    );
  }
}

Write Your First App2.dart

import 'package:flutter/material.dart';
import 'package:english_words/english_words.dart';
​
void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Welcome to Flutter',
      home: Scaffold(
        appBar: AppBar( 
          title: Text('Welcome to Flutter'),  
        ),
        body: Center(
          child: RandomWords(),
        ),
      ),
    );
  }
}

class RandomWords extends StatefulWidget {
  @override
  _RandomWordsState createState() => _RandomWordsState();
}

class _RandomWordsState extends State<RandomWords> {
  @override
  Widget build(BuildContext context) {
    final wordPair = WordPair.random();
    return Text(wordPair.asPascalCase);
  }
}