구글에서 만든 크로스 플랫폼 프레임워크인 Flutter를 공부하기 위해서 공식 사이트에서 설명하는대로 flutter 설치해보았다. 공식 사이트에서 설명한 그대로로 설치할 것이므로, 영어가 생소하다면 번역해두었으니 따라오면 좋을 것 같다.
그리고 Flutter 같은 개발자가 많이 투여된 프레임워크는 잦은 업데이트를 한다. 따라서 최신의 방법대로 설치하는 것이 베스트이기 때문에 공식에서 설명하는 방식대로 설치하는 것을 추천한다.
이제 설치해보자!
설치 사이트 :
Flutter - Build apps for any screen
Flutter - Build apps for any screen
Flutter transforms the entire app development process. Build, test, and deploy beautiful mobile, web, desktop, and embedded apps from a single codebase.
flutter.dev
위의 링크를 클릭해도 되고, Google에 "flutter" 이라고 치면 공식 사이트가 맨 위에 나온다.
이제 Step by Step 설명하도록 하겠다.
우측 상단의 "Get stated" 버튼을 누른다.
그러면 첫번째 app 기종을 선택하라고 하는데
어쩌피 크로스 플랫폼 프래임워크여서 다양한 운영체제로 개발할 수 있에 아직 정해진 게 없으면 "Recommended" 인 "Android" 를 선택한다.
난 iOS 앱 개발하고 싶은데? ㅠㅠ 해도 Android 누르기 (참고로 iOS는 윈도우에서 안됩니다.)
그러면 "install SDK" 나오기 전까지 개발하기 전에 필요한 기본 사양과 필요한 프로그램에 대해서 설명한다.
하드웨어 사양에 대해서 말하고 있다.
요즘 컴퓨터라면 이 정도는 사양 충족할 거고...
+) 사양을 모르겠다면, [폴더] 열기 -> [내 PC] 폴더 위에 마우스 두고 우클릭 -> [속성] 클릭, 하면 확인할 수 있다.
Tip을 보면, 프로그래밍 언어인 Dart 를 따로 깔 필요가 없다고 한다. Flutter SDK 깔면 안에 이미 들어 있어서 같이 깔린다.
그리고 Window PowerShell을 사용해야되어서 64bit 운영체제이며 Window 10 이상을 준비해야된다. (99% 확률로 이미 powershell 있을 거임)
필요한 소프트웨어는 다음과 같다.
1. 버전 관리하는 Git 을 버전 2.27 이상으로 설치
2. Android Studio 도 2023.3.1 이후 버전으로 설치
3. 추천으로 개발환경(IDE)은 Visual Studio Code로 설치하라고 한다.
VSCode로 개발도 할거고 뒤에 바로 설치할 Flutter SDK를 설치하기 편하다. (요즘 flutter 개발자들은 거의 VSCode 사용하는 거 같다... Andriod Studio도 조금 보이고.)
드디어 SDK install 부분!
Flutter SDK를 설치하기 위해서는,
1) Visual Studio Code에 있는 Extension을 사용하거나
2) Flutter Bundle (.zip 파일 말하는 거임) 을 설치하라고 한다.
아무래도 Visual Studio Code가 더 익숙하고 편리하기에 Visual Studio Code 방식으로 설치하기로 택했다. 그리고 위에 나온 Tip!을 읽어보면, flutter 쪽에서도 VSCode로 까는 것을 추천했다.
+) 참고로 SDK는 Software Development Kit 의 약자로, 개발하기 위해 필요한 도구들이 있는 소프트웨어다... 이게 있어야지 개발할 수 있다. 예를 들어서 디버깅 프로그램, 개발 도구 프로그램, 문서 등 여러가지 도구가 있다.
우리는 지금 Flutter 라는 "프레임워크로", "개발" 을 시작하려고 하고 있으니까
Flutter SDK를 깔아줘야되는 것이다.
VSCode 켜고 Extension 들어가서
이거 깔아주고...
Ctrl + Shift + p 로 "Flutter : New Project" 을 누르면
이렇게 SDK를 찾을 수 없다고 하단에 메세지가 뜬다.
당연하지... 아직 Flutter SDK를 안 깔았으니까...
그러면 여기서 "Download SDK" 를 클릭한다. 만약 현재 열어놓은 폴더가 있다면 현재 폴더가 열리게 될 거다.
폴더가 열린 건 SDK를 설치할 경로를 선택하라는 건데,
Flutter SDK를 설치할 경로를 선정해주면 된다.
경로를 어디로 설정해야될지 모르겠다?
경로 설정 팁으로 공식사이트를 확인해보면,
추천으로 사용자 경로 또는 C drive 바로 아래에 넣으라고 했다.
그리고 정말 중요한게 디렉토리 경로 상에 이름에 special characters, 즉 한글이 있으면 안되고, 또 공백문자 space가 있으면 안된다는 경고를 했다.
+) 프로그램에서는 폴더 경로 상에 한글 있으면 동작이 안되는 경우가 많다... Anaconda랑 PyCharm도 그렇고. 그래서 꼭 영문으로 사용자와 폴더를 만들자. Space bar는 여기서 처음본다만, 만약 flutter 사용하다가 자잘한 에러가 나온다면 이 문제일 수도 있다.
필자는 어떻게 경로를 선택했냐면,
일단 Flutter SDK를 설치한다는건 이 툴들을 개발하면서 계속 사용한다는 뜻이다.
그러므로 나중에 bin 폴더를 환경변수 path 설정을 넣을 거니까 경로가 변경되면 안된다. 변경되면 VSCode가 SDK 못 찾아... 따라서 자주 들어가지 않은 폴더로 우선적으로 생각했다.
다운로드나 문서 폴더에 SDK 깔았다간 새로운 파일이 생기고 삭제되고 이동이 잦다보니 혹시나 건들일 수도 있었을 거 같아서 제외했다. 자주 안 들어가는 폴더이고 프로그램들이 설치되어있는 폴더면 좋을 것 같다.
그리고 필자의 Username에 공백문자가 있기 때문에 그냥 C drive 바로 아래로 경로 지정을 했다.
경로를 선택했으면 "Clone Flutter" 를 클릭한다.
잘 설치가 되고 있다!
조금 오래 걸린다.
+) 참고로 필자가 공부하는 책에서 flutter SDK를 .zip 파일을 압축 해제 후 설치하라고 했다.
그러니 flutter doctor 를 실행하니까 cmd가 임의로 꺼지는 에러가 발생했었다.
프로그램은 버전이 빠르게 업데이트 되다보니 책의 버전과 안 맞는 경우가 비일비재하다.
다시 한번 공식에서 소개한 방식으로 설치하는 것을 추천한다.
Flutter SDK가 설치가 다 되면 미리 말했던 bin을 PATH에 추가하겠냐고 물어보는 건데 "Add SDK to PATH" 를 클릭한다.
원래 직접 환경변수 편집해서 넣어야되는데 VSCode가 해주나보다.
그리고 다른 팝업이 뜨면 OK 누르면 된다.
깔꼬름하게 창 재시작해서
[VSCode] 창 재시작 / re-start 하기 (tistory.com)
[VSCode] 창 재시작 / re-start 하기
VSCode 를 사용하다보면 탭이 꼬여서 안 뜨는 경우가 있다. 새로고침이 필요할 때 프로그램을 엑스 버튼으로 끄고 다시 켜는 데에 번거로움이 있기 때문에 간단한 command palette로 재시작을 해보자.
futuregunmulju.tistory.com
Ctrl + Shift + p 누른 후 flutter > new project 누르면
Flutter 시작 첫 걸음인 새 프로젝트 만들기가 잘 실행된다!
잘 설치된 것을 확인할 수 있다! 😉
질문 있으시다면 언제든 댓글 달아주세요!
'Flutter' 카테고리의 다른 글
| [Flutter] Static 키워드 - 클래스의 변수는 멤버 변수랑 뭐가 다른데? (4) | 2024.11.03 |
|---|---|
| [Flutter] android toolchain - develop for Android devices error (2) | 2024.09.02 |