iT邦幫忙

鐵人檔案

2021 iThome 鐵人賽
回列表
Modern Web

Flutter web 的奇妙冒險 系列

平常工作中主要是使用react在開發網頁前端,而在今年有機會接觸到公司內部的Flutter app專案,也就藉此機會開始接觸了 Flutter 這項新技術,剛好今年 Flutter 2.0 release 時同時也宣佈了 Flutter web正式進入 stable channel了。就決定以 web 的形式來呈現今年在 Flutter 上所學習到的東西。

鐵人鍊成 | 共 30 篇文章 | 7 人訂閱 訂閱系列文 RSS系列文
DAY 21

Day 21 | 狀態管理套件 MobX - 到底什麼是狀態管理

狀態管理? 在介紹 MobX 以前我想先來說一下什麼是「狀態管理」 究竟為什麼我們需要「狀態管理」,還記得前幾篇想到 Flutter其中一個概念 UI = F(...

2021-10-04 ‧ 由 Todd 分享
DAY 22

Day 22 | 狀態管理套件 MobX - 基本使用

昨天稍微提到了狀態管理及 MobX 的基本介紹那今天就要來說明 MobX 中的核心概念。 MobX 最重要的就是這三個東西: Observables、Acti...

2021-10-05 ‧ 由 Todd 分享
DAY 23

Day 23 | 在Flutter裡串接restful api - 我不使用HttpClient了 jojo

這篇文主要是介紹在 Flutter 中如何串接 restful api ,主要是使用 Dio(意外的跟這個系列文題目切題) 這個套件以及搭配幾個處理JSON資料...

2021-10-06 ‧ 由 Todd 分享
DAY 24

Day 24 | 在flutter 中串接 restful api - MobX的非同步操作

那今天就來讓這個非同步資料透過MobX 來串接到畫面上: 首先一樣建立一個 UsersViewModel import 'dart:convert'; imp...

2021-10-07 ‧ 由 Todd 分享
DAY 25

Day 25 | Flutter 路由管理套件 - auto_route

Navigator 1.0 Flutter 有內建一個路由管理 API Navigator ,而Flutter也在今年發表了 Navigator 2.0 但因...

2021-10-08 ‧ 由 Todd 分享
DAY 26

Day 26 | 共享 MobX store with get_it

還記得我們很早之前說過Flutter有一個問題就是嵌套太多層時我們要從下層拿到上層的東西時會變得十分麻煩。 換句話說也就是下層依賴於上層的物件/實例,但什麼時候...

2021-10-09 ‧ 由 Todd 分享
DAY 27

Day 27 | 狀態管理 - BLoC基本介紹

在剛開始學習Flutter時如果讀到有關狀態管理的文章大部分都會是與「BLoC」相關的內容,雖然真的是有點複雜,但感覺還是得嘗試看看「BLoC」到底有什麼優點可...

2021-10-10 ‧ 由 Todd 分享
DAY 28

Day 28 | 狀態管理-從官方範例來看如何使用BLoC

那今天我們就來使用bloc及flutter_bloc 這兩個來實作範例,基本上我們在實作BLoC pattern時我們都會切分成三層分別是:資料層、BLoC層、...

2021-10-11 ‧ 由 Todd 分享
DAY 29

Day 29 | 狀態管理-從官方範例來看如何使用BLoC (2)

今天就來實作UI的部分,以及來小小的比較一下BLoC與MobX的差異 我們把這個頁面分成三個檔案posts_page、posts_list、 posts_ite...

2021-10-12 ‧ 由 Todd 分享
DAY 30

Day 30 | 將flutter web 部署至 netlify

最後一天就來部署我們的flutter web吧,也算是這系列文中真的跟「web」唯一有關的一篇文XD 首先我們這次會使用 netlify 來託管我們的網站。 你...

2021-10-13 ‧ 由 Todd 分享