How to reload in the Android emulator window when developing React Native Apps?

Question

When developing React Native Apps, I'm following the Getting Started steps at https://facebook.github.io/react-native/docs/getting-started.html#content and have reached the point of modifying the source file and reloading.

"Double tap R on your keyboard to reload, Shake or press menu button for dev menu".

Double tap R - where? The only reasonable place seems to be in the Android emulator window. When I do it there, nothing at all happens. I also tried it in the cmd window which is running the packager - nothing happened.

I see no way to "shake" the emulator.

Press menu button for dev menu - the only thing which looks like a menu button, on a toolbox looking sidebar beside the emulator (three dots), opens an Extended Controls window, which has no Reload button.

Feeling really stupid since I can't make it through Getting Started without getting stuck.

Host is Windows 7.

How to reload in the default Android emulator for react native app says ctrl-R, but that didn't work for me either.

Answer 1

I think when they say double tap R, they mean on the keyboard within the emulator (i.e., the keyboard for the phone). But I usually reload using the dev menu. I think it would be Ctrl + M for Windows to access that.

Answer 2

When developing React Native Apps, Double Tapping R on your Laptop Keyboard DOES infact work (after you have selected the Android emulator window).

However, you have to double tap R very quickly. If you don't double tap R quickly enough, the App will not reload and nothing will happen.

Steps to reload the App by double tapping R quickly in rapid succession

1. Select the emulator window (e.g., by clicking on it with your laptop mouse).
2. Now, on your Laptop Keyboard, Double tap R very quickly. (Basically press the R key two times very quickly).
3. Low and behold, the App will reload.

NOTE: The above procedure can be used if you have not enabled Live Reloading. You can enable Live reloading as follows (In which case you don't need to do the above to reload the app):

Procedure to enable Live Reloading

1. Click on the emulator window.
2. Type Control M (Or Command M on MAC) and select "Enable Live Reload"
3. Now, whenever you make code changes, the App will be rebuilt and will refresh automatically in the emulator window.

NOTE: Similarly, you can also enable Hot Reloading