본문 바로가기
기타 학습

[Flutter] Flutter와 Dart 개념 (Flutter 입문 / Flutter 개발 환경 셋팅 윈도우)

by 비전공자 기록광 2022. 8. 30.
반응형

 

Flutter 스터디 Flus에 참여하게 됐다.
전부터 앱개발은 꼭 해보고 싶었는데 좋은 기회가 될 것 같아 기대가 된다.

좋은 정보를 공유해준 @y씨에게 무한한 감사와 사랑을...🍀

 

 

🧩 Flutter 스터디 Flus 정보

https://flus.dev/study-0

 

FLUS :: Flutter Learn with US!

모임 그 이상의 플러터 커뮤니티, 플러스!

flus.dev

 


🎇 1주차 스터디 목표

  • Dart - Flutter의 기본 개념
  • Flutter개발환경 셋팅
  • Dart의 기본 문법

Flutter

 

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

 

플러터는 구글에서 나온 오픈 소스 프레임워크이다.
그리고 크로스 플랫폼으로 개발할 수 있다는 아주 큰 특징을 가진다.
쉽게 말해 하나의 코드로 웹 앱 둘다 개발할 수 있다는 것이다.

 

Flutter 개발환경 셋팅 for windows

1. Flutter install

https://docs.flutter.dev/get-started/install

 

Install

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

docs.flutter.dev

 ⚠ Warning: Do not install Flutter in a directory like C:\Program Files\ that requires elevated privileges.

 

나는 C드라이브 밑에 app이라는 파일을 만들어 거기에 압축을 풀어줬다.

 

 

2. 환경변수 설정

C:\app\flutter\bin 주소를 환경변수에 넣어준다.

 

제어판 > 시스템 환경 변수 편집 

사용자 변수의 path 편집

 

 

 

3. 설치 확인 cmd창에 flutter 입력

이런식으로 나온다면 flutter가 정상 설치 된 것이다.

 

 

4. vscode 개발 환경 셋팅

flutter 개발을 vscode로 진행하려면 flutter와 dart를 다운받아주기만 하면 된다.

flutter만 받아도 dart는 자동으로 설치된다.

 

5. flutter 프로젝트 생성

ctrl + shift + p 로 명령 팔레트 열어 new project 생성 > Application > 원하는 위치에 만들어주면 된다.

 

 

이렇게 생성이 완료되어 코드를 작성하면 된다.

 

 


Dart

 

Dart overview

A short introduction to Dart

dart.dev

 

Dart는 구글에서 나온 프로그래밍 언어다.
구글에서 만든 언어로 Go는 알고 있었지만 Dart는 몰랐다.

둘의 간단한 차이는 이렇다.

 

Go Dart
절차지향 언어 객제치향 언어
대량 서버, 분산 시스템에서 주로 사용 앱개발에서 주로 사용

 

 

Dart 자체만 두고 보면 그리 경쟁력 있는 언어는 아니라지만
Flutter를 위해서는 Dart를 배워야한다.

 

Dart는 dartpad를 통해 쉽게 코드를 작성해볼 수 있다.

https://dartpad.dev/? 

 

DartPad

 

dartpad.dev

 

Hello World! 출력

모든 프로그래밍의 첫단계 Hello World!를 출력해봤다.

그냥 간단하게 main함수에 print를 담아주면 된다. 아주 쉽다.

 


참고

https://youtu.be/-O53_9Mh-Co

https://couldi.tistory.com/9#comment13137556

 

[Dart] 1. 소개 그리고 공부준비

21. 10. 3. - Could - 이 글은 프로그래밍 입문을 Flutter 때문에 Dart로 시작하는 사람들을 위한 글입니다. 프로그래밍 언어가 가지고 있는 기본 컨셉 자체를 Dart라는 언어를 통해 설명하고, 많은 분들이

couldi.tistory.com

 

반응형

댓글