[flutter] 기초강의 1

flutter가 멀티 플랫폼 개발을 지원함.

근래에는 웹사이트 어플레이케이션 ios android, 맥  os , 윈도우, 리눅스 , 사물인터넷같은 임베디드 어플리케이션도 가능

3개의 다른 어플리케이션과 졸업하게 될것임.

앞으로 할것들

포모도로

웹툰 어플리케이션

동적인 api

navigation 

애니메이션

사용자 핸드폰 내의 data storage사용

---

1.2

 

flutter이용하는 브랜드 

구글도 플러터 이용중. 플러터 사장시키진 않을것임. 구글페이도 flutter

wonderous 앱 애니메이션 매우 아름다움! 

 

flutter plasma. flutter의 애니메이션에 대한 가능성을 보여주는 프로젝트

flutter로 게임도 만들 수 있다. 

google i/o pinball

https://pinball.flutter.dev/#/

 

---

1.3

swift나 java는 ios, android의 운영체제와 직접적으로 대화를 하게 된다 

예를들어 버튼이나 text input등 모든 요소를 만들어달라고 얘기하게 됨. 

운영체제가 버튼을 만들어 준다. 

  하지만 dart는 그렇지 않다. 

flutter가 다른 크로스 플랫폼 프레임워크처럼 동작하는 것이 아니어서 그렇다. 

비디오 게임 엔진같이 동작한다. 

dart code가 flutter 프레임워크 상에서 이용되고 

flutter 프레임워크는 위에 보이는 요소를 포함하고 있다. 

그런데 실제 화면에 뿌려줄 때에는 운영체제와 직접적 대화를 하진 않는다. 그렇게 되면 크로스 플랫폼이 아니기 때문이다. 

대신 엔진을 사용한다. 이 엔진은 c언어나 c++언어로 짜여졌다. 이게 우리 어플리케이션의 실제 ui를 렌더링하는데 책임져줄 flutter엔진이다. 

대신 엔진이 화면상에 우리가 말한 것을 그려준다. 마치 비디오 게임 엔진 처럼

unity의 경우 코드를 패키징한 후 앱스토어로 보낸다. 유저가 그 앱을 다운로드 받으면 그 앱이 코드를 실행시킨다. 

flutter도 마찬가지.

 

이러한 이유 때문에 flutter 어플리케이션은 플랫폼의 natvie widget을 사용하지 않는다. 

왜냐면 엔진이 모든 것을 그려주기 때문이다.  

디바이스는 오직 엔진을 동작시키지, 그려주는 역할을 하지 않는다. 

이 시점에서.. seo측면에서 괜찮은가? 하는 생각은 들었다. https://medium.com/@nandhuraj/understanding-server-side-rendering-ssr-in-flutter-b27a06490ce0

 

어떻게 플러터가 ios에서 코드를 실행시키는지

로우레벨 가상머신에서 엔진의 c,c++ 코드가 컴파일되고, 다트코드는 네이티브 arm(ios의 cpu)라이브러리로 컴파일 된다. 

라이브러리는 runner ios프로젝트에 포함된다. 그리고 이 모든건 .ipa라는 ios어플리케이션의 포맷으로 빌드된다. 

유저가 앱을 실행시키면 앱(엔진)은 flutter 라이브러리를 로드한다.(렌더링)

 

플랫폼은 엔진을 동작시키고 엔진이 (dart코드가 arm라이브러리로 컴파일된 후 ios어플리케이션의 포맷으로 빌드된)코드를 동작시키면

ui가 그리지는 것이다.

그래서 유저가 어플리케이션을 다운로드 받은 후 실행시키면 엔진이 여는 것은 runner ios프로젝트이다.

엔진은 플랫폼마다 다르게 컴파일 될것이고, 다트코드도 플랫폼마다 다르게 빌드된 프로젝트가 될것이다.

그리고 그 엔진이 프로젝트를 실행시키는 것이다. 

 

네이티브 위젯을 이용하지 못하는 이유이다. 

플러터팀은 ios처럼 보이기 위한 위젯을 만드려고 했지만 못했다. 

그런데 이게 flutter를 통해 통제할 수 있는 것들이 많아진다는 점이 되기도 한다. 

navigation, 애니메이션 등 모든 걸 통제할 수 있는 이유는 화면상의 모든 픽셀을 조절하기 때문이다. 

어플리케이션의 호스트에 의존할 필요가 없다. 

화면상의 픽셀을 통해 모든게 가능하다. 

네이티브 위젯을 사용할수 없기 때문에 조금 부자연스러워보이는데 이걸 좀더 자연스럽게 만든느 방법도 있다. 

 

플러터가 하는 건 단순히 엔진을 어플리케이션 내부에 집어넣고 다트코드를 컴파일 하는 것이다. 

유저가 어플리케이션을 실행시키면 runner프로젝트를 실행시키고 엔진이 모든 ui를 프레임워크와 함께 그려준다. 

 

- embedder

엔진을 가동시키는 runner프로젝트를 가리킴., 그래서 플래폼마다의 다양한 embedder가 존재

embedder의 역할은 호스트 플랫폼상에서 엔진을 가동시키는 역할만 한다. 

 

flutter어플리케이션을 하나의 캔버스로 이해하면 된다. 

(어, 픽셀로 조정 가능하면?  인터렉션으로 픽셀 조정이 가능한거?)

유저가 flutter로 만든 앱을 열때 빈 캔버스가 열리고 어플리케이션이 시작되면 엔진이 즉시 가동이 되고 모든위젯을 그려준느 것이다. 

 

정리하자면 엔진이 플랫폼마다 변경되고, 운영체제는 엔진만 돌릴것이고, 엔진은 같은 코드를 렌더링하면서 크로스 플랫폼이 가능한것.

 

---

1.4 flutter vs React Native

게임엔진과 마찬가지로 flutter는 코드를 실행할 때 호스트 플랫폼을 이용하지 않는다. 

하지만 이런 특성으로 인하여 네이티브한 위젯을 사용할 수 없고, 이것이 flutter사용여부의 기로가 되는 문제다. 

ios미리알림 등 네이티브한 기능이 들어간 앱을 만든다 할 때, 네이티브 앱 운영체제 상에서 가능한 위젯을 사용하고 싶을 땐  React Native 추천. 

애니메이션 커스터마이징이 요구된다면, flutter.

복잡해 보이는 애니메이션 flutter에서는 어렵지 않다. 이게 주요.

근데 내 생각에는 uiux가 중요한 시점이므로 flutter가 더 좋지않을까? 하는 생각.