Developer port by Developer port

일반적으로 IDE라고 하면

integrated development environment

즉 통합 개발 환경 이라고 한다.

안드로이드 스튜디오를 쓸 수도 있겠지만 나는 VSCODE를 주로 사용하기에

이번 기회에 VSCODE에 Flutter를 사용하기 위한 설정을 공유하려고 한다.

실제로 내가 사용하고 있는 VSCODE의 화면이다.

* VSCODE는 설치가 간단하니 안내하지 않는다 *

S T E P

1. extension Install

2. Settings

VSCODE를 설치하면 좌측에 메뉴들이 있는데 Extensions을 찾는다.

이곳에서 내가 원하는 Extensions을 찾을 수 있다.

설치할 익스텐션은 아래랑 같다.

Dart

Flutter

플러터를 정상적으로 작동시키고 확장 기능을 사용하기 위해선 Dart 설치가 필수적이다.

당연한 얘기지만 사용하는 언어가 플러터니까 설치한다.

S T E P

1. extension Install

2. Settings

전부 설정이 끝나면 하단에 다음과 같이 생긴 부분을 볼 수 있다.

이때 빨갛게 표시된 부분을 클릭하면 아래와 같은 설정 화면을 볼 수 있다.

여기서 앞서 설정했던 애뮬레이터를 확인할 수 있다.

우리는 mobile emulator를 사용한다. cold boot는 사용하지 않는다.

실행시키면 다음과 같은 애뮬레이터를 확인할 수 있다.

실제 휴대폰과 같으며 코드를 짜고 실행하는 기본 베이스가 된다.

윈도우 / 크롬 / mac 도 되니까 테스트해보길 바란다.

추가적으로 설정할 내용이 있다.

플러터를 사용하다보면 const 키워드를 사용할 일이 정말 많다.

일일이 사용하거나 경고 밑줄을 맞이하는것이 썩 달갑지는 않다.

그러니까 자동으로 설정하도록 만든다.

상단의 작업표시줄에서 view - command Palette 을 켜고

settings 를 입력하면 기본 설정파일을 열 수 있다.

사진처럼 설정해주도록 한다.

이렇게 하면 자동으로 const가 작성되고

알아서 줄바꿈이 된다.

항상 () {} [] 때문에 골치아팠다면

이번기회에 신세계를 맞이해보자

쉼표(,) 하나로 자동으로 정렬해준다.

코드는 아래 첨부한다.

dartSettings.txt

0.00MB

'Flutter > Install' 카테고리의 다른 글

플러터 설치 없이 온라인으로 찍먹해보기 (0)	2023.08.22
따라하면 쉬운 플러터 설치하기 (0)	2023.08.22

온라인Dart 바로가기

DartPad

dartpad.dev

사용법은 직관적이다.

설치부터 막막하다면 참고하자

'Flutter > Install' 카테고리의 다른 글

해두면 후회 안하는 플러터 VSCODE 설정 (0)	2023.08.23
따라하면 쉬운 플러터 설치하기 (0)	2023.08.22

· 플러터 기본 설치 가이드라인

플러터로 개발을 시작하기 전 설치부터 안내하고자 한다.

기초 개발 환경

OS : Windows 10 Pro
Date : 2023.08.22
Flutter Version : 3.10.0
필자는 이미 설치한 후 라서 모든 과정에 스크린샷을 포함하지는 않는다.
하단에 명령어 모음 파일을 제공한다.

Manual

STEP 1. Chocolatey Install

STEP 2. Flutter Install

STEP 3. Android Studio

SETP 4. Setup Flutter

Chocolatey Site Visite

Installing Chocolatey

Chocolatey is software management automation for Windows that wraps installers, executables, zips, and scripts into compiled packages. Chocolatey integrates w/SCCM, Puppet, Chef, etc. Chocolatey is trusted by businesses to manage software deployments.

chocolatey.org

사이트를 방문한다.

Chocolatey를 사용하는 이유

Windows에 설치를 도와주는 패키지인데 별거 없다. 편하게 설치하고 싶어서 사용한다.

* 사용하기 싫다면 SDK를 직접 설치하면 된다 *

사이트에 접속하면

Choose How to Install Chocolatey

메뉴에서 Individual 을 선택한다.

PowerShell 을 관리자 권한으로 실행시킨다.

Get-ExecutionPolicy

해당 명령어를 입력하고 Restricted 메세지가 반환되는지 확인한다.

메세지가 반환 되었다면 다음 명령어를 입력한다.

Set-ExecutionPolicy AllSigned

Set-ExecutionPolicy Bypass -Scope Process

둘 중 어떤 명령어도 상관 없으니 작동하는 명령어로 입력한다.

그 다음 에러 메세지가 출력되지 않는다면 다음 명령어를 입력한다.

Set-ExecutionPolicy Bypass -Scope Process -Force; [System.Net.ServicePointManager]::SecurityProtocol = [System.Net.ServicePointManager]::SecurityProtocol -bor 3072; iex ((New-Object System.Net.WebClient).DownloadString('https://community.chocolatey.org/install.ps1'))

선택창이 출력된다면 y 를 입력해 Chocolatey 를 설치한다.

설치가 완료되었다면 choco 명령어를 입력해 출력되는지 확인한다.

* 필자의 버전과 다르게 출력될 수 있다 *

Manual

STEP 1. Chocolatey Install

STEP 2. Flutter Install

STEP 3. Android Studio

SETP 4. Setup Flutter

파워쉘을 닫지 말고

그대로 아래 명령어를 입력한다

choco install flutter

Chocolatey를 이용해 Flutter를 설치한다.

선택창이 출력되면 y 를 입력하고

설치가 끝났을때 에러가 따로 없다면

플러터 설치는 끝났다.

Manual

STEP 1. Chocolatey Install

STEP 2. Flutter Install

STEP 3. Android Studio

SETP 4. Setup Flutter

플러터 - 안드로이드 스튜디오

Windows install

How to install on Windows.

docs.flutter.dev

해당 사이트를 방문해 안드로이드 스튜디오를 설치한다.

* 안드로이드 스튜디오 설치가 끝났다면 이 과정은 생략해도 좋다 *

나는 내가 설치한 방법으로 안내한다.

어떻게 하던 정상적으로 설치하고 연결만 하면 된다.

안드로이드 스튜디오

Download Android Studio & App Tools - Android Developers

Android Studio provides app builders with an integrated development environment (IDE) optimized for Android apps. Download Android Studio today.

developer.android.com

설치 방법은 따로 안내하지 않는다.

인터넷을 적극 활용하도록 하자

추가 안내
자바 버전 8 이상 환경설정이 필요하다

안드로이드 스튜디오를 실행 후

Create Device를 선택한다.

원하는 모바일 기기를 선택한다

이때 Play Store 에 표시가 되어있는 것은 플레이스토어를 지원한다.

플레이스토어가 있는 기기 1개 , 플레이스토어가 없는 기기 1개

최소 2개의 기기를 사용할 것을 권장한다.

이때 ABI 는 x86 으로 설정한다.

Manual

STEP 1. Chocolatey Install

STEP 2. Flutter Install

STEP 3. Android Studio

SETP 4. Setup Flutter

파워쉘을 열고 아래 명령어를 입력한다

flutter doctor --android-licenses

특별한 에러가 없다면 좋겠지만

에러는 필연적이다.

몇가지 에러를 공유한다.

Android sdkmanager not found.
Update to the latest Android SDK and ensure that the cmdline-tools are installed to resolve this.

해당 오류가 출력된다면

안드로이드 스튜디오 - SDK Manager 를 실행한다.

System Settings에서 Android SDK를 선택하고 SDK Tools를 선택한다.

하단에 Hide Obsolete Package 의 체크를 해제한다.

command-line 의 오류가 발생했다면
Android SDK Command-line Tools(Lastest) 의 Status를 확인해야한다.
Not Installed 상태인지 확인하고 Not Installed라면 설치하도록 한다.

Android SDK Tools (Obsolete)가 Installed 상태가 되었다면 종료 후
파워쉘에서

flutter doctor --android-licenses

명령어를 입력해 설치가 실행되면 완료된다.

이때 동의에 대해 묻는다면 y 를 입력한다.

All SDK package licenses accepted

메세지가 출력된다면 동의가 완료되었다.

추가로 다른 에러도 공유한다.

Unable to confirm if installed Windows version is 10 or greater

해당 에러가 발생한다면

flutter channel master

flutter upgrade

두가지 명령어를 사용해 해결이 가능하다.

모든 설정이 끝났다면

flutter doctor

해당 명령어를 입력해 에러가 없는지 확인한다.

Unable to find bundled Java version 메세지가 출력된다면

안드로이드 스튜디오 [ C:\Program Files\Android\Android Studio ] 가 설치된 위치로 이동해

jbr 파일을 jre 파일에 붙여넣기 한다.

다시 flutter doctor 를 입력해

No issues found! 가 출력된다면 설정이 끝났다.

Install Flutter Command.txt

0.00MB

'Flutter > Install' 카테고리의 다른 글

해두면 후회 안하는 플러터 VSCODE 설정 (0)	2023.08.23
플러터 설치 없이 온라인으로 찍먹해보기 (0)	2023.08.22

'Flutter > Install' 카테고리의 다른 글

'Flutter > Install' 카테고리의 다른 글

'Flutter > Install' 카테고리의 다른 글

티스토리툴바