I'm Simon
Software engineer, founder,
React Native enthusiast;
previously engineering at
Facebook, Google/YouTube. @sstur_
Slide 3
Slide 3 text
I'm here today to
talk to about
Expo
Slide 4
Slide 4 text
What is Expo?
Slide 5
Slide 5 text
What is Expo and
why would I use it?
● a set of tooling for RN
● ...like all the stuff that should
be in RN core but isn’t
● Really tho, it’s much more
than that...
● Build services, web support,
online playground, app
runner
Slide 6
Slide 6 text
3.5 yrs ago in Singapore
I gave a talk on Expo at
SingaporeJS back in
2017...
Slide 7
Slide 7 text
OK, 10 things...
in no particular order
Slide 8
Slide 8 text
Build for iOS
without a Mac
1
Slide 9
Slide 9 text
1. Code your app on Windows,
Linux, Chromebook, etc
2. Preview on your physical
iPhone
3. Build using Expo's free build
servers
4. Deploy to TestFlight or App
Store*
Powered by Expo's awesome
(and free) build services.
Slide 10
Slide 10 text
Build a completely
offline app
2
Slide 11
Slide 11 text
No network, no
problem
● Full SQLite database
● File Storage
● Biometric authentication
● Local notifications
Slide 12
Slide 12 text
Build for web...
and desktop apps!
3
Slide 13
Slide 13 text
Web has first-class
support out of the box.
You probably know that Expo
supports web.
but did you know we have:
● Camera Support
● QR Scanning
● GestureHandler
● Dark Mode
● Image Manipulation
● Accelerometer
Slide 14
Slide 14 text
With Expo you
really can
build desktop
apps.
Credit: Expo Blog
Slide 15
Slide 15 text
PR Deploy
Previews
4
Slide 16
Slide 16 text
Get a usable Expo link for every PR
PR Previews
Slide 17
Slide 17 text
Shared Element
Transitions
5
Slide 18
Slide 18 text
What is a shared
element transition?
Credit: @nandorojo
Slide 19
Slide 19 text
What cool stuff can
we make?
Credit: Catalin Miron
Slide 20
Slide 20 text
Expo and React Navigation
include baked-in support for
Shared Elements.
Combined with Reanimated,
you can build really immersive
experiences with this.
Go checkout Catalin's
awesome examples and
courses (and back him on
Patreon).
Slide 21
Slide 21 text
SVG and Lottie
6
Slide 22
Slide 22 text
One of my
favorite tricks:
Import SVG files
directly as
components.
Slide 23
Slide 23 text
No content
Slide 24
Slide 24 text
60fps Animations
with Reanimated
and Gesture Handler
7
Slide 25
Slide 25 text
This topic really deserves a
whole talk of its own.
Reanimated brought high
performance native-accelerated
animations.
Reanimated v2-alpha just
landed in Expo this week.
Reanimated brought to you by:
@kmagiera and Software Mansion
Slide 26
Slide 26 text
Sign in with Apple
8
Slide 27
Slide 27 text
You don't need to
eject from Expo to use
Apple Auth.
It's easy to implement
and a stellar user
experience.
Slide 28
Slide 28 text
Compile-time
branching
9
Slide 29
Slide 29 text
Compile time branching is
built-in and simple:
● .web.js
● .ios.js
● .android.js
● .expo.js
● .electron.js
You can share 95% of code
and branch for each
platform.
Slide 30
Slide 30 text
But there's another trick I
find really useful...
Slide 31
Slide 31 text
1. Set an env var in
your expo start
command.
2. Use a custom entry
point for your
app.json
Slide 32
Slide 32 text
Use the best parts
of Expo...
without using Expo
10
Slide 33
Slide 33 text
Unimodules
Slide 34
Slide 34 text
Last year, Expo announced a
major architecture that splits
each module into a standalone
package that can be used even
in a non-Expo project.
Pull in almost any Expo
module to your bare RN
project.
Slide 35
Slide 35 text
It's also worth noting
that you can use Expo
Web even in a bare
RN project.
In fact, I've used Expo
Web in pure web
projects too.
Slide 36
Slide 36 text
Runners up...
★
Slide 37
Slide 37 text
There are so many great
Expo features that we
haven't even touched on.
Runners up:
● SSR
● ExpoGL
● Background Audio
● Screen Capture
● Face Detector
● Haptics
● Image Manipulation
● Printing
Slide 38
Slide 38 text
Expo unlocks so many exciting things
about mobile, web development.
Slide 39
Slide 39 text
Thanks for Listening
Hit me with some questions.
And find me online →
@sstur_