[Flutter 001] 프로젝트 시작하기!!! 새 프로젝트 생성 방법 + 앱 실행 미리보기

본격적으로 flutter를 시작해보자~!~!~!

 

 

프로젝트 생성

file -> new -> new Flutter Project

 

 

왼쪽 메뉴 중 Flutter 선택하고 Flutter sdk 설치한 경로 지정하기

 

 

프로젝트 이름은 영어 소문자만!

빌드할 플랫폼도 선택하기

 

새 프로젝트 생성

 

 

잠깐!!

처음 배우는 입장이라면 analysis_option.yaml 파일의 rules에 이 4줄을 추가해주기

    prefer_typing_uninitialized_variables : false
    prefer_const_constructors_in_immutables : false
    prefer_const_constructors : false
    avoid_print : false

-> Lint를 끄는 용도 (개발을 편하게 해주는 것들,,,!)

 

 

 

 

우리가 코드를 작성할 곳은 lib > main.dart

void main() {} 밑으로 

구글이 작성해놓은 간단한 프로젝트 인데

완전 처음부터 시작하기 위해서 다 지우기!

 

 

지운 다음 마지막 줄에

stless 치고 Tab키를 누르면 메인페이지를 작성할 코드가 자동으로 세팅된다. 

 

자동 생성되는 코드에서 위에서부터 4줄은 메인페이지를 위해 기본으로 있어야할 코드 

return 부터 코딩 시작!!!

 

 

 

 

메인 코드 작성

 

import 'package:flutter/material.dart';

//앱 시작~
void main() {
  runApp(const MyApp());  //메인페이지 실행
}

//stless치고 Tab키 -> 메인페이지 세팅
class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {

    //여기서부터 코딩 시작!
    return MaterialApp(
      home: Text('안녕')
    );
  }
}

 

 

 

 

 

앱 실행 미리보기 

 

 

Chrome(web) 선택 후 실행버튼▶ 누르기

web같지만 앱 맞아요!

 

 

 

 

 

 

 

앱 디자인 -->>> (다음게시글)