Why should you try Expo
Tags: tutorial
Published: 2021-04-17 20:56:00


> I remember Expo when it was far from ideal, not so many features were implemented and some of them were not properly working, but…


A few months ago I’ve started a new project from scratch using the Expo.io platform, it was the decision of my client.

> 
He said, “We can’t spend time to build ReactNative anymore, we need a power burst!”. Of course, he was ready to cut some functional which will require native dependency.

The Expo is a great platform and if you have never tried or you have experience with old versions you probably should try it.

## Development process
Each time when you need to run the application on a real device you just need to scan QR-Code from the terminal or if you would like to run on iOS Simulator/Android Emulator just use hotkeys, this feature extremely speed up your development.

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1618430160520/t3PDW-L2q.png)

Built-in **Expo Developer Tools** which you can easily invoke by pressing the “D” key in the terminal window.

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1618430174152/8UQvHaGa_.png)

Also, you have other shortcuts like:
- “I” — Runs the application on iOS Simulator.
- “A” — Runs the application on the Android Device/Emulator.
- “C” — Shows QR-Code to scan from real-device.
- “P” — Switches to production mode.
- “R” — When you need to restart bundler.

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1618430196172/03rKuX0iQ.png)

Of course, the same actions you can do in the Expo Developer Tools window.

## How to init project?
First of all, forget about native development at all!
Then you will need to initialize the project, there are few options:

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1618430229553/6W5C5yhRu.png)

You can use a specific template: “blank”, “tabs”, “bare-minimum”, set package manager “yarn” or “npm”, also you can set up package name and bundle identifier.

But the cherry on the pie: initialize a project with TypeScript support.

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1618430259904/4lt3jX6yj.png)

Once you complete the initialization wizard, you can start development or run the application with the command yarn start it will start bundler and Expo server also you will see the Expo Developer Tools window.

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1618430277195/uKuwaZzyq.png)

Here we go! Just press “I” to run the application on iOS Simulator.

![1_P4bPsvJji-Mb0Nnj_QTs1w.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1618430314906/hnfpeu4f7.png)

![1_7lXFp4xR8Z9s67tzwLKZqg.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1618430318646/fTJDtSQ6m.png)

![1_oTHtnBiW5aM7FT5TbYNe6A.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1618430324217/VUwiQidzy.png)

Now you see that starting project is pretty simple!

## Expo SDK
Of course, if want to use an exotic library in the Expo project you be faced with a support problem, but I’m sure that Expo SDK cools down your desire to write on ReactNative.

### Let’s start with simple then come to hard
Expo has a lot of already integrated libraries which is ordinarily used in most applications, just look into Expo API Documentation.

*In common cases, you will need:*
**SplashScreen** — to make a splash screen to indicate application launching
**AppLoading** — to load assets/fonts/etc.
**Localization** — to manage l10n/i18n of your application
**ImagePicker/ImageManipulator** — Open/edit images or videos from the device
**MapView** — to use maps in the app
**Sharing** — to share data between applications in the device
**SecureStore** — to persist data to the storage on the device

*You would like to use, also:*
**AppAuth, AuthSession** — to authenticate a user via OAuth
**BlurView** — to make a blur effect on the views
**Camera** — to capture a photo or video
**Haptics** — which provides vibration on Android and use Haptic Engine on the iOS **Devices**
**KeepAwake** — to keep the screen on while the user working with a part of the app
**ScreenOrientation** — to detect and handle changing the orientation of the screen

*Expo supports extra features like:*
Notifications — Push Notifications (works through the Expo Push service)
Branch — integration with branch.io
Admob — Google AdMob SDK
FacebookAds — Facebook Audience SDK
Amplitude — Amplitude mobile analytics

*Also, you will have access to exotic:*
ART — draw using SVG
Audio — Play/record sounds
AV — Play audio/video content
BackgroundFetch — Run background tasks
Brightness — Manage brightness
Payments — Payments through the Stripe with (ApplePay, AndroidPay)

In general, there are about 80 API which you can use once you installed it using the yarn/npm/expo without closing bundler, it’s one more thing to speed up your development.

### Android X64
Developers who are faced with upgrading ReactNative knows that is a painful operation and you will haven’t guarantee that all modules will work correctly and your native project will build properly in favor of this Expo SDK supports Android X64 out of the box and upgrade scenario includes only updates a few JS libraries, this will simplify upgrade process to a minimum level of stress.


> 
Just upgrade versions of your libraries in the package.json file and continue fantastic development and make this world better.

## Publishing
When the time is coming to release the application, you will have a new experience in publishing the application to stores, coz you will have a few options.

### Build

```bash
expo build:[ios|android]
```
This command will run building a bundle but not locally it will starts on the server that’s why no needs to have a high-performance Laptop/PC also it’s ok if you are a Windows user coz Xcode you will never need it. So you just make a cup of coffee, relax and wait until the build ends.

![image.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1618430597067/UQz8oRHkJ.png)

As you can see in the screenshot, the build is queued and you can close the terminal without hesitations. Visit the URL below the text “You can monitor the build at” if you need to check the status of the build. On URL you will find a download button that will be active after build success, you also can wait in the terminal and receive a direct link to download the bundle.

### OTA
You don’t need to use frameworks like CodePush to implement update Over-The-Air, the Expo supports OTA out of the box. By default, it works automatically when you publish JS bundle via expo publish to Expo in a specific release channel, also you can configure it in the app.json. In case you want to manage the updating process, you will probably need to use Updates API.

### Upload to Stores
Yeah, that is a good question, coz you will need to upload your product to the store, but do not hurry do it yourself! The best solution to configure expo to do that with the command:

```bash
expo upload:[ios|android]
```

## Conclusion
Nowadays Expo grows up very fast, every month I see new major versions with bug fixing and new features. The development has become easiest and faster than it’s possible on flat ReactNative this fact helps you to be more productive and interested in the development of cross-platform applications.