iT邦幫忙

react-native相關文章
共有 296 則文章
鐵人賽 Mobile Development DAY 25
卡卡30天學 React Native 系列 第 25

技術 [ 卡卡 DAY 25 ] - React Native 手機裝置 keyboard 問題之 右下角的 next and go 設定

一個表單沒有良好的 keyboard 操作,怎麼能說是一個好表單!!!!接續 Day23 + Day24到目前為止遇到三個問題 : 鍵盤上的 next go...

鐵人賽 Modern Web

技術 Day 33 打包-ios (部分)

昨天說的是 Android 今天我們來聊聊如何打包 ios, 但因為沒有開發帳號,所以就只說 react native 的部份, jsbundle ios 跟...

鐵人賽 Mobile Development DAY 18
卡卡30天學 React Native 系列 第 18

技術 [ 卡卡 DAY 18 ] - React Native animated 來簡單使用 translate 效果

記得第一次使用到 css 的 animation 跟 transform 系列效果做了很多厲害的動畫東西飛來飛去轉來轉去這次我們來使用 React Nativ...

鐵人賽 Mobile Development DAY 27
卡卡30天學 React Native 系列 第 27

技術 [ 卡卡 DAY 27 ] - React Native keyboard 之亂之按螢幕就收鍵盤

若是鍵盤沒有之前教的設定 next 與 go 的機制打完字過後鍵盤就會收不起來這邊來跟大家分享一個叫做 TouchableWithoutFeedback 的...

鐵人賽 Mobile Development DAY 6
卡卡30天學 React Native 系列 第 6

技術 [ 卡卡DAY 6 ] - React Native style 必懂之 Flexbox 彈性盒子(上)

在手機裝置中, Flexbox 彈性盒子是一個重點樣式倘若你不懂,就只能躺著被打 orzReact Native 與 css 的彈性盒子雷同大致上就只有幾點不...

鐵人賽 Modern Web DAY 14

技術 [Day14] 我的最愛頁面

今日關鍵字: 我的最愛頁面呈現的是所有資料中我的最愛這個值為true也就是 isFavorite: true 這裡就能用上filter當然因為是從store...

鐵人賽 Mobile Development DAY 9
卡卡30天學 React Native 系列 第 9

技術 [ 卡卡 DAY 9 ] - React Native style 優化、共用沒煩惱!window.innerWidth 在 RN 怎麼處理?

有沒有想過如果我要調整整個 App 的主色或字體大小,要一個一個元件改有多累?有沒有想過只要改一次就能完成該怎麼做!?今天的主題,一改全改、共用沒煩惱!交給...

鐵人賽 Mobile Development DAY 12
卡卡30天學 React Native 系列 第 12

技術 [ 卡卡 DAY 12 ] - React Native UI 元件(component) 介紹(下)

再來多介紹一個常會用到的 list 元件以及到目前的踩雷分享 :P 列表元件 VirtualizedList VirtualizedList 是 Fl...

鐵人賽 Mobile Development DAY 11
卡卡30天學 React Native 系列 第 11

技術 [ 卡卡 DAY 11 ] - React Native UI 元件(component) 介紹(上)

不論是 React 或著 React Native 最主要的亮點就是元件式開發做出很多獨立 元件(component),然後使用這些元件(component)...

鐵人賽 Mobile Development DAY 26
卡卡30天學 React Native 系列 第 26

技術 [ 卡卡 DAY 26 ] - React Native 手機裝置 keyboard 之亂之鍵盤擋住元件與鍵盤點螢幕收起來

手機裝置切完版後才會發現啊~~~ 還沒完成今天我們來針對鍵盤擋住元件做個處理吧!!來介紹個插件 react-native-keyboard-aware-scr...

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

技術 【DAY29】打包 iOS APP 發布到 TestFlight 測試與上架 App Store

前言 要使用 TestFlight 測試應用以及上架 App Store 都需要加入 Apple developer program,個人帳號每年需支付 $99...

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

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

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

徵才 [徵求 Mobile / Web 全棧開發工程師]

[徵求 Mobile & Web 全棧開發工程師(數名)](React Native / Ruby on Rails) Lending7 LLC 總部...

鐵人賽 Modern Web DAY 18

技術 [Day18] 提醒功能-3:計畫通知

今日關鍵字:notification 計畫通知內容 昨天的即時通知是在localNotif編寫通知內容 localNotif(anime: Anime) {...

鐵人賽 Modern Web DAY 26

技術 Day 26 設定 Redux 環境

第 26 天 ! 今天我們來試著把 redux 的環境建立起來吧, 安裝 redux 套件: yarn add redux redux 本身是獨立的套件,是...

鐵人賽 Modern Web DAY 15

技術 [Day15] 搜尋頁面

今日關鍵字:還是 搜尋頁我的規劃是分成三區 輸入關鍵字搜尋 點擊種類標籤搜尋 顯示搜尋結果 今天會來實現這些功能 首先由於主架構跟首頁及我的最愛頁面一樣這...

鐵人賽 Modern Web DAY 25

技術 [Day25] 語言切換-2:store架構調整

今日關鍵字:combineReducers 預想中這個App會有兩個地方需要讀取語言 剛打開App時讀取Async Storage裡讀取使用者上次使用的語系...

鐵人賽 Mobile Development DAY 17
卡卡30天學 React Native 系列 第 17

技術 [ 卡卡 DAY 17 ] - React Native 用 Animated 來做簡單骨架屏

上一章節講了 Animated 的使用我們運用 start() 來做個骨架屏唷! 製作 banner 骨架屏 引入 Animated import {...

鐵人賽 Mobile Development DAY 10

技術 React Native 的動畫好幫手:Lottie

需求與場景 最近我們因為要在直播加上打賞功能,所以要做一些送禮時的動畫需求就是 在我們的 react native 的 app 裡加入動畫 疊加在直播畫面之上...

鐵人賽 Mobile Development DAY 24
卡卡30天學 React Native 系列 第 24

技術 [ 卡卡 DAY 24 ] - React Native 表單套件用 Formik 搭配 Yup 驗證 (下)

經過 Day23 的講解,大家應該都有初步的了解及安裝完畢吧 XD今天我們來運用 Formik 搭配 Yup 做個簡單表單畫面吧! 建立 Formik UI...

鐵人賽 Modern Web DAY 16

技術 Day 16 To Do List - 切版 1

第 16 天~ 在前面說了那麼多的理論, 今天我們試著做一個簡單的東西, 就是大家都很不陌生的 TO。DO。LIST 首先先開個新專案出來吧 react-na...

鐵人賽 Modern Web DAY 5

技術 Day 05 React Native 的起點

今天是第五天,前面講了如何建立專案,也說了如何用模擬器開啟專案 APP 今天我們來說說有關 react 的部份,並試著改動專案吧 先啟動模擬器來看看初始畫面吧...

鐵人賽 Modern Web

技術 Day 31 DEV TOOL

在開發時,總缺少不了 bug 的存在, 那如何 debugger 就是所有開發者都很在意的問題了, 以往開發 web 每個瀏覽器都會有相應的 devtool,...

鐵人賽 Mobile Development DAY 8

技術 [Day08 - React Native] 路由,使用 React Native Navigation

React Navigation 在這邊使用 Wix/React Native Navigation搭配 Wix/React Native Navigation...

鐵人賽 Modern Web DAY 4

技術 Day 04 專案結構

今天是第四天,我們來解說一下昨天建好的專案吧 那首先,我們先看看昨天的專案跑起來的畫面吧 因為我們是開發 App ,不是像 Web 那樣可以直接在瀏覽器上看到結...

鐵人賽 Modern Web DAY 26

技術 [Day26] 設定頁面-1:頁面改造

由於之前只有隨便寫一點按鈕今天來把介面改造一下 開始改造前要先來張留念照 這時候來google一下頁面來點靈感 看一看打算做一個列表式的感覺一欄是一個按鈕切換...

鐵人賽 Mobile Development DAY 22
卡卡30天學 React Native 系列 第 22

技術 [ 卡卡 DAY 22 ] - React Native 元件害羞之骨架屏先讓你瞧 react-native-skeleton-placeholder

咦 大家有見網友的經驗嗎?在還沒見面前是否都是以照片來判斷這個人是不是自己的菜?網站也有一個時間是還沒 loading 好的時間差今天來教大家做一個 shap...

鐵人賽 Mobile Development DAY 11

技術 在 React Native 裡實作 NSFW (Not suitable for work,工作場合不宜) 分類器

需求與場景 雖然我們的 App 為了怕麻煩,有要求 18+ 以上才能使用,但還是怕會有繞過這個限制的小孩在一對一聊天的場景,可以傳圖片。雖然大部分都非常健全,但...

鐵人賽 Modern Web DAY 17

技術 Day 17 To Do List - 切版 2

第 17 天! 昨天我們建立了, To Do List 專案 這是我們預期的畫面, 昨天做到 今天我們來完成最後下面的代辦事項列表 這代辦事項必須要有兩種狀態...

鐵人賽 Mobile Development DAY 1

技術 Day 1 - 單人開發者之路 前情提要

自我介紹 你好,我是一名 Asp.Net C# Web 程式小主管目前已從接案型科技公司畢業經手過的Web案子約十來件、APP專案一件 主要工作內容以Web後端...