Buy @ Amazon

Dev Setup of Expo for React Native Development

on

When you do React Native development using Expo framework there are three ways you can see your development works on your Android device or emulators, depending on how you connect to the Expo development server. 

Note : The one commonality is that you use an Expo-Client on your Android/ios device/emulator to talk to the development server.

Note : The pictures below consider WSL2 on Windows 10 as development environment where Expo server is running. This is purely for representational purpose, and the concepts apply irrespective of your dev env where Expo server is running.

1. Connect using Localhost


  • There is no iOS simulator on Windows. That said, if your dev env is Mac, you could have Expo server running along side ios and Android emulators on the same machine.
  • When you have both the server and the client running on the same host, the best approach to connect them is through localhost.


2. Connect using LAN

  • If you hate emulators/simulators like I do and wish to use the device for development purpose as well, you could well connect the server and the mobile device when they are on the same network. For this make sure you connect your mobile device Wi-Fi to the same network that your laptop is connected to. The is ideal and super fast.
  • When using WSL 2 on Windows, though, I wasn't able to get this set-up working (see my other post on this subject). If you are like me stuck in this, the next option that is available is to make use of Tunneling option.

3. Connect using Tunnel

  • Tunneling is the slowest of the options, because you go through the internet to connect two devices that are literally close to each other.
  • When everything else fails, this is still there for your rescue. Here you leverage the Expo's platform to ship development code to client device for testing using the url that it exposes in the dev-server.
  • This option is also cool when you want to showcase your development work in progress to your clients or other stakeholders as you work through something to get their feedback. Call it Agile, if you wish to ;)