코딩의 시작은 코드를 뜯어봐야지!

BBANG-JUN·2020년 3월 19일
0

🌊Daily

목록 보기
6/15

오늘 하루엔 뭐했니?

그냥 적어봐! LEE렇게!


2020.03.19 LEE'Today_회고록

목차
1. Counting APP 코드분석
2. 앱 구조 파악
3. 마무리

1. Counting APP 코드분석

오늘은 Flutter를 공부하면서 전체적인 흐름을 파악했던 날이다.
Flutter를 처음 프로젝트를 생성하게 되면 간단한 Demo app이 있다.
어플을 앞으로 만들어가게 되면서 코드를 뜯어봐야 전체적인 흐름을 알 수 있을 것 같아 시작하게 되었다.

전체적인 코드를 보고싶다면?
Github 를 클릭해서 들어가보자!

2. 앱 구조 파악


총 3개의 class와 main()이라는 최상위 함수로 구성되어 있다.
또한 상속 관계를 통해 StatelessWidget과 StatefulWidget을 활용하는 것을 볼 수 있다.

Flutter에서 가장 중요한 것은 바로 두 가지 클래스이다.

  • StatelessWidget
  • StatefulWidget
    이 두 가지의 클래스는 모든 App을 만들 때 기초가 된다.

2-1. class StatelessWidget

  • 상태(State)를 가지지 않는 클래스
  • 즉, 상태를 가지지 않는다는 것은 한 번 그려진 후 다시 그리지 않는 것
  • 이러한 클래스는 프로퍼티 변수를 가지지 않습니다. (상수는 가질 수 있다. )

프로퍼티(property) 변수란?
: 클래스 내부의 속성들을 표현하는 것이다.
: main에서 접근이 가능한 class 변수라고 생각하자!

그렇담 Statelessful은 어떤 변수를 가질까?
프라이빗(private) 변수를 가진다.
: 해당 변수는 class 내부에서만 다룰 수 있으며, main에선 접근이 불가능하다.
: 즉, 외부의 영향으로 변경이 되지 않는 변수라고 생각하자!
: 변수 앞에 '_(언더바)'를 사용한다.

var _count = 0;
var _title = 'Hello';

2-1. class StatefulWidget

: 상태(State)를 가지는 클래스이다.
: 즉, 계속 수정하고 그려질 수 있는 도화지라고 생각하자!

StatefulWidget은 @override로 생성하게 되면,
기본적으로 StatefulWidget을 상속 받을 서브 클래스와,

class MyHomePage extends StatefulWidget{ ...생략... }

상태를 계속해서 변경시켜주는 상태(부모) 클래스가 생성된다.

class _MyHomePageState extends State<MyHomePage>{ ...생략...} 

해당 상태 클래스에 코딩을 하면 MyHomePage에 반영되어, 우리가 직접 변경된 APP 화면을 볼 수 있게 되는 것이다.

3. 마무리

각 State(상태)가 없는 StatelessWidget과 State(상태)가 있는 StatefulWidget을 알아보았다.

위 두가지를 빠르게 @override를 생성하는 법은?

맨 아래 빈 코드 부분에 'st'만 쳐도 stful, stless가 나타난다.
생성한 후 class 이름을 설정해주면 바로 사용해주면 된다.

또한 해당 위젯 빌드라는 메서드가 포함되어 있을 것이다.
해당 Counting APP의 StatelessWidget은 MaterialApp을 반환 값으로 주었고,

Widget build(BuildContext context){
	return MaterialApp( ...생략... );
}

StatefulWidget의 두 가지 중에선 상태 클래스에 빌드가 포함되어 있다.
return값은 Scaffold로 구현하여 '...생략...' 부분에 코딩을 하게 된다.

Widget build(BuildContext context){
	return Scaffold( ...생략... );
}

해당 코드를 뜯어 보는게 궁금하다면?
'LEE'Today의 오준석의 플러터 생존코딩 시리즈'를 보자!


Flutter를 공부하면서 오늘이 가장 변환점을 겪었던 것 같다.
코드를 직접 뜯어봐야 공부가 되고, 나의 지식이 되는 것을 알게되었다.

이렇게 코드를 뜯어보는 걸 방학 기간에 일찍 했다면 벌써 졸업 작품을 마쳤겠다고 생각이 들었다.

반성한다.

그래도 아직 늦지 않았다고 생각한다.
포기하지 않고 Flutter에 대해서 차근차근 기초부터 배워 나가는 자신이 되야겠다고 느낀 하루였다.

기억보단 기록하자! LEE'Today로!

profile
🔥 머릿속으로 생각하지만 말고, 행동으로 보여줘

0개의 댓글