目錄
===


【Flutter 程式設計入門實戰 30 天】[線上教學課程目錄](https://tw-hkt.blogspot.com/2019/11/2019-flutter-30-1117.html) 使用 Dart 程式語言，開發 Android 和 iOS APP 應用程式。

Flutter 程式設計入門實戰 30 天
===
學習 Flutter 程式語言最佳指南，Flutter 程式語言基礎入門課程

## 課程說明
Flutter 是由 Google 主導的 Dart 程式語言研發出來的開源跨平台軟體框架 (Framework)，可開發 Android、iOS APP 行動應用程式、Web 網頁服務、Windows、macOS、Linux 和下一世代神秘 Fuchsia 作業系統桌面應用程式。且具有相當高效率 120FPS 的渲染性能，豐富的UI元件，媲美 Native 原生效能體驗。眾多優勢之下使得 Flutter 成為今年最熱門的新技術。看得出來 Google 未來將透過 Flutter 一統江山。只需要用一套程式語言就可以在多平台上任遊運行。

這門課程完全適合初學者，無須任何編寫過程式碼經驗，我們將從零基礎開始介紹，編寫程式語言需具備的基礎知識。完全從零開始，初學者無痛上手，將會了解如何使用 Dart 程式語言，由淺入深，快速掌握開發 Flutter 精髓與技巧。幫助您輕鬆快速建立 Flutter 開發基礎，早日順利邁向成為專家級一流開發人才。

### 網路自學 Flutter 最常見的三大痛
1. 學習資訊東拼西湊，無法有系統很完整性的學習
2. 英文資料看得霧煞煞，一頭霧水
3. 觀念混淆，挫折感超重


### 課程特色
1. 由淺入深，無痛學習 Flutter 的程式開發技巧
2. 一次掌握 Flutter 最常用的核心關鍵知識
3. 繁體中文教材，系統化的課綱編排，HKT (侯光燦) 講師影片教學


Flutter 先修班
===
若還不熟悉 Dart 程式語言，可以參考：【從零開始學 Dart 程式設計】[線上教學課程目錄](https://tw-hkt.blogspot.com/2019/08/2019-dart-83.html) Flutter 先修班 ， Dart 程式語言基礎入門課程。


課程目錄
===

## Go 準備開始
| No. | 課程名稱 | 影片 | 講義 |
| -------- | -------- | -------- | -------- |
| 1 | 為什麼要用 Flutter ? | [連結](http://bit.ly/2t1SjBu) | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-1-flutter.html) |
| 2 | 安裝 Flutter 開發環境 | [連結](http://bit.ly/2t1SjBu) | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-2-flutter.html) |
| 3 | 建立第一個 Flutter 應用程式專案 | [連結](http://bit.ly/2t1SjBu) | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-3-flutter.html)
| 4 | 第一支 Flutter 應用程式 - Hello World | [連結](http://bit.ly/2t1SjBu) | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-4-flutter-hello-world.html) |
|5| 起手式程式碼| [連結](http://bit.ly/2t1SjBu) | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-5.html) |

## 基礎容器元件
| No. | 課程名稱 | 影片 | 講義 |
| --- | ------------- | -------- | -------- |
| 1 | Container 大大容器 | [連結](http://bit.ly/2t1SjBu) | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-6container.html) |
| 2 | 水平 Row 和垂直 Column 容器 | [連結](http://bit.ly/2t1SjBu) | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-7-row-column.html) |
| 3 | Center 置中容器| [連結](http://bit.ly/2t1SjBu) | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-8center.html) |

## 基本常用元件
| No. | 課程名稱 | 影片 | 講義 |
| -------- | -------- | -------- | -------- |
| 1 | Text 文字標籤元件 | [連結](http://bit.ly/2t1SjBu) | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-9text.html) |
| 2 | Button 按鈕元件 | [連結](http://bit.ly/2t1SjBu) | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-10button.html) |
| 3 | Image 圖片元件 | [連結](http://bit.ly/2t1SjBu) | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-11image.html) |
| 4 | TextField 文字輸入框元件 | [連結](http://bit.ly/2t1SjBu) | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-12textfield.html) |

## 跳頁&資料傳遞介紹
| No. | 課程名稱 | 影片 | 講義 |
| -------- | -------- | -------- | -------- |
| 1 | 簡單跳頁 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-13.html) |
| 2 | 從Ａ頁跳到Ｂ頁，並傳遞資料 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-14.html) |
| 3 | 從Ｂ頁返回Ａ頁並傳回資料 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-15.html) |
| 4 | 傳遞整包資料 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-16.html) |

## 按鈕和提示元件
| No. | 課程名稱 | 影片 | 講義 |
| -------- | -------- | -------- | -------- |
| 1 | FloatingActionButton 漂浮按鈕 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-17floatingactionbutton.html) |
| 2 | SnackBar 提示元件 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-18snackbar.html) |
| 3 | 訊息對話框視窗 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-19.html) |

## 頁面導航元件
| No. | 課程名稱 | 影片 | 講義 |
| -------- | -------- | -------- | -------- |
| 1 | BottomNavigationBar 底部頁面導航元件 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-20bottomnavigationbar.html) |
| 2 | TabBar 選項卡頁面導航元件 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-21tabbar.html) |
| 3 | Drawer 抽屜面導航元件 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-22drawer.html) |

## 容器佈局相關元件
| No. | 課程名稱 | 影片 | 講義 |
| -------- | -------- | -------- | -------- |
| 1 | Stack 堆疊元件 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-23stack.html) |

## 列表佈局相關元件
| No. | 課程名稱 | 影片 | 講義 |
| -------- | -------- | -------- | -------- |
| 1 | ListView 列表元件 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-24listview.html) |
| 2 | GridView 網格元件 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-25gridview.html) |
| 3 | Table 表格元件 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-26table.html) |

## 資料儲存
| No. | 課程名稱 | 影片 | 講義 |
| -------- | -------- | -------- | -------- |
| 1 | SharedPreferences 資料存取 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-27sharedpreferences.html) |
| 2 | Sqflite 資料庫存取 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-28sqflite.html) |
| 3 | Provider 狀態管理 | -------- | [連結](https://tw-hkt.blogspot.com/2019/11/flutter-30-day-29provider.html) |

著作聲明
===
「Flutter 程式設計入門實戰 30 天」中提供所有的圖文、程式碼與影片教學，以下簡稱「本資料」。「本資料」，允許使用者重製、散布、傳輸以及修改著作，但不得為商業目的之使用。使用時必須註明出處。教學影片內容，為 HKT 線上教室製作，HKT. 侯光燦 主講。


商標內容聲明

「本資料」，其中所引用之各商標及產品名稱分屬其合法公司所有，「本資料」，部分採用開放源始碼、圖文與影音等多媒體，引用自於網路，皆屬於其原作者之所有，「本資料」引用純屬介紹之用，並無任何侵權之意，特此聲明，其中內容若有不妥，或是侵犯了您的合法權益，請麻煩通知我們，我們將會迅速協助將侵權的部分移除，謝謝!

*有任何問題，麻煩聯繫，謝謝。

活動演講、贊助、公益等相關商業合作邀約，聯絡請洽：粉絲團訊息 or 來信
[e-mail]


贊助我們
===
創作不易，知識無價，免費線上教學就像顆種子，希望藉由您的支持與贊助，能夠無後顧之憂的日漸茁壯，努力前行堅持下去。不論捐贈金額的大小，我們都由衷的感謝每位贊助者，都是我們推廣知識、開放共享平台最大的動力!

您的捐贈將用於：請作者喝杯咖啡，鼓勵繼續創作，持續上傳教學影片與更多新技術文章。

## Line Pay 打賞
(由 Line Pay 支付平台，提供一卡通轉帳服務)

## 街口打賞

(由街口行動支付平台，提供轉帳服務)

## 超商代碼繳費打賞
<a href="https://p.ecpay.com.tw/F973D"><img src="https://i.imgur.com/luTrPi4.png" /></a>

(由綠界科技支付平台，提供超商繳費代碼)

## 銀行轉帳打賞
銀行名稱 ：玉山銀行-泰山分行 (銀行代碼808)
銀行帳號： 0602-979-092040
帳戶名稱 ：侯光燦

相關連結
===

HKT 線上教室 每週六日 更新影片
▶ YouTube 頻道
https://goo.gl/3f2pJi
▶ KT 線上教室 臉書粉絲團
https://goo.gl/27H9Li
▶ Udemy 頻道
http://bit.ly/2ZNdnrt
▶ 贊助我們
https://goo.gl/FiKXAu