[Flutter] 설치 및 개발환경 세팅 - macOS

스윗포테이토·2023년 11월 24일
0

why Flutter?

웹으로 구현했으면 기반 지식이 있으니 훨씬 빨랐을 것 같긴 하지만... 현재 하고 있는 프로젝트 주제를 생각했을 때 사용성이 좋은 쪽은 모바일 어플리케이션이다. 그리고 native는 나중에 나에게 큰 도움이 되지 않을 것 같았다. 그리고 가능하면 cross-platform을 지원하는 프레임워크를 사용하고 싶었기 때문에 React-Native와 Flutter 중에 고민을 했다.

React Native vs Flutter

RN과 flutter를 비교하는 글은 이미 많으니까 길게 적지는 않을 생각이다.
가장 큰 차이점이라고 하면 Flutter는 host OS에서 컴포넌트를 가져다가 쓰는 방식이 아니라, 엔진이 API를 제공하기 때문에 그래픽의 자유도가 높은 장점이 있다. 따라오는 단점으로는 host에서 제공하는 컴포넌트를 쓰는 것이 아니기 때문에 native 앱으로 보이지 않을 수 있다는 점이 있다.

리액트 개발 경험이 있기 때문에 RN을 시작하는게 학습 비용은 작았을 것이라고 생각하지만... 솔직히 구글에서 만든 dart, flutter를 배워보고 싶은 마음이 전부터 있었음 + flutter 개발 경험이 그렇게 좋다고 하길래 궁금한 마음 + 우리 팀 디자이너를 믿는 마음에서 flutter를 선택하게 되었다.

설치

원래 뭐든 설치가 어려운 법이니까...

OS: MacOS Monterey 12.3
Chip: Apple M1 Pro

(스포하자면) 결국 OS를 업데이트 했다.

공식 홈페이지에 가면 OS별 설치 방법이 나와 있다.


안타깝게도 requirements에서는 10.14 이상의 MacOS 버전을 요구하고 있었다.
그러나 나는... flutter하나 배우자고 OS 업데이트를 하는 이 상황을 받아들일 수 없었고(사실 무서움) 일단 킵 고잉 해보기로 했다.

  1. Flutter SDK 설치
    zip 파일을 받으라는데, 귀찮으므로 이 과정은 homebrew를 통한 설치로 끝냈다.

    brew install --cask flutter

    환경변수도 따로 세팅할 필요가 없다!
    web, 혹은 MacOS Desktop 앱을 만들기 위해서면 여기까지만 해도 된다.

  2. iOS setup
    문제는 여기서 발생했다.
    Xcode를 깔아줘야 하는데, AppStore에서 설치하려고 하니까, OS version이 14이상 되어야 설치가 가능하다고 하더라...

    따라서 web에서 직접 지난 버전을 설치하기로 했다.
    https://developer.apple.com/download/all/?q=XCode

    어떤 버전을 깔아야 하는지는 여기를 보면 알 수 있다.

    내 OS는 12.3 버전이므로 Xcode13.4.1 버전을 깔면 되겠다고 생각했으나,
    설치 이후 flutter doctor 명령어를 통해 확인해보니 Xcode 14이상이 필요하다는게 아닌가...

    그리고 Xcode 14 버전 부터는 macOS 12.5 이상에서 설치할 수 있다(...)

    결국 OS를 업데이트 해줘야 했다.
    그러나 major version 업데이트는 무서우니까, 같은 12버전에서 마이너 업데이트를 진행했다.

    [About This Mac] > [Software Update...]에 들어가면, 운영체제를 업데이트 할 수 있다. 용감하신 분은 바로 Upgrade Now를 통해 업그레이드 하면 되고, 마이너 업데이트를 위해서는 [More Info...]를 눌러서 진행하면 된다.

    이후 Xcode 14.2 버전을 설치했고, flutter doctor에게 통과를 받았다.

    안드로이드는 당분간은 필요 없을 듯해서 따로 설정해주지는 않았다.

  3. VSCode extension 설정
    VSCode가 설치되지 않았다면, 역시 homebrew를 통해 설치할 수 있다.

    brew install --cask visual-studio-code

    이미 깔려 있다면, 두 가지 extension을 설치하면 더욱 쾌적한 개발을 할 수 있다.

    1. Dart
    2. Flutter

프로젝트 생성

원하는 위치에서 터미널을 열어서,

flutter create <project name>

으로 간단히 flutter 프로젝트를 생성할 수 있다.
혹은 이미 폴더가 있는 상황이라면, 해당 폴더 내에 들어가서 project 이름 대신 .을 넣어서 실행하면 된다.

flutter create .
profile
나의 삽질이 미래의 누군가를 구할 수 있다면...

0개의 댓글