iT邦幫忙

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

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

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

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

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

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

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

技術 [ 卡卡 DAY 10 ] - React native 如何讓樣式更簡潔 之 margin, padding 回到 css 寫法

還記得之前有提到在 Day 5 有提到 React Native 的 margin / padding / border ?針對這麼不合理的寫法我們要怎麼讓他...

鐵人賽 Modern Web DAY 7

技術 Day 07 Style

第七天~ 我們昨天寫了個 Hello World 出來, 但是這只是單單把字給秀出來而已, 假如我們希望對畫面做調整的話, 讓我們的 Hello World 看...

鐵人賽 Mobile Development DAY 7

技術 [Day07- React Native]建立 React Native 專案

React Native 官網 現在有許多可以建立雙平台的工具,像是 Golang 的 Flutter,還有 Vue.js 的 Vue Native 這些都可以...

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

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

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

鐵人賽 Mobile Development DAY 6

技術 [Day06 - UI/UX] 建立 APP Design Guideline

在開始畫設計稿之前,我們要先確認一下我們的字級以及主色以及輔色等等。這邊我套用去年自製的 Design Guideline Template 來定義簡單的設計規...

鐵人賽 Modern Web DAY 5

技術 Day 05 React Native 的起點

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

鐵人賽 Modern Web DAY 6

技術 Day 06 Hello World

到第六天囉~ 這兩天我們把專案大概的介紹了一下,接下來我們總算要進入到程式裡了 像昨天說過的,我們主要開發都會在 App component 底下, 那我們先來...

鐵人賽 Modern Web DAY 4

技術 Day 04 專案結構

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

鐵人賽 Mobile Development DAY 4

技術 [Day04 - UI/UX] 確認使用的 UI framework

開始畫圖之前,先確認好要使用的UI framework,來確認可以使用什麼元件。才不會有實作畫面很困難的問題。這邊提供幾個元件來給大家參考: 以下是我使用過的:...

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

技術 [ 卡卡 DAY 8 ] - React Native 跨平台裝置判斷

還記得 React Native 可以同時完成 iOS / Android 裝置吧?跨平台裝置如果不同 style 要如何設定?跨平台裝置如果整個頁面都不一樣...

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

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

上篇大致上介紹了一下於 css vs React Native 的 flexbox 差異這篇主要就是實際上的運用了! 什麼是彈性盒子 flexbox ? 之...

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

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

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

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

技術 [ 卡卡 DAY 5 ] - Style in React Native - inline style vs StyleSheet

在 React Native 提供兩種方式引入樣式 寫 inline style 運用官方提供的 StyleSheet 的 function 建立一個抽象的...

鐵人賽 Mobile Development DAY 3

技術 [Day03 - 規劃與設計] 建立 Wireframe 讓你開發不迷路

如果不想要大家一起通靈通出一坨O,請不要偷懶做好規劃。我說那個Excel寫出來的功能列表也是不夠的,畢竟大家對文字的理解都不同。 一份好的匡線圖也可以做好聚焦的...

鐵人賽 Modern Web DAY 3

技術 Day 03 環境建立

環境設定 當我們在做開發時,首先要做的,就是準備好開發環境, 不然所有的開發都會無法進行, 所以首先,我們要來準備好 React Native 的開發環境 An...

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

技術 [ 卡卡 DAY 4 ] - React Native 專案結構

我的資料結構 . ├── App.js // App root component,the start of JS code ├── android/ /...

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

技術 [ 卡卡 DAY 3 ] - React Native 環境建立輕鬆上手

React Native 我的安裝步驟: Node.js,我使用 Homebrew 來安裝,所以會先安裝 Homebrew!再來安裝 Node.jsNode...

鐵人賽 Modern Web DAY 2

技術 Day 02 React ?? Native ??

HI,到了第二天,感覺每天寫一篇文章的感覺真的會有一種怠惰感,還是好好習慣吧 什麼是 React 先來介紹一下, React好了, 那他的歷史,是 2013 年...

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

技術 [ 卡卡 DAY 2 ] - React Native 是什麼? 原理?優點?

起源 於 2015 年 3 月 Facebook 開放了 React Native 的原始碼,讓使用者可以利用 JavaScript 和 React 建立原生...

鐵人賽 Mobile Development DAY 1

技術 [Day01 - 簡介] 成為一位孤獨型玩家,從亂點技能開始

Hello 大家好我是 Edmond,大家在疫情期間是否感受到滿滿的孤獨感呢?又是否突然發現,自己其實滿適合一個人的呢?(大錯。本次想要來跟大家介紹一個人的開發...

鐵人賽 Mobile Development DAY 11

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

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

鐵人賽 Mobile Development DAY 10

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

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

鐵人賽 Mobile Development DAY 3

技術 React Native 優缺點,如果現在開始做會選哪個

我們因為只有一個工程師,做 App 的話跨平台開發是很自然的選項。在2018年開發時,當初只有 React Native 跟 Xamarin 這兩個選項。但那時...

鐵人賽 Modern Web DAY 1

技術 Day 01 前言

自我介紹 嗨~大家好,這是我第一次來參加鐵人賽 那本身就是前端工程師,接觸前端也有一陣子了, 之前都是在 Web 上做開發, 使用的是 ReactJS, 那這次...

徵才 【毛小愛】徵資深軟體工程師!最有潛力的寵物科技新創!

隨著亞洲地區的共享產業崛起,毛小愛 Fluv 是一個由美國與台灣的連續創業家組成的寵物科技新創團隊,也在一年內就達到近30k用戶的目標並成為了當地最大的共享寵物...

徵才 【毛小愛】徵軟體工程師!最有潛力的寵物科技新創!

隨著亞洲地區的共享產業崛起,毛小愛 Fluv 是一個由美國與台灣的連續創業家組成的寵物科技新創團隊,也在一年內就達到近30k用戶的目標並成為了當地最大的共享寵物...

鐵人賽 Software Development DAY 23

技術 不用網路也可以用低代碼平台Mendix! Native Mobile App 頁面怎麼做?

現在多數人手機不離手,使用手機的頻率也比電腦多很多,如果我們沒有辦法做手機專用的應用程式那就遜掉了! 以現在的標準來看,好用的應用程式不只要在電腦上跑得動,在手...

鐵人賽 Modern Web

技術 [Day33] 加入Icon(順便偷渡完結感想)

今日關鍵字:Icon 最後一天希望能給自己的App一個Icon不過既然Splash Screen已經拿React的Icon來做了Icon也暫且拿同樣的素材吧...