개발 환경 구축 Part 2.

저번 포스팅에서, Flutter SDK와 IDE인 Android Studio 를 성공적으로 설치했다.

강의 내용 기준으로, 이제 Xcode와 FVM(Flutter Version Management), Android Virtual Device 를 설치하고 구동하면 끝이 난다.

Xcode 설치는 강의 내용 상 Optional로 돼있고, 내 맥북에는 이미 강의 시청 이전에 앱스토어를 통해 깔아놓아서 괜히 혼란이 올 것 같아 다시 진행하지는 않았다.

다만, Xcode 설치 내용 중 Homebrew를 설치하는 것이 같이 있는데, 이것은 macOS를 사용하는 개발자들이 거의 대부분 사용하는 애플리케이션이기도 하고, 강의에서도 Homebrew를 통해 Xcode, Ruby, CocoaPods와 FVM을 설치하기에 Xcode 설치를 제외하고는 모두 내용에 넣었다.

🍺 Homebrew

※ 이미지를 클릭하면 Homebrew 공식 홈페이지로 들어갈 수 있다.

루비와 Git으로 개발된 macOS용 패키지 관리 애플리케이션이다. macOS에서 필요하지만 애플에서는 제공하지 않는 소프트웨어를 제공한다. 터미널에 명령어를 치면 설치가 완료되기에 편하기도 하다. 리눅스 터미널에 익숙해져 있다면 쓰는 것도 괜찮다고 한다. Homebrew는 BSD의 포트 방식, 즉 바이너리 파일을 받는 게 아닌, 파일을 받아서 자체 컴파일을 시켜버리기 때문에 큰 프로그램의 경우 시간이 꽤나 걸릴 수 있다.

터미널 상 명령어는 보통 brew로 시작되며 자주 쓰이는 명령어는 설치(brew install 설치대상), Homebrew 업데이트(brew update) 등이 있다.

따라서 이제부터 Homebrew 를 설치할 것이다. 자, 이제 설치해보자.

1. Homebrew 설치(macOS)

먼저 위의 🍺 을 클릭하거나 Homebrew 이미지를 클릭하여 공식 홈페이지로 들어가자.

들어갔다면, 이러한 페이지가 나올 것이다. 언어가 영어로 뜰 수 있는데, 한국어를 원한다면 홈페이지에서 자체 언어 설정이 있어 한국어로 바꿔주면 된다.

밑에 Homebrew 설치하기를 보면, (24.02.03 기준)

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

이러한 명령어가 있다. 오른쪽에 복사 버튼을 클릭하여 복사해준 후, 터미널을 열고 입력해주면

패스워드 입력이 뜨는데, 맥북의 패스워드를 입력해준다. 그러면

이러한 것이 뜰텐데, brew를 설치할 수 있는 옵션들을 설명해주는 것이라고 한다. 그대로 엔터를 누르면

이렇게 다운로드를 받으며 설치가 진행이 된다.

이러한 화면이 뜨면 일단 설치는 거의 성공이다.

2. Homebrew 환경 변수 설정

설치 자체는 잘 된 듯 하나,

Warning: /opt/homebrew/bin is not in your PATH.

라는 문장이 보인다. 아무래도 환경 변수 설정을 해줘야하는 듯 하다.

아래의 ==> Next steps: 부분을 보면

이 부분을 복사하여

입력해준 뒤, brew 명령어를 입력하면

이렇게 brew가 정상적으로 실행되는 것을 볼 수 있다.

이대로 brew를 바로 실행시킬 수도 있지만, 강의에선 rbenv(ruby 가상 환경)를 추가로 설치한다.

💎 Ruby

※ 이미지를 클릭하면 Ruby 공식 홈페이지로 들어갈 수 있다.

스크립트 언어의 일종. 창시자는 마츠모토 유키히로(Matz)로 1995년에 발표되었다. Python과 Perl, Smalltalk, Ada, Lisp, Eiffel 등의 프로그래밍 언어로부터 일부 문법 사항을 계승하고 발전시켜, 일반적인 목적에 적합하게 만든 언어이다. 언어의 문법이 쉽고 확장이 편리해서, 잘 디자인된 라이브러리를 이용하면 프로그래밍을 처음 시작한 사람도 복잡한 작업을 상대적으로 쉽게 할 수 있다는 점이 매력적이다. 그 때문에 객체 지향 프로그래밍 언어지만, 객체 지향에 대한 흔한 선입견과는 달리 초보자들도 쉽게 다룰 수 있다.

이러한 것이 Ruby 이지만, 나도 처음 써보는 것이어서 잘 모르겠다.

일단 설치해보자.

1. Ruby 설치(macOS)

brew install rbenv 를 입력해주면,

이렇게 설치가 완료된다. 그런 뒤

이렇게 which gem 을 입력하면 gem이 어디를 바라보고 있는지 나오는데, 이렇게 /usr/bin/gem 으로 뜨면 시스템 루비를 바라보고 있는 것이라 하는데, 무슨 말인지 이해하진 못했다.

어쨌든 rbenv 가 정상적으로 깔렸다면, rbenv 를 입력하면 저렇게 뜰 것이다. 이제 rbenv의 별도의 ruby 버전을 깔아야 하는데,

먼저 rbenv install 명령어를 입력하면, 이렇게 나온다.
3번째 줄에 있는 rbenv install --list 를 입력하면

이렇게 내가 설치할 수 있는 ruby의 버전들이 뜬다.

강의에서 3.2.2 버전이 안정적이라 해서, 나는 가장 비슷한 버전인 3.2.3을 설치해주었다.

정확한 건 아니고 내 예상이지만, 내 맥북의 OS 버전이 강의 시점의 맥북 버전보다 높아서거나, 3.2.2가 3.2.3으로 업데이트 돼서 3.2.2가 뜨지 않는 것 같다. 그래서 이 부분은 사람마다 조금씩 다를 수 있을 것 같은데 일단 강의를 별 탈 없이 따라가려면 비슷한 버전으로 설치하는 것이 좋다고 생각하기에, 3.2.2에 가장 근접하는 버전으로 깔아주도록 하자.

이제 rbenv install 버전(필자 기준 rbenv install 3.2.3)을 입력하고 기다리면, ruby가 설치 될 것이다.

여기부터는 다른 화면이 종종 캡쳐돼 있는데, 강의 화면 캡쳐이다. 내 맥북 캡쳐를 깜빡하고
Ruby 설치와 다음에 설치할 CocoaPods까지 캡쳐 없이 설치를 해버렸다. 🥲

정상적으로 깔렸다면 이렇게 뜰 것이다. 나는 3.2.3을 깔았으므로 저기서 버전이 3.2.3으로 나온다.

rbenv의 Ruby 가리키게 하기

이제 내가 설치한 rbenv global (global은 전역 설정을 변경하는 옵션이라고 한다) 을 사용하기 위해, 저기에 나와있는 rbenv global 버전을 그대로 입력해주자.

그런 뒤, which gem을 입력하면, 강의에서도 그렇고 나도 그렇고 아까와 마찬가지로 /usr/bin/gem 이 그대로 떴다.

이것을 바꾸기 위해, rbenv init을 입력하자. 정확히는 모르겠지만 초기화?를 해주는 작업이라고 한다.

그러면 이렇게 명령어를 추가하라는 말이 뜰 것이다. 저기서 zshrc는 이 파일은 환경변수들을 macOS에서 잡아주는 역할을 한다고 한다.

여기서 부턴 살짝 헷갈릴 수도 있어서, 잘 따라가야 한다.

이제 저 드래그돼있는 부분인 eval "$(rbenv init - zsh)"를 복사만 해놓고,

vi ~/.zshrc 를 입력해주자. 참고로 이 vi라는 명령어는 커맨드 라인에서 쉽게 텍스트를 에딧할 수 있는 프로그램이라고 한다. 입력해주면,

이런 화면이 뜰 것이다. 당황하지 말고, 키보드 i 키를 눌러주면,

이렇게 INSERT로 바뀌면서 내용을 수정할 수 있게 된다. 여기에 위에서 복사해두었던 eval "$(rbenv init - zsh)" 를

이렇게 붙여 넣어준 뒤, esc 키를 눌러주면

이렇게 INSERT가 빠지게 된다. 그런 다음

:wq 를 입력해준 뒤 엔터를 누르면

이렇게 작성한 것을 저장하고 빠져나오게 된다.

:q : 저장하지 않고 그냥 나온다.
:wq : 저장하고 나온다.

zshrc 파일을 건드리면 터미널을 한 번 껐다 켜줘야 한다고 한다. 터미널을 재실행 한 뒤, which gem을 입력하게 되면

이렇게 바뀐 경로가 뜨는 것을 볼 수 있다.

이건 내 맥북 캡쳐 화면이다. 아까 봤었던 경로와 다르게 내 개인 경로에 있는 ruby를 탄 gem의 형태를 볼 수 있다.

이로써 강의 내용을 정상적으로 따라왔음을 알 수 있었다.

이제 CocoaPods를 깔아보자!

🥥 CocoaPods

※ 이미지를 클릭하면 CocoaPods 공식 홈페이지로 들어갈 수 있다.

CocoaPods는 Objective -C , Swift 및 외부 라이브러리 관리를 위한 표준 형식을 제공하는 RubyMotion과 같이 Objective-C 런타임에서 실행되는 기타 언어에 대한 애플리케이션 수준 종속성 관리자이다. 이는 Eloy Durán과 Fabio Pelosin이 개발했다. CocoaPods는 Ruby 프로젝트 인 RubyGems 와 Bundler 의 조합에서 큰 영감을 받았다.

CocoaPods는 제3자 코드의 소스 기반 배포와 Xcode 프로젝트로의 자동 통합에 중점을 둔다.

CocoaPods는 명령줄 에서 실행되며 JetBrains 의 AppCode 통합 개발 환경 에도 통합되어 있다. 소스 파일을 수동으로 복사하는 대신 종속성을 지정하여 애플리케이션에 대한 종속성(예: 라이브러리)을 설치한다. 다양한 소스에서 설치하는 것 외에도 많은 오픈 소스 라이브러리에 대한 메타데이터가 포함된 "마스터" 사양 저장소가 Git 저장소 로 유지되고 GitHub에서 호스팅된다. CocoaPods 종속성 해결 시스템은 Bundler, RubyGems 및 Berkshelf와 같은 다른 대규모 프로젝트에서도 사용되는 Molinillo 로 구동된다.

라고 Wikipedia 에서 말한다!

이것도 아직 잘 모르겠다. 일단 설치해보자.

1. CocoaPods 설치(macOS)

터미널에 sudo gem install cocoapods 를 입력하면 되는데,

sudo : 관리자 권한으로 실행시키기
gem : Ruby에서 라이브러리를 관리하는 프로그램

이런 뜻이라고 한다. 이제 입력을 하면, Cocoapods가 설치될 것이다. 시간이 좀 걸릴 수 있다고 하니 기다리자.

다 되면, 정상적으로 깔렸는지 확인하기 위해 pod --version 을 입력하면

이렇게 버전이 뜬다. 잘 설치된 것을 확인할 수 있다.

🦋 Flutter

다시 Flutter로 돌아와, 터미널에 flutter doctor 를 입력해보자.

여전히 이렇게 뜰 것이다.

이는 환경 변수를 설정해주지 않았기 때문인데, 강의에서 환경 변수를 직접적으로 설정해놓지 않는 이유는 FVM을 쓰기 때문이라고 한다.

그래서 임시로 이 디렉토리 안에서만 환경 변수를 설정해주는 작업을 통해 flutter를 사용할 수 있게 해주는데, 이는 Flutter 공식 홈페이지에 macOS 설치로 들어가면

export PATH=$HOME/development/flutter/bin:$PATH

라는 명령어를 복사하여 터미널에 입력해주면, 임시적으로 flutter 명령어를 사용할 수 있다.

Flutter SDK를 설치한 경로가 저 명령어의 경로와 다르다면, 맞게 수정해주면 된다.

이 명령어를 입력해준 뒤, flutter doctor 를 입력해주면

이렇게 나올 것이다.

Xcode, CocoaPods, 그리고 Android Studio가 설치되지 않았다고 뜨던 문구들이 모두 체크 표시로 바뀌었다.

Android toolchain 부분에 아직 문제가 있는데, 사진에 드래그 돼있는

flutter doctor --android-licenses

이 부분을 먼저 복사하여 입력해주면

이렇게 cmdline-tools를 먼저 설치해야 한다고 나온다.

Android Studio를 깔았다면 좀 더 쉽게 설치할 수 있다고 한다.

Android Studio를 키고

오른쪽 상단의 톱니바퀴를 누르고 Settings로 들어간 뒤 검색 창에 Android SDK라고 검색하면

이렇게 메뉴가 나온다. 저기서 가운데 탭인 SDK Tools를 누르면

이렇게 Android SDK Command-line Tools가 있는 것을 볼 수 있다. 체크하면

이렇게 왼쪽에 다운로드가 활성화되는 것을 확인한 뒤 오른쪽 하단에 OK를 누르면

이러한 메시지가 뜨는데 그냥 OK 눌러주면 된다.

커맨드 라인 툴이 설치가 되었다.

이제 다시 flutter doctor 를 터미널에 입력해주면

Android toolchain 항목에 라이센스가 동의되지 않았다는 것만 나온다.

저기에 나와있는 flutter doctor --android-licenses 를 복사하여 터미널에 입력해주면

이렇게 라이센스에 동의하냐는 질문이 연속적으로 나올텐데, 모두 y를 입력하고 엔터쳐주면 된다.

라이센스까지 모두 동의를 완료했다.

👨‍🔧 모든 이슈 해결

마지막으로 flutter doctor 를 다시 입력해주면

이렇게 모든 이슈가 해결된 것을 볼 수 있다!

참고한 곳

• 강의 내용
• [Flutter] fvm (Flutter Version Management)
• 나무위키
• Wikipedia

다음 포스팅 예정

• FVM, Android Virtual Device 설치
• Dart의 함수