Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
iOSアプリエンジニアがReact Nativeを使ってみて
Search
Shuichi Nagao
March 23, 2018
Programming
0
280
iOSアプリエンジニアがReact Nativeを使ってみて
iOSアプリエンジニアがReact Nativeを使ってみての雑感についてです、
Shuichi Nagao
March 23, 2018
Tweet
Share
More Decks by Shuichi Nagao
See All by Shuichi Nagao
UX for Key Management
ngo275
0
110
深センではテクノロジーを使う人がイノベーションを起こしている
ngo275
0
560
スマートコントラクトのデプロイって何だろう
ngo275
0
790
プロトタイピングするならFirebaseを使ってみよう
ngo275
0
1.8k
Ethereumで開発を始めるなら知っておきたいこと
ngo275
10
5k
スマートコントラクトをHTTPで実行する
ngo275
0
120
EOSでスマートコントラクトを実行してみる
ngo275
0
1.1k
中東のシリコンバレーことイスラエルに行ってきた
ngo275
0
130
ペイモのアーキテクチャ
ngo275
0
670
Other Decks in Programming
See All in Programming
DMMを支える決済基盤の技術的負債にどう立ち向かうか / Addressing Technical Debt in Payment Infrastructure
yoshiyoshifujii
4
640
Bedrock AgentCore ObservabilityによるAIエージェントの運用
licux
8
350
リッチエディターを安全に開発・運用するために
unachang113
1
270
The Niche of CDK Grant オブジェクトって何者?/the-niche-of-cdk-what-isgrant-object
hassaku63
1
710
AI時代の『改訂新版 良いコード/悪いコードで学ぶ設計入門』 / ai-good-code-bad-code
minodriven
24
10k
0から始めるモジュラーモノリス-クリーンなモノリスを目指して
sushi0120
0
170
変化を楽しむエンジニアリング ~ いままでとこれから ~
murajun1978
0
520
AIのメモリー
watany
11
1.1k
状態遷移図を書こう / Sequence Chart vs State Diagram
orgachem
PRO
3
290
AWS Summit Japan 2024と2025の比較/はじめてのKiro、今あなたは岐路に立つ
satoshi256kbyte
1
250
[Codecon - 2025] Como não odiar seus testes
camilacampos
0
100
構造化・自動化・ガードレール - Vibe Coding実践記 -
tonegawa07
0
150
Featured
See All Featured
Building an army of robots
kneath
306
45k
Building Adaptive Systems
keathley
43
2.7k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.8k
Intergalactic Javascript Robots from Outer Space
tanoku
271
27k
Art, The Web, and Tiny UX
lynnandtonic
301
21k
GraphQLとの向き合い方2022年版
quramy
49
14k
Navigating Team Friction
lara
187
15k
How to Think Like a Performance Engineer
csswizardry
25
1.8k
Fireside Chat
paigeccino
37
3.5k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Speed Design
sergeychernyshev
32
1k
A better future with KSS
kneath
238
17k
Transcript
ωΠςΟϒͷ ΞϓϦΤϯδχΞ͔ΒΈͨ REACT NATIVE 20180323 @NGO275 1
͢͜ͱ ▸ React Nativeͱ ▸ ωΠςΟϒ։ൃͱͷҧ͍ ▸ ڥߏங ▸ ઃܭɾ࣮
▸ ςετ ▸ ·ͱΊ 2
REACT NATIVEͱʁ ▸ ReactFacebook͕։ൃͨ͠JavaScriptͷϑϨʔϜϫʔΫ ▸ React Native(ҎԼRN)ͦΕΛiOS/AndroidʹԠ༻ͨ͠ͷ ▸ 20153݄ʹiOSɺಉ9݄ʹAndroid͕ϦϦʔε͞Εͨ ▸
ಉ͡JSͷίʔυͰiOS / Android͕ಈ͘ ▸ جຊతʹReactʹͦͬ͘Γ ▸ ωΠςΟϒͷUIΛ͍ɺϝΠϯͷUIεϨουͱผͰಈ͘ͷ ͰύϑΥʔϚϯεѱ͘ͳ͍ 3
REACT NATIVEͱʁ RNΛ͍ͬͯΔΞϓϦͨͪ https://facebook.github.io/react-native/showcase.html 4
ωΠςΟϒ։ൃͱͷҧ͍ React Native ωΠςΟϒ IDE ਓʹΑΔ VS Code / IntelliJ
/ etc. Xcode / Android Studio ݴޠ JavaScriptͷΈ ܕ͕ͳ͍ Swift / Kotlin (Objective-c / Java) ܕ͕͋Δ σόοά ํ๏ ैདྷͷIDE͚ͩͰͳ͘ChromeͰ JavaScript௨Γͷσόοά͕Ͱ͖Δ IDEΛར༻͢Δ͜ͱʹͳΔ Ϗϧυ ϗοτϦϩʔυͰ ίʔυͷө͕Ͱ͖Δ ຖ୯ҐͰͭ͜ͱ͕͋Δ 5
ωΠςΟϒ։ൃͱͷҧ͍ ~ڥ·ΘΓ~ ▸ ಉ͡ڥͳͣͳͷʹਓʹΑͬͯϏϧυ͕Ͱ͖ͳ͔ͬͨΓ͢Δʢґଘ͍ͯ͠Δͷ ͕ଟ͍ʣ ▸ ωοτͷใ͕͙͢ݹͯ͑͘ͳ͍ͷʹͳΔ ▸ ຊޠͷใݹͯ͘ࢀߟʹͳΒͳ͍͜ͱ͕ଟ͍ ▸
όάΤϥʔʹ͍ͭͯௐ͍ͯΔ࣌ɺؾͮ͘ͱGitHubͷIssueΛݟ͍ͯΔ ▸ ࠔͬͨΒԿͰ࠶ىಈ 6
ωΠςΟϒ։ൃͱͷҧ͍ ~ઃܭ~ ▸ RNReactͷࢥΛܧঝ͍ͯ͠ΔͷͰɺωΠςΟϒͷϏϡʔͷϥΠϑαΠ ΫϧͱҟͳΔ࣮Λ͢Δඞཁ͕͋Δ ▸ Props / State /
Component ͱ͍͏֓೦͕ωΠςΟϒʹͳ͍ ▸ viewWillAppearͷΑ͏ͳϝιου͕ͳ͍ ▸ RNͰجຊReduxΛར༻͢Δ͜ͱʹͳΔ͕Α͋͘ΔωΠςΟϒΞϓϦͷ ઃܭํͱେ͖͘ҟͳΔ ▸ reduxͰɺStore͕άϩʔόϧʹΞϓϦͷঢ়ଶཧΛ͠ɺViewͦͷ Storeͷঢ়ଶΛࢹͯ͠มԽ͕͋Ε࠶ඳը͞ΕΔ ▸ RN+ReduxͰͲ͏ͬͯϏδωεϩδοΫΛॻ͍͍ͯ͘ͷ͔ͱ͍͏ ݟ͕ѹతʹগͳ͍ 7
ωΠςΟϒ։ൃͱͷҧ͍ ~࣮~ ▸ Navigationͷ࣮͕RNͩͱϥΠϒϥϦબఆ͔Β࢝·Δ ▸ ͦͦඪ४ͷNavigation͕͠ΐ΅͍ ▸ React Native +
ReduxͳΒreact-navigation͕ྑ͍͔ ▸ UIͷ࣮React(Web frontend)ͷͦΕʹۙ͘ɺωΠςΟϒΞϓϦͷͦΕ ͱ͔͚Ε͍ͯΔ ▸ CSSflexboxͱ͍ͬͨ֓೦͕ωΠςΟϒΞϓϦʹͳ͍ ▸ ωΠςΟϒͰͨΓલͷίϯϙʔωϯτΛ͏ΑΓnative-base RN͕ඪ४Ͱαϙʔτ͍ͯ͠ΔͷΛར༻͢Δ͜ͱʹͳΔ ▸ σβΠϯωΠςΟϒͱ͍͏ΑΓগ͠WebʹدͤΔඞཁ͕͋Δ 8
ωΠςΟϒ։ൃͱͷҧ͍ ~࣮~ ▸ OS͕αϙʔτ͍ͯ͠ΔAPIωΠςΟϒ͚ͷ֎෦ͷSDKΛར༻͢Δ࣌ʹ ωΠςΟϒͷ࣮͕ඞཁʹͳΔ͜ͱ͕͋Δ ▸ ιʔείʔυ͕iOS / AndroidͰجຊಉ͡ͳͷͰɺUI͕ϓϥοτϑΥʔϜ ʹΑͬͯେ͖͘ม͑Α͏ͱ͢Δͱذେ͖͘ͳͬͯෳࡶʹͳΔ
▸ ωΠςΟϒͰҰॠͰ࣮Ͱ͖Δ͜ͱRNͩͱ׳Εͳ͍͏͙ͪ͢Ͱ͖ Δͷ͔Θ͔ΒͣɺͷݟੵΓհͩͬͨ ▸ ʮ͜ͷσβΠϯ͙ͬͯ͢Ͱ͖·͢ʁʯ͕͙͢ʹ͑ΒΕͳ͔ͬͨ ▸ iOS / AndroidͰϩδοΫ͕࣮ҧ͍ͬͯͨɺͱ͍͏൵͕ܶى͜Βͳ͍ ▸ paymoͰ͜͏͍͏൵͕ܶ࠷ۙଟ͘ൃ֮ͨ͠ 9
ωΠςΟϒ։ൃͱͷҧ͍ ~ςετ~ ▸ mochajestͱ͔JavaScriptͰͷςετ͕ී௨ʹ͔͚Δ ▸ iOSͱൺͯΉ͠Ζใ͕ଟ͍ ▸ CIͷηοτΞοϓʹ͍ͭͯRNͰͷݟ͕গͳͯͭ͘Β͍ 10
·ͱΊ ▸ RNͰͷΞϓϦ։ൃWebͷ։ൃΛ͍ͯ͠Δײ֮ʹۙ͘WebΤϯδχΞͷ ํ͕ೃછΈͦ͢͏͕ͩɺiOS / Androidͷݟ͠͠ඞཁʹͳΔ ▸ Ͳ͏͍͏࣌ʹ͍͍ͯΔͷ͔ ▸ ྆OSΛͱʹ͔͘ૣ͘6ׂఔͷͰ࡞ΔʹRNͷํ͕ѹతʹૣ
͍ ▸ ҰํͷϓϥοτϑΥʔϜ͚ͩΞϓϦΛ࡞ΔͳΒෆ͖ 11