昨天介紹了pdf表單和 native-base的欄位。今天來實作 UI吧 產生範例 我們先請 AI 產生範例讓我們參考一下,看一下看起來的感覺操作看看是否合用。...
今天我們要來講一下關於 redux action app 架構設計。我們專案使用的 redux 工具是 redux-toolkit 按下送出後發生了什麼事?...
昨天我們使用 chatgpt 幫我們在 react native 裡面串接 api,不過老實說有點太粗糙。我今天試了一天,如果使用AI要求他修改成想要的形式,會...
昨天我們在 RN裡面使用 fetch來串接 API和後端溝通註冊。但其實在實際上使用 RN串接API的時候不會只用一個 fetch 直接來串接這樣。 會用一些狀...
魔法的本質就是心想事成,如果連想都不敢想的話,就不會實現。 如果我和你們說其實不需要會寫程式,只需要會說你想要什麼電腦會幫你做出你想要的東西,你們相信嗎?這也是...
今天,我們會介紹這次專案對我來說比較難的有挑戰的點,接著再將功能細分規劃實作。將一個大項目拆成很多小項目也是一個必要的技能。 挑戰點 我背景是在工廠擔任研發工程...
昨天我們試著使用Expo啟動環境,今天我們使用React Native Cli來啟動環境。 什麼是React Native Cli? React Native...
今天我們將介紹如何在Windows上搭建React Native開發環境。並且我們這裡會使用winget來安裝必要的工具,設置Android Studio,並使...
React Native 的架構演進 在 React Native 的早期版本中,資料在JavaScript和原生層之間的通訊是透過Bridge來進行。但由於需...
什麼是 React Native? RN是由Meta推出的一個開源框架,讓開發者可以透過React來構建跨平台的移動應用程式。來達到一次編寫,處處運行的需求。利...
作為一名使用React的開發者,這次決定挑戰在30天內從零開始學習React Native這個跨平台開發,並且完整記錄整個學習過程。 React Native作...
上一篇已經把搜尋的功能完成了,但是搜尋的畫面看起來有點單調,所以這篇文章會使用 Lottie 動畫增加 App 的視覺效果。 Lottie 是什麼? Lotti...
上一篇文章建立完 Navigator,這篇文章會示範實作 Search 的部分,讓使用者搜尋完地區之後,直接顯示該地區的天氣資訊。 設定狀態 在開始做 Sear...
目前預計的功能還少了搜尋城市,並且顯示該城市的天氣資訊,不過搜尋的部分應該放在哪裡比較好呢?思考了一下,可以運用 React Navigation 來實作一個...
現在畫面上的 Icon 都是暫時寫死固定的,跟目前的天氣資訊並不符合,所以這篇文章會示範如何運用 Expo Icon 來更新天氣 Icon。 了解 OpenWe...
現在畫面上還未處理的區塊就剩下未來一星期的天氣還沒做了,這篇文章將會來示範如何處理這個區塊。 設定 API 在 Day 24 的文章中有提到,按照 OpenWe...
現在的 hourlyWeather 資料只有顯示 4 筆,感覺可以顯示更多,所以我們來使用 FlatList 來顯示更多資料。 FlatList FlatLis...
按照進度,這篇文章會示範怎麼從 OpenWeatherMap 取得未來數小時的天氣預報,並且讓資料展示在畫面上。 了解 API 首先必須要先知道資料有哪些,以及...
現在 HeadInfo 的時間是固定的,看起來不太真實,所以我們要改成顯示現在的時間。 安裝 dayjs 處理時間的 JS 套件很多,例如 moment、da...
回顧 透過這一系列的文章一一介紹了使用 React Native Cli 開發的各個面向以及其背後的原理,我將這 30 天的文章做以下幾個分類: 認識與學習...
目前畫面上的地區是固定的,但我們這個 App 是要顯示目前所在地區的天氣,所以這篇文章會示範如何取得目前所在地區的資料,並且顯示在畫面上。 如何取得目前所在地區...
目前已經透過 OpenWeatherMap API 拿到現在的天氣資料,但是要怎麼將資料傳遞給 component 使用呢? 有以下幾種方式可以傳遞資料給 co...
上篇文章已經透過 Expo Location 取得目前所在地的經緯度,接下來就可以使用 OpenWeatherMap API 來取得目前的天氣資訊。 設定 .e...
延續上一篇優化程式碼的實例,還剩下一個地方需要改善,那就是圖片。 使用圖片快取 (Cache Images) 透過 Cache 減少發送網路請求而且可以更快的載...
本系列的最後一篇,就是要來復盤、探討以及揭開單人開發者之路的神秘面紗 這是首次參加鐵人賽,首次完成鐵人賽按下「發表文章」的表情 一起來玩emoji廚房做出酷酷...
由於 OpenWeatherMap API 需要提供經緯度,所以我們需要取得使用者的位置資訊,這時候就可以使用 Expo Location 來取得使用者的位置資...
由於目前 HourlyForecast 和 DailyForecast 當中的 icon 設定部分都是重複的,看起來可以共用,因此我們可以將這部分抽出來,變成一...
本篇要來分享Expo App完成開發、上架後後續的一些維運、探討提供未來在接手維運React Native & Expo專案的你一些開發、維運方向👀 E...
React Natvie 版本升級一直是開發上很痛苦的一部分,常常一升級就會有 dependency 壞掉,修了東就壞了西的窘況,在這篇文章中,筆者會分享升級...
接續上一篇 DAY 27 React Native 效能優化:提升效能實戰 (一)接下來會用程式碼範例來說明如何優化 React Native 的效能~ 要優化...