diff --git a/docs/en/Getting-Started-React-Native.md b/docs/en/Getting-Started-React-Native.md index 54c09014a5..0d7aa3a29c 100644 --- a/docs/en/Getting-Started-React-Native.md +++ b/docs/en/Getting-Started-React-Native.md @@ -1,9 +1,10 @@ -````json +```json //[doc-params] { - "Tiered": ["No", "Yes"] + "Tiered": ["No", "Yes"] } -```` +``` + # Getting Started with the React Native ABP platform provide basic [React Native](https://reactnative.dev/) startup template to develop mobile applications **integrated to your ABP based backends**. @@ -50,17 +51,17 @@ A React Native application running on an Android emulator or a physical phone ** {{ if Tiered == "No"}} ![React Native host project local IP entry](images/rn-host-local-ip.png) -- Open the `appsettings.json` file in the `.HttpApi.Host` folder. Replace the `localhost` address on the `SelfUrl` and `Authority` properties with your local IP address. -- Open the `launchSettings.json` file in the `.HttpApi.Host/Properties` folder. Replace the `localhost` address on the `applicationUrl` properties with your local IP address. +- Open the `appsettings.json` file in the `.HttpApi.Host` folder. Replace the `localhost` address on the `SelfUrl` and `Authority` properties with your local IP address. +- Open the `launchSettings.json` file in the `.HttpApi.Host/Properties` folder. Replace the `localhost` address on the `applicationUrl` properties with your local IP address. {{ else if Tiered == "Yes" }} ![React Native tiered project local IP entry](images/rn-tiered-local-ip.png) -- Open the `appsettings.json` file in the `.AuthServer` folder. Replace the `localhost` address on the `SelfUrl` property with your local IP address. -- Open the `launchSettings.json` file in the `.AuthServer/Properties` folder. Replace the `localhost` address on the `applicationUrl` properties with your local IP address. -- Open the `appsettings.json` file in the `.HttpApi.Host` folder. Replace the `localhost` address on the `Authority` property with your local IP address. -- Open the `launchSettings.json` file in the `.HttpApi.Host/Properties` folder. Replace the `localhost` address on the `applicationUrl` properties with your local IP address. +- Open the `appsettings.json` file in the `.AuthServer` folder. Replace the `localhost` address on the `SelfUrl` property with your local IP address. +- Open the `launchSettings.json` file in the `.AuthServer/Properties` folder. Replace the `localhost` address on the `applicationUrl` properties with your local IP address. +- Open the `appsettings.json` file in the `.HttpApi.Host` folder. Replace the `localhost` address on the `Authority` property with your local IP address. +- Open the `launchSettings.json` file in the `.HttpApi.Host/Properties` folder. Replace the `localhost` address on the `applicationUrl` properties with your local IP address. {{ end }} @@ -74,7 +75,7 @@ Open the {{ if Tiered == "No" }}`MyProjectNameHttpApiHostModule`{{ else if Tiere ```csharp #if DEBUG - PreConfigure(options => + PreConfigure(options => { options.UseAspNetCore() .DisableTransportSecurityRequirement(); @@ -108,12 +109,21 @@ Open the {{ if Tiered == "No" }}`MyProjectNameHttpApiHostModule`{{ else if Tiere In the above image, you can start the application with an Android emulator, an iOS simulator or a physical phone by scanning the QR code with the [Expo Client](https://expo.io/tools#client) or choosing the option. +### Expo + ![React Native login screen on iPhone 11](images/rn-login-iphone.png) +### Android Studio + +1. Start the emulator in **Android Studio** before running the `yarn start` or `npm start` command. +2. Press **a** to open in Android Studio. + +![React Native login screen on iPhone 11](images/rn-login-android-studio.png) + Enter **admin** as the username and **1q2w3E\*** as the password to login to the application. The application is up and running. You can continue to develop your application based on this startup template. ## See Also -- [React Native project structure](./Startup-Templates/Application#react-native) +- [React Native project structure](./Startup-Templates/Application#react-native) diff --git a/docs/en/Tutorials/images/bookstore-appservice-tests.png b/docs/en/Tutorials/images/bookstore-appservice-tests.png index 40feffb8f6..276c616cac 100644 Binary files a/docs/en/Tutorials/images/bookstore-appservice-tests.png and b/docs/en/Tutorials/images/bookstore-appservice-tests.png differ diff --git a/docs/en/images/rn-login-android-studio.png b/docs/en/images/rn-login-android-studio.png new file mode 100644 index 0000000000..4386e95268 Binary files /dev/null and b/docs/en/images/rn-login-android-studio.png differ diff --git a/modules/cms-kit/src/Volo.CmsKit.Common.Web/wwwroot/cms-kit/dummy-placeholder-1280x720.png b/modules/cms-kit/src/Volo.CmsKit.Common.Web/wwwroot/cms-kit/dummy-placeholder-1280x720.png index 0563548ea9..90e35fa33e 100644 Binary files a/modules/cms-kit/src/Volo.CmsKit.Common.Web/wwwroot/cms-kit/dummy-placeholder-1280x720.png and b/modules/cms-kit/src/Volo.CmsKit.Common.Web/wwwroot/cms-kit/dummy-placeholder-1280x720.png differ diff --git a/modules/cms-kit/src/Volo.CmsKit.Common.Web/wwwroot/cms-kit/dummy-placeholder-320x180.png b/modules/cms-kit/src/Volo.CmsKit.Common.Web/wwwroot/cms-kit/dummy-placeholder-320x180.png index 05ce8f1cc3..8a3d2f36e3 100644 Binary files a/modules/cms-kit/src/Volo.CmsKit.Common.Web/wwwroot/cms-kit/dummy-placeholder-320x180.png and b/modules/cms-kit/src/Volo.CmsKit.Common.Web/wwwroot/cms-kit/dummy-placeholder-320x180.png differ