iT邦幫忙

react-native相關文章
共有 296 則文章
鐵人賽 Mobile Development DAY 7

技術 Day 7 - 你的APP快速切板選擇 Tailwind CSS

「開發的時候多想想,可以走捷徑時絕對不會繞遠路」 本篇要來介紹一款前端CSS框架「Tailwind CSS」 Tailwind CSS 是什麼? 官方網站:ht...

鐵人賽 Mobile Development DAY 28

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

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

鐵人賽 Mobile Development DAY 1

技術 Day 1 - 介紹 React Native 和 Expo,與開發環境和模擬器的設定

哈囉,大家好,歡迎開始我們 30 天的 React Native 與 Expo 之旅! 今天我們將會從最基本的開始,了解 React Native 與 Expo...

鐵人賽 Mobile Development DAY 2

技術 Day 2 - React Native淺談 & 學習、開發前評估

React Native淺談 是由React網頁前端框架衍生出來的Native APP框架React、React Native皆由Meta公司所研發出來的架構所...

鐵人賽 Mobile Development DAY 19

技術 Day 19 - RNDateTimePicker製作日期時間選單

本篇要來介紹日期時間選擇器第三方元件React Native Datetimepicker下稱RNDateTimePicker RNDateTimePicker...

鐵人賽 Mobile Development DAY 20

技術 Day 20 - React Native Picker Select手機版下拉選單製作

本篇要來介紹日期時間選擇器第三方元件React Native Picker Select下稱RNPickerSelect 原先React Native也是有Pi...

鐵人賽 Mobile Development DAY 8

技術 Day 8 - 在你的React Native Expo專案使用 NativeWind 套件

本篇會逐步講解NativeWind套件在React Native Expo專案安裝及使用 官網:https://www.nativewind.dev版本:2.0...

鐵人賽 自我挑戰組 DAY 27
React Native 奇幻之旅 系列 第 27

技術 【DAY27】React Native - 應用上架前的準備工作

Android & iOS 上架前都需要對應用進行一些基本設置,比如:應用的package (Bundle ID)、版本、icon...等,這邊簡單分享...

鐵人賽 自我挑戰組 DAY 30
React Native 奇幻之旅 系列 第 30

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

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

鐵人賽 Mobile Development DAY 26

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

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

鐵人賽 Mobile Development DAY 18
React Native CLI 開發心法 系列 第 18

技術 DAY 18 React Native iOS 上架前哨戰 - 使用 Apple Test Flight 發布測試

本篇將分享如何使用 Apple 的 Test Flighter 發佈你要測試的應用程式。基本上前半段會與 DAY 13 React Native iOS 打包...

React Native CLI 開發心法 系列 第 31

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

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

鐵人賽 Mobile Development DAY 3

技術 Day 3 - Expo 簡介 & 開發環境配置

Expo 簡介 起初根本不知道Expo是什麼是因為React Native官方直接使用了Expo的線上預覽(Snack)才開始對這款開發工具產生興趣並研究。 E...

鐵人賽 Mobile Development DAY 10
React Native CLI 開發心法 系列 第 10

技術 DAY 10 React Native 環境變數設定 - Android

為什麼要設置環境變數?一般軟體開發專案,會將環境設置成:Production 正式產品環境、 Staging 準正式環境、Development 開發環境、Te...

鐵人賽 Mobile Development DAY 9

技術 Day 9 - React Native APP登入功能製作(上) - 畫面切版

本篇開始前 先附上需求洽談時真實情況 PM:登入畫面有頭緒嗎工程師:沒有,怎麼辦,要通靈嗎😔PM:你先做出一版讓我們看看好了 附上使用TailWind CS...

鐵人賽 Mobile Development DAY 1

技術 DAY 1 - 前言&React Native 簡介

前言 預計分享的內容 有感於 React Navie 繁體中文的內容偏少加上在工作中踩了不少坑,因此這次鐵人賽將分享我以網頁前端工程師的角度開發 React N...

鐵人賽 Mobile Development DAY 14
React Native CLI 開發心法 系列 第 14

技術 DAY 14 使用 Firebase 發佈 React Native 測試版 APP - 多種環境配置

現在了解了如何打包 Andriod 的 APK 跟 iOS 的 IPA ,接下來要使用 Firebase 來發佈這些打包好的應用程式,以提供其他人安裝測試版應用...

鐵人賽 Mobile Development DAY 21

技術 Day 21 - Expo Barcode Scanner實作手機QRCode掃描功能

相信大家對於二維條碼(QR Code)並不陌生而在APP裡掃描QR Code更是大幅提升使用方便性 本篇要來使用Expo官方提供的Expo BarCodeSca...

鐵人賽 Mobile Development DAY 29

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

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

鐵人賽 Mobile Development DAY 1

技術 Day 01. 簡介 React Native

前言: React Native 是什麼? React Native 是一個臉書開發、建構在 React 之上的 JS 函式庫,最大的好處就是能用「類似網站開發...

鐵人賽 Mobile Development DAY 6

技術 Day 6 - React Native 基礎知識(二) - Props、State

接續上篇components、JSX介紹後React官方描述的核心概念還有下面兩項 props state 這兩項核心會介紹比較長因為這是後續開發使用者體驗...

鐵人賽 Mobile Development DAY 13

技術 Day 13 - 在你的APP實現永久性登入登出機制

本篇要實現「你滑掉我的APP,再點一次還是能進入首頁」那麼如何做到的呢讓我們開始一步步操作吧 ※本篇教學文稍長,稍微整理一下大綱 使用AsyncStorage...

鐵人賽 Mobile Development DAY 9

技術 Day 9 修改 npm 套件的好幫手  -  patch-package

在開發時很常會使用到非常多套件,但有時候這些套件的某些功能壞了、或是跟你所開發的環境衝突,套件的開發者沒有在維護了又或者是沒那麼快發布修正後的版本,那麼該怎麼辦...

鐵人賽 Mobile Development DAY 25
React Native CLI 開發心法 系列 第 25

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

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

鐵人賽 Mobile Development DAY 19

技術 Day 25. 以 Notifee 實作本地端推播定時通知

以 Notifee 新增本地端定時推播 現在我們對於 Notifee 如何新增、修改、刪除本地端推播通知,已經有了初步認識。不過實務上不太可能會設計按鈕,按下去...

鐵人賽 Mobile Development DAY 11

技術 Day 11 - React Native APP登入功能製作(下) - 登入後導向首頁

接續上篇 點選登入後,會跳出「登入成功」提示此時要將使用者導向首頁 那麼在React Native要如何做到「畫面導向」功能本篇會使用react-navigat...

鐵人賽 Mobile Development DAY 23

技術 Day 23 - Expo Location 實作地理位置追蹤功能

本篇要來介紹Expo地理位置追蹤套件 - Expo Location講解在React Native Expo專案怎麼做到 一次性取得使用者位置 背景追蹤使用者...

鐵人賽 Mobile Development DAY 24

技術 Day 24 - 使用 Fetch 和 MockAPI 模擬真實資料 feat.環境變數

在APP功能中,其實許多資訊都會經過後端API做伺服器驗證以Facebook為例,以下功能都會向後端伺服器驗證取回結果 登入驗證、忘記密碼 重設密碼 動態、貼...

鐵人賽 Mobile Development DAY 27
React Native CLI 開發心法 系列 第 27

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

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

鐵人賽 Mobile Development DAY 5

技術 Day 5 - React Native 基礎知識(一) - Components、JSX

接述前篇建立完專案接著就是進入探索程式碼的世界了 React Native官方建議在入門前先補充React的核心概念 https://reactnative....