Make app template use ReactNativeHost

[asklar]

When we discussed #4925 we mentioned that having the template use ReactApplication adds friction when a developer realizes that they want to add some XAML content to their app since ReactApplication doesn't allow this (it doesn't preclude it, you don't get a crash/exception, it just doesn't work).

This issue tracks replacing the use of ReactApplication in the app project template so that it uses ReactNativeHost instead and it's easier to move between pure RN and mix of RN and XAML

[vmoroz]

@asklar it would be nice if we just fix the ReactApplication and ReactRootView to allow such scenarios. Making another app templates would make the app creation unnecessary complex. If you could explain what is missing/wrong with the current code, then I can fix it. But ideally, it should be done by someone who has good understanding of XAML framework (I don't).

[asklar]

Spoke to @vmoroz today and explained the problem in more detail. Here's the design we arrived to:

• It should be easy and clear to move from a pure RN app (default) to a mix.
• The app templates should include a MainPage.xaml / MainPage.xaml.cs or MainPage.xaml.cpp just like any other UWP XAML app. The App.xaml.cs should be the same as what gets generated for a UWP xaml app (creates a frame, calls Navigate on MainPage)
• MainPage.xaml will have a ReactRootView in there at the top level. This allows the app developer to reposition the react content wherever they see fit. This also decouples the app from a specific react root view or main component.
• ReactApplication can still exist but have its functionality simplified - it should not be in charge of creating the root view on behalf of the app if it's being created by the app's app object.
• ReactApplication properties should be renamed to make them more discoverable (e.g. JavascriptComponentName instead of ComponentName)
• The ReactRootView can bind its host to the app's ReactNativeHost .
• As much as possible, the linkage between ReactRootView and the app and host should be done in markup

[vmoroz]

@asklar, thank you for the summary!
I wonder what is going to be left from the ReactApplication after we put back to App.xaml.cs the usual UWP xaml app content. I guess the only justification for it to exist is to have a single place to configure a simple RN-only apps. The other part is the support for the application activation patterns and the connection with the Linking native module.

BTW, just a small note about the names: I think we should use term JavaScript instead of Javascript. E.g. see https://stackoverflow.com/questions/3989731/is-it-javascript-or-javascript .
Another alternative is to use term React. E.g. ReactComponentName or ReactAppComponentName. The App could make sense because the component is usually registered in the AppRegistry, e.g. AppRegistry.registerComponent('SampleApp', () => SampleApp);