iT邦幫忙

react-native相關文章
共有 296 則文章
0 Like 1 留言 234 瀏覽
鐵人賽 Mobile Development DAY 30
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 30 篇

技術 Day 30 - 使用 Lottie 動畫增加 App 視覺效果

上一篇已經把搜尋的功能完成了，但是搜尋的畫面看起來有點單調，所以這篇文章會使用 Lottie 動畫增加 App 的視覺效果。 Lottie 是什麼？ Lotti...

Bucky ‧ 2023-10-15 ‧團隊大船要開囉
0 Like 0 留言 238 瀏覽
鐵人賽 Mobile Development DAY 29
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 29 篇

技術 Day 29 - 顯示指定城市的天氣資訊

上一篇文章建立完 Navigator，這篇文章會示範實作 Search 的部分，讓使用者搜尋完地區之後，直接顯示該地區的天氣資訊。 設定狀態 在開始做 Sear...

Bucky ‧ 2023-10-14 ‧團隊大船要開囉
0 Like 0 留言 283 瀏覽
鐵人賽 Mobile Development DAY 28
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 28 篇

技術 Day 28 - 使用 React Navigation 切換頁面

目前預計的功能還少了搜尋城市，並且顯示該城市的天氣資訊，不過搜尋的部分應該放在哪裡比較好呢？思考了一下，可以運用 React Navigation 來實作一個...

Bucky ‧ 2023-10-13 ‧團隊大船要開囉
0 Like 0 留言 225 瀏覽
鐵人賽 Mobile Development DAY 27
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 27 篇

技術 Day 27 - 天氣 Icon 更新

現在畫面上的 Icon 都是暫時寫死固定的，跟目前的天氣資訊並不符合，所以這篇文章會示範如何運用 Expo Icon 來更新天氣 Icon。 了解 OpenWe...

Bucky ‧ 2023-10-12 ‧團隊大船要開囉
0 Like 0 留言 144 瀏覽
鐵人賽 Mobile Development DAY 26
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 26 篇

技術 Day 26 - 處理未來一星期的天氣預報

現在畫面上還未處理的區塊就剩下未來一星期的天氣還沒做了，這篇文章將會來示範如何處理這個區塊。 設定 API 在 Day 24 的文章中有提到，按照 OpenWe...

Bucky ‧ 2023-10-11 ‧團隊大船要開囉
0 Like 0 留言 203 瀏覽
鐵人賽 Mobile Development DAY 25
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 25 篇

技術 Day 25 - 使用 useWindowDimensions 讓元件自適應螢幕寬度

現在的 hourlyWeather 資料只有顯示 4 筆，感覺可以顯示更多，所以我們來使用 FlatList 來顯示更多資料。 FlatList FlatLis...

Bucky ‧ 2023-10-10 ‧團隊大船要開囉
0 Like 0 留言 153 瀏覽
鐵人賽 Mobile Development DAY 24
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 24 篇

技術 Day 24 - 處理未來時間的氣象預報

按照進度，這篇文章會示範怎麼從 OpenWeatherMap 取得未來數小時的天氣預報，並且讓資料展示在畫面上。 了解 API 首先必須要先知道資料有哪些，以及...

Bucky ‧ 2023-10-09 ‧團隊大船要開囉
0 Like 0 留言 137 瀏覽
鐵人賽 Mobile Development DAY 23
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 23 篇

技術 Day 23 - 顯示現在時間

現在 HeadInfo 的時間是固定的，看起來不太真實，所以我們要改成顯示現在的時間。 安裝 dayjs 處理時間的 JS 套件很多，例如 moment、da...

Bucky ‧ 2023-10-08 ‧團隊大船要開囉
0 Like 1 留言 465 瀏覽
鐵人賽 Mobile Development
React Native CLI 開發心法 系列 第 31 篇

技術 DAY31 - 鐵人賽回顧與完賽感想

回顧 透過這一系列的文章一一介紹了使用 React Native Cli 開發的各個面向以及其背後的原理，我將這 30 天的文章做以下幾個分類： 認識與學習...

Ashley ‧ 2023-10-07 ‧團隊曼陀號計畫V
0 Like 0 留言 140 瀏覽
鐵人賽 Mobile Development DAY 22
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 22 篇

技術 Day 22 - 使用 Geocoding 顯示目前地區

目前畫面上的地區是固定的，但我們這個 App 是要顯示目前所在地區的天氣，所以這篇文章會示範如何取得目前所在地區的資料，並且顯示在畫面上。 如何取得目前所在地區...

Bucky ‧ 2023-10-07 ‧團隊大船要開囉
0 Like 0 留言 567 瀏覽
鐵人賽 Mobile Development DAY 30
React Native CLI 開發心法 系列 第 30 篇

技術 DAY 30 React Native 版本升級實戰 ： 填坑之旅

React Natvie 版本升級一直是開發上很痛苦的一部分，常常一升級就會有 dependency 壞掉，修了東就壞了西的窘況，在這篇文章中，筆者會分享升級...

Ashley ‧ 2023-10-06 ‧團隊曼陀號計畫V
0 Like 0 留言 303 瀏覽
鐵人賽 Mobile Development DAY 21
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 21 篇

技術 Day 21 - 使用 Zustand 管理狀態

目前已經透過 OpenWeatherMap API 拿到現在的天氣資料，但是要怎麼將資料傳遞給 component 使用呢？ 有以下幾種方式可以傳遞資料給 co...

Bucky ‧ 2023-10-06 ‧團隊大船要開囉
0 Like 1 留言 346 瀏覽
鐵人賽 Mobile Development DAY 29
React Native CLI 開發心法 系列 第 29 篇

技術 DAY 29 React Native 效能優化：提升效能實戰（三）＆ 效能優化總結

延續上一篇優化程式碼的實例，還剩下一個地方需要改善，那就是圖片。 使用圖片快取 （Cache Images） 透過 Cache 減少發送網路請求而且可以更快的載...

Ashley ‧ 2023-10-05 ‧團隊曼陀號計畫V
0 Like 0 留言 269 瀏覽
鐵人賽 Mobile Development DAY 20
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 20 篇

技術 Day 20 - 使用 OpenWeatherMap API - 目前天氣資料

上篇文章已經透過 Expo Location 取得目前所在地的經緯度，接下來就可以使用 OpenWeatherMap API 來取得目前的天氣資訊。 設定 .e...

Bucky ‧ 2023-10-05 ‧團隊大船要開囉
0 Like 0 留言 306 瀏覽
鐵人賽 Mobile Development DAY 28
React Native CLI 開發心法 系列 第 28 篇

技術 DAY 28 React Native 效能優化：提升效能實戰（二）

接續上一篇 DAY 27 React Native 效能優化：提升效能實戰 (一)接下來會用程式碼範例來說明如何優化 React Native 的效能～ 要優化...

Ashley ‧ 2023-10-04 ‧團隊曼陀號計畫V
0 Like 2 留言 306 瀏覽
鐵人賽 Mobile Development DAY 30
單人開發者之路：React Native 與 Expo 帶你從開發到上架 系列 第 30 篇

技術 Day 30 - 單人開發者之路 完結篇

本系列的最後一篇，就是要來復盤、探討以及揭開單人開發者之路的神秘面紗 這是首次參加鐵人賽，首次完成鐵人賽按下「發表文章」的表情 一起來玩emoji廚房做出酷酷...

peterlu ‧ 2023-10-04
0 Like 0 留言 162 瀏覽
鐵人賽 Mobile Development DAY 19
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 19 篇

技術 Day 19 - 簡單定位 - Expo Location

由於 OpenWeatherMap API 需要提供經緯度，所以我們需要取得使用者的位置資訊，這時候就可以使用 Expo Location 來取得使用者的位置資...

Bucky ‧ 2023-10-04 ‧團隊大船要開囉
0 Like 0 留言 379 瀏覽
鐵人賽 Mobile Development DAY 27
React Native CLI 開發心法 系列 第 27 篇

技術 DAY 27 React Native 效能優化：提升效能實戰 (一)

如何讓你的 React Native 效能提升呢？接下將分享幾個優化的小技巧。 移除 console 在開發 React Native 專案中，很常見的 deb...

Ashley ‧ 2023-10-03 ‧團隊曼陀號計畫V
0 Like 1 留言 417 瀏覽
鐵人賽 Mobile Development DAY 29
單人開發者之路：React Native 與 Expo 帶你從開發到上架 系列 第 29 篇

技術 Day 29 - Expo SDK 升級 & 後續維運甘苦談

本篇要來分享Expo App完成開發、上架後後續的一些維運、探討提供未來在接手維運React Native & Expo專案的你一些開發、維運方向👀 E...

peterlu ‧ 2023-10-03
0 Like 0 留言 141 瀏覽
鐵人賽 Mobile Development DAY 18
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 18 篇

技術 Day 18 - 重構 TypeScript icon 設定

由於目前 HourlyForecast 和 DailyForecast 當中的 icon 設定部分都是重複的，看起來可以共用，因此我們可以將這部分抽出來，變成一...

Bucky ‧ 2023-10-03 ‧團隊大船要開囉
0 Like 0 留言 1267 瀏覽
鐵人賽 Mobile Development DAY 26
React Native CLI 開發心法 系列 第 26 篇

技術 DAY 26 React Native 效能優化：使用 Firebase Performance Monitoring 監控應用程式效能

利用 firebase 打造自動監測應用程式效能的工具，當效能發生問題時就會系統自動發信通知，最重要的是可以同時監測到 iOS 跟 Android 的正式環境的...

Ashley ‧ 2023-10-02 ‧團隊曼陀號計畫V
0 Like 0 留言 507 瀏覽
鐵人賽 Mobile Development DAY 28
單人開發者之路：React Native 與 Expo 帶你從開發到上架 系列 第 28 篇

技術 Day 28 - React Native iOS APP上架至App Store

接續上篇在完成XCode建置Expo專案iOS App時這時要來上架到App Store讓你的App提供iOS使用者下載 App Store Connect入口...

peterlu ‧ 2023-10-02
0 Like 0 留言 150 瀏覽
鐵人賽 Mobile Development DAY 17
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 17 篇

技術 Day 17 - 建立 Weather App UI 架構

這篇文章將會著重於建立 App 的 UI 架構，會使用一開始建立專案設定的 nativewind 和 tailwindcss 來快速地設計和實現 UI。 設計...

Bucky ‧ 2023-10-02 ‧團隊大船要開囉
0 Like 1 留言 403 瀏覽
鐵人賽 Mobile Development DAY 25
React Native CLI 開發心法 系列 第 25 篇

技術 DAY 25 React Native 效能優化：使用 Firebase Crashlytics 追蹤應用程式 Crash

Firebase 的功能種類非常多，在 DAY 14 使用 Firebase 發佈 React Native 測試版 APP - 多種環境配置 時已經分別將 A...

Ashley ‧ 2023-10-01 ‧團隊曼陀號計畫V
0 Like 0 留言 762 瀏覽
鐵人賽 Mobile Development DAY 27
單人開發者之路：React Native 與 Expo 帶你從開發到上架 系列 第 27 篇

技術 Day 27 - 使用Expo專案建置你的第一支iOS APP

本篇會使用Expo專案搭著React Native官方iOS打包說明(官方文件內容非常少...)帶你完成打包iOS App 注意：當你沒有Apple devel...

peterlu ‧ 2023-10-01
0 Like 0 留言 222 瀏覽
鐵人賽 Mobile Development DAY 16
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 16 篇

技術 Day 16 - 申請使用 OpenWeather

目前有蠻多可以利用的天氣 API，不管是免費或是付費的資料。這裡要介紹的天氣即時資訊的 API，他有免費的額度可以使用，以一個要作為個人專案來說非常足夠。我們會...

Bucky ‧ 2023-10-01 ‧團隊大船要開囉
0 Like 0 留言 473 瀏覽
鐵人賽 Mobile Development DAY 26
單人開發者之路：React Native 與 Expo 帶你從開發到上架 系列 第 26 篇

技術 Day 26 - React Native Android APP上架至Play商店

接續上篇建置React Native Android APP完成後本篇要來講解要如何將APP放在Play商店讓使用者下載 上架前注意事項 當你沒有Google...

peterlu ‧ 2023-09-30
0 Like 0 留言 205 瀏覽
鐵人賽 Mobile Development DAY 15
掌握 React Native 與 Expo：30天雙打，新手也能精通跨平台開發！ 系列 第 15 篇

技術 Day 15 - 第二個 App 簡介與專案 Tailwind CSS 設定

今天已經是第 15 天了，轉眼間鐵人賽也達成了二分之一的進度。 今天開始要來實作第二個專案，我們要來做的是一個即時天氣 App。這次除了一樣使用 React N...

Bucky ‧ 2023-09-30 ‧團隊大船要開囉
0 Like 0 留言 481 瀏覽
鐵人賽 自我挑戰組 DAY 30
React Native 奇幻之旅 系列 第 30 篇

技術 【DAY30】React Native - 使用 CodePush 熱更新應用

前言 有些時候會遇到應用新版本剛上線就發現有bug必須馬上修復的情況，如果是大改動的話重build、重送審也就算了，但如果只是改一行程式碼、改文字、換圖片......

wtlcqb ‧ 2023-09-30
0 Like 1 留言 229 瀏覽
鐵人賽 Mobile Development DAY 24
React Native CLI 開發心法 系列 第 24 篇

技術 DAY 24 React Native 效能優化： 使用 Flashlight 衡量應用程式效能

今天要來介紹一個很有趣的效能監測工具 Flashlight，透過 Flashlight 可以查看正式環境的 APP 效能，不只你自己開發的 APP 可以看得到，...

Ashley ‧ 2023-09-30 ‧團隊曼陀號計畫V
iThome鐵人賽
參賽組數
1123 組
團體組數
52 組
累計文章數
23096 篇
完賽人數
656 人
iT+看影片追技術 看影片追技術 看更多
熱門tag 看更多
15th鐵人賽 13th鐵人賽 14th鐵人賽 12th鐵人賽 11th鐵人賽 鐵人賽 2019鐵人賽 2018鐵人賽 javascript 2017鐵人賽 python windows php c# windows server linux css react 程式設計 vue.js
熱門問題
熱門回答
熱門文章
IT邦幫忙