오준석의 플러터 생존코딩#2 - 0~1장

ieed0205·2020년 3월 19일
0

Flutter_생존코딩

목록 보기
2/7
post-thumbnail

목차

1. Opening
2. 0장) 앱 개발 방식
3. 1장) Flutter에 입문하기

1. Opening

안녕하세요! LEE'Today입니다.
#1부터 진행하고 있는 '오준석의 Flutter 생존코딩' Book 리뷰입니다.
업로드 시간은 불규칙적일수도 있으며,
전체를 전달하는 것이 아닌 핵심적인 부분을 반영하여 정리해서 올리는 것이니 자세하게 알고 싶으시면 직접 구매하셔서 보시거나 덧글을 남겨주세요!

앱을 개발하기 위해선 3가지의 개발 방식이 있다.

  • 네이티브 방식
  • 하이브리드 방식
  • 크로스플랫폼 방식

이 3가지 방식 중 개발 도구나 환경은 다양하지만, 대표적으로 핸드폰 두 기종에 대한 어플리케이션을 설명하고자 한다.
우선 아이폰 기종은 맥OS 개발 환경에서 밖에 구현을 하지 못한다.
본인은 Window를 활용하므로 아이폰 기종이 아닌 다른 핸드폰 기종에 관하여 설명하도록 하겠다.
간단하게 시각화 하면 3가지를 정리하면 다음과 같다.


2. 0장) 앱 개발 방식

책의 '0장-플러터 개발 환경 준비하기' 에 수록된 내용입니다.

네이티브 방식, 하이브리드 방식, 크로스플랫폼 방식에 대해서 설명을 해보겠다.

2-1. 네이티브 방식

개발환경으로는 Android Studio를 사용하고 언어로는 Java, 코틀린을 사용하게 된다.
IOS는 맥OS만 다룰 수 있으며 개발도구로는 Xcode,스위프트,오브젝트-C를 활용한다.
네이티브 방식은 다른 방식보다 강하고 더 복잡한 것을 구현할 수 있지만, 안드로이드와 IOS를 다룰려면 서로 다른 방식을 공부해야 하며 모든 코드를 섬세하게 다뤄야하기에 시간이 오래걸리는 방식이다.
하지만 그만큼 어플리케이션의 완성도는 높다고 보면 된다.

2-2. 하이브리드 방식

웹 기술을 바탕으로 앱 화면을 만든 후 네이티브 기술로 감싸서 앱 형태로 포장하는 방식이다.
기존의 웹 기술을 활용하고 빠르게 앱으로 전환이 가능하여 빠른 앱 개발이 가능하다.
But, 네이티브 성능에는 미치지 못하고 UI도 전체적으로 앱 느낌을 못낸다.

2-3. 크로스플랫폼 방식

한 번의 구현으로 안드로이드와 IOS 등 각 플랫폼 용 앱을 만들 수 있다.
이 방식으로 빌드(앱을 완성하는 과정)할 때, 네이티브 코드로 변환되기에 네이티브와 같은 성능을 보장한다.
대표적으로 Flutter가 자리 잡고 있다.

이 리뷰에는 크로스 플랫폼을 다루도록 할 것이다!


3. 1장) Flutter에 입문하기

책의 '1장-플러터에 입문하기' 에 수록된 내용입니다.

3-1. pubspec.yaml

Android Studio에 접속하여 [Fltter새프로젝트]를 만드시면,
왼쪽에 Project에서 [test - pubspec.yaml]를 들어가보시면
이와 같이 나타날 것입니다.

왼쪽 상단파일들은 '3장-프로젝트 구조와 앱구조'에서 다루겠습니다.
우선 상단 빨간 네모박스를 정리하면 다음과 같습니다.

  • Packages get : 외부 라이브러리를 추가한 후 프로젝트에 다운로드하여 적용합니다.
  • Packages upgrade : 외부 라이브러리 버전 등을 변경한 후 반영합니다.
  • Flutter upgrade : 플러터 SDK의 버전을 업그레이드 합니다.
  • Flutter doctor : 플러터 환경 설정이 잘되어있는지 검사합니다.

우리는 여기서 Flutter doctor에서 환경 설정이 잘 되어있는지 검증할 필요가 있습니다.
잘 환경이 구현되어있다면 대부분 [V] 마크로 정상이 되어있을 것입니다.
안되어있다면 명령어 가이드로 친절하게 해결방법을 알려주니 잘 따라하면 될 것입니다!

3-2. 핫 리로드(not Reload)

플러터에서는 핫 리로드 기능을 지원합니다.
수정한 코드를 즉시 앱에 반영하는 기술인데 여기서 '앱'은 '애뮬레이터'가 되겠습니다.
코드를 수정하고 즉시 Ctrl+s를 누르시면 애뮬레이터가 즉각 변경됩니다.

3-3. 애뮬레이터 한국어 설정

애뮬레이터가 구글에서 지원되는 것이라 초기 언어에 영어로 설정되어있습니다. 즉, 한글이 사용이 안됩니다.
그래서 추후 개발에 한글을 키보드로 쳐야하는 상황이 발생할 수도 있으니 설정을 해봅시다!

  1. 애뮬레이터의 상단 상태바를 아래로 드래그하여 설정 아이콘을 클릭!
  2. 'System' 메뉴를 선택합니다.
  3. 'Languages & Input' 메뉴를 선택합니다.
  4. 'Languages' 메뉴를 선택합니다.
  5. 'Add a language' 메뉴를 선택합니다.
  6. 검색 창에서 'Korea'를 검색하여 한국어를 선택합니다.
  7. '대한민국'을 선택합니다.
  8. 오른쪽의 이동 핸들을 클릭하고 위로 드래그하여 한국어가 1번이 되도록 합니다.

이와같이 Flutter의 애뮬레이터까지 따라오셨을 것이라 예상됩니다!
이제 본격적으로 dart언어에 대해서 다음 리뷰를 따라가보도록 하겠습니다.
감사합니다.

profile
하루를 기억하고 기록하는 개발자 LEE'Today입니다.

0개의 댓글