/ /
G e t
R e a d y
i m p o r t
{
C o o l ,
S t u f f
}
f r o m
' r e a c t
n a t i v e '
A presentation at React Finland in April 2018 in Helsinki, Finland by Gant Laborde
/ /
G e t
R e a d y
i m p o r t
{
C o o l ,
S t u f f
}
f r o m
n a t i v e '
T he Organizers T he Organizers
A.K.A. Chie f Technology S tr a tegis t Chie f Technology S tr a tegis t
'\x47'[0]+(![]+[])[+!+[]]+([]+[][[]])[+!+ []]+String.fromCharCode((2<<6)12) J a v a Scrip t J a v a Scrip t
React Na tive React Na tive Lots and lots of React Native
https://github.com/GantMan/useless-things
I nfin i t e
R e d @GantLabor de @infinite_r ed
Ignite Ignite with React Na tive with React Na tive
�� �� @gantlabor de / #r eactfinland
� �
C oding Spectrum C oding Spectrum
Mobile Mobile de velopmen t de velopmen t w as w as ... ...
Wha t people think I did... Wha t people think I did...
Wha t web de v s used t o Wha t web de v s used t o think I do... think I do...
Wha t I used t o do... Wha t I used t o do...
$169,562.00 USD a year! $169,562.00 USD a year!
Befor e After Freedom! Freedom!
T he I n finite Red Team T he I n finite Red Team 26 people. 8 Cities.
Open S ource Open S ource Paying it forwar d in the community
? ?
� � � � Make it be tter? Make it be tter?
Andr oid? Andr oid?
� � LG TM! LG TM!
HELL O W ORLD ...
The JavaScript domain is too vast T o find a be tter solution, ask: T o find a be tter solution, ask: "Why is there a pr oblem? "Why is there a pr oblem?
Ignite Ignite Our appr oach to a pr oblem that ' s all too familiar.
We use this! We use this! This is ho w we deliver pr oducts
Yes, e ven Windo w s Yes, e ven Windo w s
J u s t K i d d i n g !
C an't C an't ca tapult? ca tapult? W e help you climb
M o d ul a r i t y M o d ul a r i t y Connecting Str angers
c o n s t
N P M _ M O D U L E _ N A M E
=
i c o n s '
c o n s t
E X A M P L E _ F I L E
=
' v e c t o r E x a m p l e . j s . e j s '
/ * *
A d d
o u r s e l f
t o
t h e
p r o j e c t .
/
c o n s t
a d d
=
a s y n c
f u n c t i o n
( c o n t e x t )
{
c o n s t
{
i g n i t e
}
=
c o n t e x t
/ /
i n s t a l l
a
n p m
m o d u l e
a w a i t
i g n i t e . a d d M o d u l e ( N P M _ M O D U L E _ N A M E ,
{
v e r s i o n :
' 4 . 3 . 0 ' ,
l i n k :
t r u e
} )
/ /
c o p y
t h e
e x a m p l e
f i l e
( i f
e x a m p l e s
a r e
t u r n e d
o n )
a w a i t
i g n i t e . a d d P l u g i n C o m p o n e n t E x a m p l e ( E X A M P L E _ F I L E ,
{
t i t l e :
' V e c t o r
I c o n s '
} )
}
/ * *
R e m o v e
o u r s e l f
f r o m
t h e
p r o j e c t .
/
c o n s t
r e m o v e
=
a s y n c
f u n c t i o n
( c o n t e x t )
{
c o n s t
{
i g n i t e
}
=
c o n t e x t
/ /
r e m o v e
t h e
n p m
m o d u l e
a w a i t
i g n i t e . r e m o v e M o d u l e ( N P M _ M O D U L E _ N A M E ,
{
u n l i n k :
t r u e
} )
/ /
r e m o v e
t h e
c o m p o n e n t
e x a m p l e
a w a i t
i g n i t e . r e m o v e P l u g i n C o m p o n e n t E x a m p l e ( E X A M P L E _ F I L E )
}
/ * *
E x p o s e
a n
i g n i t e
p l u g i n
i n t e r f a c e .
/
m o d u l e . e x p o r t s
=
{
a d d ,
r e m o v e
}
Import the code
Pr o vide an Example
Pr o vide Gener ators T he T he "He y, c ould y ou "He y, c ould y ou
help me?" help me?" e xperience e xperience
� ♂ � ♂
An e x ample? An e x ample?
A fun, ne w way to send unique te xt-art to your friends
Favorite your most used te xtables for easy acces Te xtables Te xtables
https://github.com/O T GApps/T e xtables All the Original C ode All the Original C ode
� �
T hank y ou Ignite f or T hank y ou Ignite f or making such an making such an a wesome CLI a wesome CLI
@tillersystems
https://medium.com/r eact-finland/r eact- finland-app-what-is-it-and-ho w-we-built-it- 273b34144b69
Annnnnnd Another
https://github.com/infiniter ed/ChainReactApp C on ference App C on ference App
T ake T ha t! T ake T ha t!
More Video s A v ailable More Video s A v ailable youtube.com/infiniter ed
� �
T he F uture? T he F uture?
Storybook
T ypeScript
Solidarity
MobX-State- T r ee
Mor e Reactotr on Ignite B o w ser Ignite B o w ser
s t a g e d
W e can 't limit your plugins
Each pr oject can have customizations
Use your o wn boilerplate! Ignite Ec o s y s tem Ignite Ec o s y s tem
github.com/GeekyAnts/ignite-native-base-boilerplate
github.com/infiniter ed/ignite/blob/master/BOILERPLA TES.md
NEW Docs and Videos!
Another Confer ence App
What
a r e yo u
g o n n a
d o ? R e a s o n
B o i l e r pl a t e ? G r a phQL B o i l e r pl a t e ? L O L C a t s ?
S te ve Kellock S te ve Kellock Ke vin V angelder Ke vin V angelder Softwar e Engineer Senior Softwar e Engineer @k e vinvangelder @sk ellock Cindy Nguyen Cindy Nguyen J us tin Huske y J us tin Huske y Design Lead Designer @justinhusk e y Special T hank s t o: Special T hank s t o: @cindythuyvan
ReactNativeNe wsletter.com W an t More React Na tive? W an t More React Na tive?
https://github.com/ReactNativeNe ws/React-Native-Apps J us t w an t c ode? J us t w an t c ode?
C on ferences C on ferences
C on ferences C on ferences Discount code - FINLANDCR18
Learn More Learn More Join our Slack: community .infinite.r ed
Read our Medium blog: shift.infinite.r ed
T alk to me! (medium/twitter/life)
T hank y ou, I n finite Red T hank y ou, I n finite Red T odd Werth T odd Werth Founder & CEO Ken Miller Ken Miller Founder & CFO/CT O @seriousk en J amon Holmgren J amon Holmgren Founder & C OO
@ twerth @ jamonholmgren
I n S umma tion I n S umma tion R e a c t N a tiv e
is
E a s y
( n o w) G iv e
I g n ite
a
T r y T we e t a t me
a n d
m y
b o s s e s R e a d
a b o u t R e a c t
N a t iv e
o n
M e d iu m R e a c tN a tiv e . c c
N e ws le t t e r J o in
o u r
C o mmu n it y !
C on tribut or s! C on tribut or s! https://github.com/infiniter ed/ignite 7 , 7 5 0 +
S t a r s
o n
G i t H u b � 8 7
C o n t r i bu t o r s A w e s o me f e e dba ck!
@GantLabor de T hank s, ReactFinland! T hank s, ReactFinland! Slides: https://slides.com/gantlabor de/bo wser/
