본문 바로가기

Flutter

[#. flutter] Flutter로 Todo 앱 만들기, 설치 및 시작하기 1

반응형

 

 

 

 

 

 

Flutter로 앱을 만들어 보려고 한다

설치 및 초기 설정을 시작해 보자

(MacOS 기준)

 

 

 

 

 

① 설치

 

flutter.dev/docs/get-started/install

 

Install

Install Flutter and get started. Downloads available for Windows, macOS, Linux, and Chrome OS operating systems.

flutter.dev

 

 

 

 

 

 

 

 

② PATH 설정

 

sudo vi .bash_profile
export PATH="$PATH:~/[압축 푼 폴더명]/flutter/bin"

 

 

 

 

 

③  flutter doctor

 

doctor를 통해 필요한 dependency가 어떤 것인지 진단해 주고 설치해야 할지 여부를 확인할 수 있다

 

flutter doctor

 

 

 

 

 

 

 

④ Xcode 설치 및 실행

 

Xcode가 설치되어 있지 않다면 App Store에서 설치하자

설치 후 아래 명령어를 입력하면 시뮬레이터가 잘 뜬다

 

open -a Simulator

 

 

 

 

 

⑤ flutter 시작하기 

 

폴더를 하나 생성하고 생성한 폴더 위치에서 flutter를 시작해 보자

flutter 프로젝트명이 두 단어 이상이면 언더바를 사용해야 한다 

 

flutter create flutter_todo

 

 

 

 

 

 

⑥ flutter 실행

 

cd flutter_todo
flutter run

 

 

명령어를 입력한 후 iphone, iphon 11, Chrome 중에 어떤 거로 띄울지 선택하면 된다

iphone으로 띄울 거면 번에 써놨듯이 Xcode 시뮬레이터를 실행해 두자

 

 

 

 

 

 

 

 

이렇게 시뮬레이터에서 flutter가 잘 실행된 것을 볼 수 있다

우측 하단에 버튼을 누르면 숫자가 증가하는 counter 개념의 app이 실행된 상태다 

 

 

 

 

 

 

 

 

 

※ 추가적으로 설치할 것

 

⑴ Visual Studio Code 설치

 

code.visualstudio.com/

 

Visual Studio Code - Code Editing. Redefined

Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications.  Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows.

code.visualstudio.com

 

 

Extension에서 flutter도 설치하자

 

 

 

 

 

 

⑵ Android Studio 설치

 

developer.android.com/studio?gclid=Cj0KCQjws-OEBhCkARIsAPhOkIYjqHEiHs05uxE2FYPHa1fB1967orWghZB_h8vZMUphUP9ukhf--T4aAu48EALw_wcB&gclsrc=aw.ds

 

Download Android Studio and SDK tools  |  Android 스튜디오

developer.android.com

 

 

 

 

 

 

반응형