# flutter-bootcamp-with-dar

## 섹션 10: Quizzler -Modularising & Organising Flutter Code

You can find the completed project under the course resources: https://github.com/londonappbrewery/Flutter-Course-Resources/

If you've got some niggling bugs or there is something wrong with your code that you can't figure out, compare your code against the finished version of the app.

To open the project inside Android Studio, simply clone the project from Github using VCS → Checkout from Version Control → Git. If you need a refresher on cloning repos, have a look at the first lesson from the MiCard module: https://www.udemy.com/course/flutter-bootcamp-with-dart/learn/lecture/14482104


## 섹션 9: Xylophone - Using Flutter and Dart Packages to Speed Up…

Download the Completed Project
You can find the completed project under the course resources: https://github.com/londonappbrewery/Flutter-Course-Resources/



If you've got some niggling bugs or there is something wrong with your code that you can't figure out, compare your code against the finished version of the app.





To open the project inside Android Studio, simply clone the project from Github using VCS → Checkout from Version Control → Git. If you need a refresher on cloning repos, have a look at the first lesson from the MiCard module: https://www.udemy.com/course/flutter-bootcamp-with-dart/learn/lecture/14482104



## 섹션 8: Boss Level Challenge 1 - Magic 8 Ball

Step 1 - Set Up The Project
Go to https://github.com/londonappbrewery/magic-8-ball-flutter and clone the starting project to your local computer. Open it using Android Studio and take a look around the project.



There is an images folder with all the ball images you will need.

There are a total of 5 images.
t
## 섹션 7: Dicee - Building Apps with State

- https://dartpad.dartlang.org

### Download the Completed Project

You can find the completed project under the course resources: https://github.com/londonappbrewery/Flutter-Course-Resources/

If you've got some niggling bugs or there is something wrong with your code that you can't figure out, compare your code against the finished version of the app.

To open the project inside Android Studio, simply clone the project from Github using VCS → Checkout from Version Control → Git. If you need a refresher on cloning repos, have a look at the first lesson from the MiCard module: https://www.udemy.com/course/flutter-bootcamp-with-dart/learn/lecture/14482104


## 섹션 6: MiCard - How to Build Beautiful UIs with Flutter Widgets

- [Flutter Layouts Challenge](https://drive.google.com/uc?export=download&id=1k7oW5qVLJqzw_lEFsOFS_qKmkGjBX1pL)
- https://github.com/londonappbrewery/Flutter-Course-Resources/


## 섹션 5: I Am Poor - App Challenge

- https://icons8.com/
- https://www.canva.com/

## 섹션 4: Running Your App on a Physical Device

## 섹션 3: I Am Rich - How to Create Flutter Apps From Scratch

### 프로젝트 생성 방법 2가지

쉘에서 flutter 프로젝트 생성

```shell
flutter create [project_name]
```


android studio에서 `File → New → New Flutter Project` 로 프로젝트 생성

### 앱 아이콘 설정 방법 2가지

1. https://appicon.co 에서 이미지 파일 생성
2. https://pub.dev/packages/flutter_launcher_icons 패키지 사용

### I am Rich 프로젝트

<blockquote>github: https://github.com/jacegem/hello_world_flutter/tree/master/i_am_rich</blockquote>


debug 배너 숨기기

```dart
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: MyHomePage(),
    );
  }
}
```

같은 코드지만 플랫폼에 따라 서로 디자인이 다른 것을 확인할 수 있습니다.

^  iOS  ^  Android  ^
| {{  http://snappyimages.nextwavesrl.netdna-cdn.com/img/844cba0cc278362cac3d68c1bce27cd2.png?200 
 }} | {{  http://snappyimages.nextwavesrl.netdna-cdn.com/img/ad47a8e26497df1a909307827319f1cb.png?200  }} |

### 이미지 넣기

{{  http://snappyimages.nextwavesrl.netdna-cdn.com/img/8bece07091acc812b183ddfee5051547.png}}

이미지 출처 : http://pluspng.com/diamond-hd-png-6999.html

assets 폴더에 이미지 파일 넣기




### pubspec.yaml 파일 설정


```dart
flutter:
  ....  
  assets:
    - assets/images/
```

### MyHomePage 파일 수정

{{  http://snappyimages.nextwavesrl.netdna-cdn.com/img/9d68d384e6c119ee4df630573caf371e.png?200}}

```dart
import 'package:flutter/material.dart';

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('I am Rich')),
      body: Center(
        child: Image(
          image: AssetImage('assets/images/diamond.png'),
        ),
      ),
    );
  }
}
```


### 앱 아이콘 만들기

{{  http://snappyimages.nextwavesrl.netdna-cdn.com/img/4102348516329f174aafc82d4cfe5801.png?200}}

https://pub.dev/packages/flutter_launcher_icons 패키지 사용

pubspec.yaml 파일 수정

```dart
dependencies:
  ...
  flutter_launcher_icons: ^0.7.4
  
flutter_icons:
  image_path: "assets/images/diamond.png"
  android: true
  ios: true
```

패키지 실행

```shell
flutter pub get
flutter pub run flutter_launcher_icons:main
```

## 문서

- [[Introduction to Cross-Platform Development with Flutter and Dart]]
- [[Syllabus The Complete flutter development bootcamp]]