1. 다운로드

Flutter로 앱 개발을 하기 위해서 필요한 위 제목의 3가지 프로그램을 설치해 볼 것이다.

 

1. Flutter 설치 홈페이지로 이동한다.

: Flutter | Install 로 이동한다.

2) 여기서 자신의 운영체제를 선택한다. 

그러면 다운로드 페이지가 나오는데, 이 한 페이지 안에서 필요한 3개의 프로그램을 모두 다운로드 받을 수 있다.

여기서는 Git -> Flutter -> Android Studio 순서대로 다운로드 받아 보겠다.

(지금까지는 Flutter와 Android Studio만 사용했고, 아직 Git을 어디에 사용하는지는 모른다. )

 

1. Git 다운로드

다음 화면에서 Git For Windows 를 클릭하면 클릭한 시점 당시의 최신 버전으로 Git을 다운로드 받을 수 있다. 

 

2. Flutter SDK 다운로드

: SDK를 다운로드 하는 것 = 그 언어를 사용하는 데 필요한 실행파일을 다운로드 하는 것.

즉 SDK를 다운로드해서 후에 Android Studio와 연결해 주면, Flutter 언어를 사용할 수 있게 된다. 

가장 최신 버전을 받을 수 있다.

 

3. Android Studio 다운로드

아래의 Android Studio라는 파란 글씨를 클릭한다. 

Flutter가 앱 프로그래밍 언어라면, Android Studio는 그 언어로 코딩을 도와주는 에디터(IDE라고 하는 것 같다)이다. 


2. 내 컴퓨터에서 사용할 수 있도록 추가 작업

: Flutter SDK 파일에 대한 작업

1. 다운로드 한 Flutter SDK의 zip 압축 파일을 풀어서 C드라이브 안에 저장하되, Program Files 폴더 안에는 저장하지 않도록 한다.

b/c Program Files 폴더 안의 파일들은 사용할 때 일정 이상의 보안? 요구조건을 충족해야 하는 경우가 있어서 그렇다.

2. Flutter에 직접 명령어를 주는 flutter_console.bat 이라는 배치 파일이 있다. 이 파일에서는 명령어를 입력하면 그에 따른 명령을 수행하는데, 기존 컴퓨터의 cmd(command prompt)와 기능이 비슷하다. 

그러면 Flutter에 명령을 줘야 할 때마다 이 flitter_console.bat 파일을 실행하기 번거롭다.

그래서 이 flutter_console.bat 에 입력할 내용을 cmd(사용자 pc의 일반 프롬프트)에 바로 입력해도 같은 결과로 명령을 수행하도록 해 줄 것이다.

 

+ 방법

1. 검색창에 제어판 입력 -> 열기

2. (사진에서는 세 번째 줄) 시스템 클릭

3. 창 우측의 고급 시스템 설정 클릭

4. 고급 탭의 환경 변수(N) 클릭

5. 위에서 Path 라는 변수를 클릭하고, 편집(E) 을 눌러서 경로를 추가한다. 

* "추가" 이다. 말 그대로 기존에 존재하던 경로를 삭제하면 안 되고, 그 뒤에다가 이어서 쓰라는 의미이다. 

* 이때 경로는 Flutter SDK가 현재 들어가 있는 경로로, C드라이브를 시작점으로 표현한다.

* 정확히는 압축을 푼 Flutter 폴더의 bin 파일을 기준으로 경로를 입력한다. 

나의 경우는 : ex.  C:\src\flutter\bin  <- 이렇게!

<-> 만약 Path라는 이름의 변수가 없다면, 새로 만들기(N)를 눌러서 만든 다음 경로로 위와 같이 추가해 주면 된다.


3. Android Studio와 같이 사용해서, 결과가 나오는지 확인해 보기!

1. Android Studio를 실행한다.

기본 상태에서는 실행 가능한 파일이 2개 있다: main.dart와 test.dart

이 중 test.dart만 실행해도 정상적으로 Flutter SDK를 통해 Android Studio가 실행되는지 확인할 수 있다.

이렇게 샘플 앱에 대한 코드가 나와 있다.

-> 이 앱이 그대로 실행된다면, 맞게 실행되는 것이다!

 

그런데 어떻게 실행할 것인가?

웹이 아니라 앱을 실행하는 것이므로, 테스트할 시험형 앱이 필요하다. 

 

2. 앱을 테스트하기 위한 장치가 필요하다. 

1. AVD Manager 아이콘을 클릭한다.

2. 가상 기기를 등록하는 화면이 나온다.

등록 가능한 가상 기기에는 여러 버전이 있다. 나는 그 중 Nexus 6 버전을 다운로드 받았다(강의에서 추천함)

등록되고 나면 이런 화면이 나오고, 여기서 재생 버튼을 누르면 이후 실행하는 Flutter 코드를 이 기기에서 테스트할 수 있게 된다. 

+ 나의 경우는 일반적이지는 않지만, 이런 메시지가 나온다:

알아보니 adb라는 배치 파일이 구형 버전이라서, 앱을 테스트할 수는 있지만 실행 속도가 느려서 경고가 발생한 것이었다. 조만간 adb 배치파일 업그레이드 하는 방법도 알아봐야겠다.

3. 테스트하는 경우이므로 2번의 가상기기가 등록된 상태에서, test.dart 메소드의 실행 버튼을 누른다.

이런 화면이 나오면 성공이다.

(gradle을 실행시키고 메소드를 실행하는 데 시간이 걸려서 어느 정도는 기다려야 한다.)

+ 위 앱은 아래의 + 버튼을 누르면 숫자가 0, 1, 2, .. 이렇게 1씩 증가하는 앱이다.

'server-side > Flutter' 카테고리의 다른 글

0. 시작  (0) 2021.09.03

공모전에 참여하면서 기존에 웹 개발을 목적으로 사용하던 java 언어가 아닌, 앱 개발을 통해 공모전을 준비하게 되었다.

=> 그래서 그나마 가장 많이 알고 있던 java 언어를 사용할 수 없었고, 앱을 만들기 위한 Flutter 라는 언어를 급하게(!) 준비하게 되었다.

Udemy 플랫폼의 flutter & dart 강좌를 부분부분 듣고 간략하게 정리해서, 앱의 백엔드 부분을 개발할 수 있도록 숙지하는 것이 목표이다.

다행인 점: java와 문법이 꽤 비슷한 듯.

'server-side > Flutter' 카테고리의 다른 글

#9 ~ #13. Flutter, Android Studio, Git 설치하기  (0) 2021.09.04

+ Recent posts