Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
[直播分享] 20200831 Hiskio 課程 - 入門最新 RN 技術 - 打造雙平台電商 App
Sam Huang (sailplaneTW)
August 31, 2020
Programming
1
81
[直播分享] 20200831 Hiskio 課程 - 入門最新 RN 技術 - 打造雙平台電商 App
影片:
https://www.youtube.com/watch?v=pqEPYD91bFY
Sam Huang (sailplaneTW)
August 31, 2020
Tweet
Share
More Decks by Sam Huang (sailplaneTW)
See All by Sam Huang (sailplaneTW)
從 APP 到雲端:物聯網產品的軟體設計該如何規劃
sailplanetw
0
73
感官文化印刷的全通路品牌營運策略
sailplanetw
0
32
傳統與創新的碰撞:富士軟片資訊的趨勢觀察及未來展望
sailplanetw
0
40
淺談印刷文創與資訊技術的融合
sailplanetw
0
33
數位加速聽看聽 - 讓資訊技術成為印刷領域升級的最佳助手
sailplanetw
0
63
[五載復相逢,軟體二三事] 軟硬整合漫漫路
sailplanetw
0
45
[JSDC 2021] 從 React Native 跨屏開始的多領域開發歷程
sailplanetw
0
120
[五載復相逢,軟體二三事] 電傷 x 電殤 - 電商系統開發分享
sailplanetw
0
96
React Native 使用分享 - 五年小回顧
sailplanetw
2
330
Other Decks in Programming
See All in Programming
roadmap to rust 2024
matsu7874
1
890
코드 품질 1% 올리기
pluu
1
1k
Named Document って何?
harunakano
0
510
iOSアプリの技術選択2022
tattn
6
2.6k
Git Rebase
bkuhlmann
7
1k
Let's make a contract: the art of designing a Java API
mariofusco
0
160
Licences open source : entre guerre de clochers et radicalité
pylapp
2
350
TextPruner による大規模言語モデルの軽量化 / Large language model pruning using TextPruner
misawann
0
320
「新卒だけ」じゃない!学び直しを支えるミクシィの技術研修を紹介
mixi_engineers
PRO
0
160
あなたの会社の古いシステム、なんとかしませんか?~システム刷新から考えるDX化への道筋とバリエーション~/webinar20220420-grapecity
grapecity_dev
0
140
モデリングの費用対効果
masuda220
PRO
3
910
SRE bridge the gap: Feature development to Core API / 機能開発チームとコアAPIチームの架け橋としてのSRE
kenzan100
1
390
Featured
See All Featured
The Language of Interfaces
destraynor
148
20k
Git: the NoSQL Database
bkeepers
PRO
415
59k
Keith and Marios Guide to Fast Websites
keithpitt
404
21k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
350
21k
Designing for humans not robots
tammielis
241
23k
Creatively Recalculating Your Daily Design Routine
revolveconf
207
10k
Documentation Writing (for coders)
carmenhchung
48
2.5k
Navigating Team Friction
lara
175
11k
We Have a Design System, Now What?
morganepeng
35
2.9k
How to Ace a Technical Interview
jacobian
265
21k
BBQ
matthewcrist
74
7.9k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
181
15k
Transcript
入門最新 React Native技術 打造雙平台電商App Sam Huang Revtel Tech | 2020
內容大綱 Revtel Tech | 2020 背景介紹 Q&A 個人及團隊資訊 / 課程設計
React Native 介紹 雙平台開發的注意要點 React Native 近期發展 小議題探討:React Hook !? 2020 React Native 介紹 總結 小結 4 5 3 2 1
資訊科學本科,有十年以上開發經驗 橫跨 WEB / APP / IoT 等多領域 任多間公司策略及技術長(忻旅科技共同創辦人) 經歷超過20個
React Native 專案/產品開發 偶爾會做技術分享 (如 yourator求職平台/台科大/天瓏書局) 背景介紹 - 個人及團隊資訊 Sam Huang 黃奕翔 唯有交流才能成就最好的自己! 唯有交流才能成就最好的自己! Revtel Tech | 2020
背景介紹 - 課程設計 對課程的思考 - 應多考量參與課程者的背景 對學習的思考 - 應多注重在觀念建立 對技術的思考
- 應多引入實務的角度 Revtel Tech | 2020
React Native 介紹 Facebook 於 2015/03 公開的跨平台開發框架 官方支援 Android /
iOS 社群支援 Windows 等 React Native 許多知名公司採用 Revtel Tech | 2020
技術:大前端時代! 個人:技能養成的最佳路徑 為什麼我們需要投資 / 熟悉 React Native? Facebook 宣示資源投入 在
StackOverflow 很熱門 React Native 廣被接受 Revtel Tech | 2020
以網頁開發技能貫串整個開發核心 最大化共用已開發之程式碼 Facebook 及強大社群支持 (含微軟!) 使用 React Native 的好處 雙平台開發的注意要點
功能 / 體驗 穩定 / 可維護 / 技術路徑 專案可控性 現實軟體工程開發其實是在尋求幾個維度的平衡 Revtel Tech | 2020
效能 : 引入效能較佳的 JS engine - HERMES 開發 : fast
refresh 分工更明確 : Facebook 及社群分頭努力 一些發展方向 原生組件架構優化 渲染部分的重構 近一步降低啟動時間 Facebook 不斷宣示會挹注資源(React Conf 及相關 blog) React Native近期發展概況(近一年) Revtel Tech | 2020
React Native 核心架構 React Native近期發展概況(近一年) Revtel Tech | 2020
此次課程比較著重在 React Native 的整體掌握, 會以 class component 為主 但可能會在課程滿足解鎖條件時帶大家試試看 小議題探討
: React Hook 既有的 class 寫法還能運作,React 團隊目前並無移除既有寫法的計畫 可以預期未來使用這個寫法的元件會越來越多 答案:先不用急,但要跟 Revtel Tech | 2020
小議題探討 : React Hook Why - How - What -
不同框架間有不同思考方式(React vs. Vue) 該如何復用 UI 及邏輯? 背景敘述 既有的實作方式依舊無法很乾淨的抽離邏輯 函數形式的元件表述易於整合,那就朝函數式方向前進 設計一個機制封裝具有副作用的功能(如 state 更改) Revtel Tech | 2020
小議題探討 : React Hook Revtel Tech | 2020 2 1
向下相容的必要性 適當的時間段 適當的工作切分 新技術導入節奏 - 先求不傷身體再求療效! 可能作法:在重構(refactor)時挑幾個 component 改寫 小議題探討
: React Hook Revtel Tech | 2020
Native 一定最好 大多數效能議題皆在開發者而非核心 高階語言的目的在於思考完整性 不要有效能迷思! 不斷學習,但要注意連貫性 前端就是一直在前進! 小結 Revtel Tech
| 2020
Q&A Q1:react-native-cli vs. expo Revtel Tech | 2020 Q2:React Native
vs. Flutter Q3:React Web 移植到 React Native 要注意什麼? Q4:擔任 RN 工程師,Native 的知識需涉獵到什麼程 度?
Q&A Revtel Tech | 2020 Q5:ReactNative 比 NativeScript 好在哪? Q6:若原本使用JAVA開發後端,要學習哪些知識來串
接 React 前端呢?
自課程習得 RN 開發 基本觀念及思考邏輯 原始碼:專案起始點 目的 總結 - 一起來研究 React
Native 為系列課程的第一堂 課程正在逐步完成中 Line加入我們 Hiskio課程頁面 Revtel Tech | 2020
Thank you! ⼊⾨最新 React Native 技術打造雙平台電商App Revtel Tech | 2020