Flutter 빠르게 배우고 느낀점

플러터

2023 대세로 떠오르는 플러터

Flutter 1.0까지는 존재만 알고 있었던 플러터. React-Native가 있는 상황에서 Dart라는 언어까지 배워가며 굳이 배울 필요가 있을까? 싶어서 한쪽으로 치우쳐놨던 프레임워크다.

그러다가 요즘들어 구글이 3.0까지 버전업을 하면서 Bridge를 거쳐야 하는 React-Native 보다 좀 더 '빠르다'는 유튜브들을 보고 학습하기 시작했다.

학습한 곳

처음에는 밀리의 서재에 Do it! 플러터 프로그래밍 책이 있길래 다운받아서 훑어보았다. 중간 정도 읽으니 뒷부분은 기능과 위젯 소개로 이어지고 있음을 깨달았다.
늘 그렇듯 가장 좋은 학습은 공식 홈페이지였다. 최신 기술까지 합쳐서 빠르게 시작할 수 있는 Tutorial들이 많기 때문이다.

Codelab은 85분 동안 간단한 앱을 만들며 Flutter의 핵심 개념을 배울 수 있도록 구성되어있다.
영어가 모자란 탓인지, 집중력 탓인지 나는 3시간 정도 걸렸다.

좋다고 느낀 점

알아서 구성되는 테마, 스타일

디자인 능력이 후진 나는, 웹 개발 할 때 Bootstrap을 가져다 줘도 CSS에서 한참 헤맸다. 하지만 Flutter에서는 colorScheme 기능이 있어서 메인 Color 하나만 정해 놓으면 나머지 요소들의 색들이 대부분 알아서 맞춰져서 MVP를 만들기에 너무 편하겠다는 생각이 들었다.
또한 CSS에서 flex 등으로 조정해줘야 하는 여백 채우기, 가운데 정렬 설정 등도 Column, Row 위젯을 활용하면 알아서 잘 작동하는 것으로 보인다. CSS 처럼 공부할수록 복잡해지겠지만, 기본 설정이 보기 좋게 셋팅되어 있다는 것이 마음에 든다.
안드로이드 스튜디오에서도 이런 기능이 있지만 제약이 너무 많았던 것 같다.

기능별로 쪼개진 위젯

너무 잘게 쪼개진 컴포넌트의 경우 불편하다고 느낄 수도 있겠지만, 나는 좋았다. 특히 Padding이나 SizedBox 는 별 생각없이 넣기만 하면 된다.

VSC Refactor 기능

Flutter를 배우다 보면 좀 걱정되는 점이 있긴 하다. 위젯을 너무 쪼개다보니 코드가 길어지면서 괄호 지옥이 발생한다.
이런 단점을 Flutter 개발진도 느꼈는데 VSC (다른 IDE에서도 비슷한 기능을 지원할 것 같다.) Package 자체에서 이 괄호가 어떤 위젯의 종료인지 알려주는 기능이 있다.
또한 괄호로 감싸는 것이 귀찮을 것을 대비해 Ctrl + .  키를 눌러 Refactor 기능을 쓰면 해당 위젯을 새로운 위젯으로 변경하며 새 위젯 클래스를 생성할 수도 있고, 흔히 많이 Wrapping 하는 Column, Widget, Container 등으로 감싸게 할 수도 있다.
Stateless 위젯을 Statefull 위젯으로 변경하는 것도 자칫 번거로울 수 있지만 Refactor가 알아서 State 까지 만들어준다.

단점

너무 긴 코드

Refactor  기능이 있더라도, 간단한 페이지를 만드는데도 코드가 좀 길어보이기는 한다. 다른 파일로 각 위젯을 따로 빼는 등 코드 분리 방안을 생각해야 할 것 같다.

가독성

View와 Control이 분리되지 않아 위젯간의 포함관계를 한눈에 보기가 어렵다.

State 관리의 복잡함

쓸 데 없이 Update를 여러번 하는 것을 줄이고자 State를 통해 상태 업데이트를 관리한다. 그런데 처음 입문하기에는 State 관리를 하면서 코드가 너무 길어지는 듯하게 느껴진다. 좀 더 공부해봐야겠다.




댓글

이 블로그의 인기 게시물

인디 게임 탐방 - Dictators:No Peace

[Python 텔레그램 봇] 버튼 기능 만들기 - Pt.1 알아둘 것들

[개발일지] Box Tengo - 리팩토링. 게임 세팅 Scriptable 화