2018년 3월의 깃허브 트렌드 - Flutter ①

지난 2월의 깃허브(GitHub) 기술 트렌드로 “DEVELOPER-ROADMAP”을 소개해드렸습니다. 개발자의 로드맵과 인터뷰에 대한 많은 프로젝트 중 Web developer를 크게 백엔드와 프런트엔드, DevOps로 나누어 보기 좋게 시각화한 프로젝트였습니다.

2월의 깃허브 트렌드, Web Developer Roadmap 1 의 배너이미지 2월의 깃허브 트렌드 - https://www.samsungsds.com/global/ko/support/insights/Feb_Trend1.html#p

그렇다면 3월의 깃허브에서는 어떤 프로젝트가 개발자들에게 큰 호응을 얻었을까요?

1. 3월의 가장 핫한 프로젝트 10선 (3월 19일 기준)

아래는 3월 한 달간 깃허브에 올라온 프로젝트 중 많은 호응을 얻었던 프로젝트들입니다.

Interview Notebook은 중국 개발자들이 자신들의 취업 인터뷰 노하우를 모아 놓은 사이트고, awesome blockchain은 블록체인 오픈소스나 사이트들을 잘 정리해 놓은 프로젝트입니다. 개인적으로는 front end interview handbook 프로젝트가 재미있어 보입니다. 어떻든 다양한 프로젝트를 통해 내가 알고 있는 것과 모르는 것을 체크하는 것만으로도 큰 도움이 될 것입니다.

◎   Interview-Notebook
◎   flutter
◎   awesome-blockchain
◎   FastPhotoStyle
◎   Requests-html
◎   30-seconds-of-css
◎   front-end-interview-handbook
◎   mpvue
◎   rough
◎   xray

3월의 트렌드를 웹서치한 화면. Repositories탭이 선택된 상태로 3월의 트렌드 프로젝트들이 보인다. 프로젝트는 다음과 같다. CyC2018/Interview-Notebook, flutter/flutter, chaozh/awesome-blockchain-cn, NVIDIA/FastPhotoStyle, kennethreitz/requests-html 3월의 트렌드

2. 주목할 만한 프로젝트: Flutter

여러 좋은 프로젝트들이 눈에 띄었지만, 잠시 미뤄두고 Flutter를 먼저 소개할까 합니다. Flutter는 ‘아름다운 모바일 앱을 빠르게 개발할 수 있게 해준다’는 타이틀을 가지고 있습니다.

flutter는 아름다운 모바일 앱을 빠르게 개발할 수 있게 해준다가 영문으로 적혀 있다. Flutter makes it easy and fast to build beacutiful mobile apps.

어디선가 많이 들어본 콘셉트입니다. “아름다운”이 들어간 것 외에는 리액트 네이티브와 정확히 일치하는 콘셉트의 프로젝트입니다.
이 Flutter는 리액트 네이티브와 지향점이 같을 뿐만 아니라, 베꼈다고 해도 무방할 정도로 비슷한 아키텍처를 갖고 있습니다. 모바일 개발을 하나의 언어로 통합 개발한다는 점, 그 언어가 네이티브 컴포넌트를 직접적으로 컨트롤하기 때문에 개발 생산성에 큰 효과를 준다는 점이 바로 그것이죠. 이러한 아키텍처 때문에 Flutter는 하이브리드 앱에 비해 성능적으로 우위에 있다고 할 수 있습니다. 다른 점이라면 Dart라는 언어를 쓴다는 점과 더 좋은 개발 용이성이라 할 수 있습니다. 여러가지 이유로 리액트 네이티브와 서로 자극을 주고받는 프로젝트로 성장하면 좋을 듯합니다.

Flutter 홈페이지: https://flutter.io/
깃허브 내 Flutter 페이지: https://github.com/flutter/flutter

Flutter 홈페이지 화면으로 파랑색과 흰색을 주로 이용하여 구성되어 있고 Build beautiful native apps in record time 이라는 타이틀과 Flutter is Google's mobile UI framework for crafting high-quality native interfaces on iOS and Android in record time. Flutter works with existing code, is used by developers and organizations around the world, and is free and open source. 라고 설명이 적혀 있다. 그 아래도 GET STARTED 버튼이 있다. Flutter 홈페이지 화면

2.1 설치

설치는 Mac을 기준으로 설명하겠습니다. Windows의 경우 https://flutter.io/setup-windows/를 참고하시면 됩니다.
   - Dependency (외부 라이브러리): bash, mkdir, rm, git, curl, unzip, which
   - 설치 순서: flutter SDK, 에디터, Xcode, Android Studio, Dart
기본적으로 Xcode에 포함된 xcodebuild가 있어야 iOS 개발이 가능하고, Android SDK가 있어야 안드로이드 개발이 가능합니다. (빌드가 되어야 하니까요!) 그리고 빌드 후, iOS는 Xcode와 함께 설치되는 시뮬레이터에서, Android는 Android Studio와 함께 설치되는 에뮬레이터에서 결과를 확인해보거나 장비에 탑재할 수 있습니다.

SDK
SDK의 경우, 아직 베타라서 그런지 git 리포지토리(repository)에서 직접 가져와서 PATH에 놓고 사용해야 합니다.

git clone -b beta https://github.com/flutter/flutter.git
$ export PATH=`pwd`/flutter/bin:$PATH

Xcode
Xcode는 https://itunes.apple.com/us/app/xcode/id497799835에서 설치할 수 있습니다. (용량이 큽니다!) 이후 커맨드 라인 툴을 사용하기 위해서는 다음과 같은 명령어를 실행해야 합니다.

$sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer

Android Studio
안드로이드 스튜디오는 https://developer.android.com/studio/index.html 링크를 찾아가서 설치해야 합니다.


에디터
(개인적으로 좋아하는) VSCode를 설치해봤는데, 결과가 꽤 성공적이어서 여러분께도 추천합니다! (Atom은 Rust 버전이 나온다고 하니 나중에 사용해보겠습니다.)
여기까지 설치하고 나면, 실행되는 데 문제가 없는지 flutter doctor를 실행해 확인해봅니다.

$flutter doctor
Flutter doctor 실행시 Dart SDK가 다운로딩 되고 있음을 보여주는 실행화면 Flutter doctor 실행화면

Dart가 자동으로 설치됩니다. 조금 더 기다리면 다른 개발 디펜던시 확인 후, 아래와 같은 콘솔 메시지가 나타납니다.

Dart가 자동으로 설치되고, 조금 더 기다리면 다른 개발 디펜던시를 확인한 뒤에 나타나는 콘솔 메시지 화면. Flutter에 온걸 환영한다는 문구와 함께, Material fonts, package sky_engine, common tools, darwin-x64 tools, android-arm-profile/darwin-x64 tools가 다운로딩 되고 있다. 콘솔 메시지

맺으며

이상으로 3월의 깃허브 10대 트렌드로 주목할 만한 프로젝트 Flutter에 대한 소개와 설치 방법에 대해 알아보았습니다. 다음 연재에서는 Flutter의 실행 방법과 Flutter 개발 언어인 Dart에 대해 알아보겠습니다.



▶   해당 콘텐츠는 저작권법에 의하여 보호받는 저작물로 기고자에 저작권이 있습니다.
▶   해당 콘텐츠는 사전 동의없이 2차 가공 및 영리적인 이용을 금하고 있습니다.

공유하기
도경태 프로
도경태 프로 IT테크놀로지 전문가
삼성SDS 개발실

SCP(SDS Certified Professional)로 삼성SDS에서 테크리드를 담당하고 있습니다. OSGeo에서 오픈소스 활동을 하고 있습니다. 잘 모르는 기술에 대해서 낯선 사람들과 이야기 하면서 배워 나가는 것을 좋아합니다.