tsai
/
abp
mirror of https://github.com/abpframework/abp.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

fix: some typos

pull/25600/head
sumeyye 4 months ago
parent
9acf49010c
commit
796a47cfe2
5 changed files with 22 additions and 20 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 12
      docs/en/framework/ui/react-native/index.md
  2. 8
      docs/en/framework/ui/react-native/manual-backend-configuration.md
  3. 12
      docs/en/framework/ui/react-native/running-on-device.md
  4. 8
      docs/en/framework/ui/react-native/running-on-web.md
  5. 2
      docs/en/tutorials/mobile/react-native/index.md

12
docs/en/framework/ui/react-native/index.md
View File

@ -23,7 +23,7 @@ The ABP platform provides a basic [React Native](https://reactnative.dev/) start
> The startup template UI is built with **[NativeWind v4](https://www.nativewind.dev/)** (Tailwind CSS for React Native) on top of a shadcn-inspired neutral palette, with full **light/dark mode** support. See [Styling with NativeWind](styling-with-nativewind.md) for the styling system reference.
<img src="../../../images/react-native-app.gif" alt="React Native MobileEmulator profile" width="420" style="max-width:100%">
<img src="../../../images/react-native-app.gif" alt="React Native startup template running on a mobile emulator" width="420" style="max-width:100%">
## How to Prepare Development Environment
@ -73,10 +73,10 @@ This command creates a solution containing an **Angular** or **MVC** project (de
You can choose how you want to run the mobile app:
| Goal | Documentation |
| ------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------- |
| **Browser testing (fastest)** | [Running on Web](./running-on-web.md) — ABP Studio **Default** profile or Expo Web + HTTPS proxy at `https://localhost:8443` |
| **Emulator, simulator, or physical device** | [Running on Device](./running-on-device.md) — **MobileEmulator** profile or Cloudflare tunnel method (`yarn tunnel:api`) |
| Goal | Documentation |
| ------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Browser testing (fastest)** | [Running on Web](./running-on-web.md) — ABP Studio **Default** profile or Expo Web + HTTPS proxy at `https://localhost:8443` |
| **Emulator, simulator, or physical device** | [Running on Device](./running-on-device.md) — **Pro, non-tiered Monolith:** **MobileEmulator** profile or `yarn tunnel:api`; **Tiered / Microservice:** manual backend setup |
Before running, you may need to install dependencies in the React Native project folder:
@ -85,7 +85,7 @@ Before running, you may need to install dependencies in the React Native project
Run `yarn install` or `npm install` in that folder.
> **Recommended:** We suggest starting with [Running on Web](./running-on-web.md). Because, it requires the fewest setup steps and provides faster developement and hot-reload options compared to the physical device tests.
> **Recommended:** We suggest starting with [Running on Web](./running-on-web.md). Because it requires the fewest setup steps and provides faster development and hot-reload options compared to the physical device tests.
### Related guides

8
docs/en/framework/ui/react-native/manual-backend-configuration.md
View File

@ -29,7 +29,7 @@
> **Prefer simpler options first:**
>
> - Browser testing → [Running on Web](./running-on-web.md) (no backend changes)
> - Non-tiered Monolith on emulator/device → [Running on Device](./running-on-device.md) with `yarn tunnel:api` or the **MobileEmulator** profile
> - Pro, non-tiered Monolith on emulator/device → [Running on Device](./running-on-device.md) with `yarn tunnel:api` or the **MobileEmulator** profile
> React Native does not trust the auto-generated .NET HTTPS certificate. Use **HTTP** during this manual workflow.
@ -119,7 +119,7 @@ Update `react-native/Environment.ts` with your local IP address instead of `loca
}
```
Update `react-native/Environment.ts` with your local IP address. See the image in [Running on Device](./running-on-device.md#manual-cli-without-mobileemulator-profile).
Update `react-native/Environment.ts` with your local IP address, then start Expo as described in [Running on Device](./running-on-device.md).
{{ else if Architecture == "Microservice" }}
@ -241,7 +241,7 @@ Update `react-native/Environment.ts` with your local IP address. See the image i
},
"Language": {
"Destinations": {
"Identity": {
"Language": {
"Address": "http://192.168.1.36:44310/"
}
}
@ -251,7 +251,7 @@ Update `react-native/Environment.ts` with your local IP address. See the image i
}
```
Update `apps/mobile/react-native/Environment.ts` with your local IP address. See the image in [Running on Device](./running-on-device.md#manual-cli-without-mobileemulator-profile).
Update `apps/mobile/react-native/Environment.ts` with your local IP address, then start Expo as described in [Running on Device](./running-on-device.md).
{{ end }}

12
docs/en/framework/ui/react-native/running-on-device.md
View File

@ -63,7 +63,7 @@ For browser testing, see [Running on Web](./running-on-web.md).
### MobileEmulator profile (Recommended)
Monolith solutions include a **MobileEmulator** run profile in the [Solution Runner](../../../studio/running-applications). When you start it, ABP Studio specifically runs:
**Pro, non-tiered Monolith** solutions include a **MobileEmulator** run profile in the [Solution Runner](../../../studio/running-applications). When you start it, ABP Studio specifically runs:
1. The backend host
2. **ReactNativeTunnel** — runs `node scripts/tunnel.js` to expose your local backend through a Cloudflare tunnel
@ -76,7 +76,7 @@ Before the first run:
Start an Android emulator (or connect a device), then start the **MobileEmulator** profile.
<img src="../../../images/rn-mobileEmulator-profile.png" alt="React Native app demo" width="620" style="max-width:100%">
<img src="../../../images/rn-mobileEmulator-profile.png" alt="ABP Studio Solution Runner with MobileEmulator profile selected" width="620" style="max-width:100%">
See [Cloudflare tunnel (manual CLI)](#cloudflare-tunnel-manual-cli) below for what the tunnel script does, and [Automate Localhost Access for Expo](https://abp.io/community/articles/automate-localhost-access-for-expo-a-guide-to-dynamic-7cblqtj3) for architecture details and troubleshooting.
@ -86,7 +86,7 @@ See [Cloudflare tunnel (manual CLI)](#cloudflare-tunnel-manual-cli) below for wh
{{ else }}
> **Note:** The **MobileEmulator** running profile is not included in the microservice template. Follow [Manual Backend Configuration](./manual-backend-configuration.md) and the [manual CLI steps](#manual-cli-without-mobileemulator-profile) below.
> **Note:** The **MobileEmulator** run profile is not included in the microservice template. Follow [Manual Backend Configuration](./manual-backend-configuration.md) and the [manual CLI steps](#manual-cli-without-mobileemulator-profile) below.
{{ end }}
@ -182,10 +182,12 @@ If you are not using the **MobileEmulator** profile, prefer the [Cloudflare tunn
> The React Native application was generated with [Expo](https://expo.io/). Expo is a set of tools built around React Native to help you quickly start an app, and it includes many features.
<img src="../../../images/rn-expo-qr.png" alt="React Native app demo" width="520" style="max-width:100%">
<img src="../../../images/rn-expo-qr.png" alt="Expo CLI showing QR code and platform launch options" width="520" style="max-width:100%">
You can start the application on an Android emulator, an iOS simulator, or a physical phone by scanning the QR code or by choosing the corresponding option in the Expo CLI.
Enter **admin** as the username and **1q2w3E\*** as the password to log in to the application.
### Android Studio
1. Start the emulator in **Android Studio** before running `yarn start`, `yarn android`, or `npm start`.
@ -193,4 +195,4 @@ You can start the application on an Android emulator, an iOS simulator, or a phy
### iOS Simulator
Enter **admin** as the username and **1q2w3E** as the password to log in to the application.
1. Press **i** in the Expo CLI to open the iOS simulator (macOS only).

8
docs/en/framework/ui/react-native/running-on-web.md
View File

@ -68,7 +68,7 @@ Run the **Initialize Solution** task from the **Tasks** tab if you have not alre
### Start the Default profile
When you start the **Default** profile, ABP Studio runs these main application:
When you start the **Default** profile, ABP Studio runs these main applications:
1. The backend host
2. **ReactNative.LocalSslProxy** — terminates HTTPS on **`https://localhost:8443`** and forwards to Expo Web on port `8081`
@ -82,7 +82,7 @@ The solution template already adds `https://localhost:8443` to backend **CorsOri
{{ end }}
You can enter **admin** as the username and **1q2w3E** as the password to log in.
You can enter **admin** as the username and **1q2w3E\*** as the password to log in.
## Manual setup (without ABP Studio)
@ -107,9 +107,9 @@ yarn web
npx local-ssl-proxy --source 8443 --target 8081 --cert localhost.pem --key localhost-key.pem
```
Alternatively, run `yarn create:local-proxy` and set `SOURCE_PORT=8443` if your template uses a different default port since it is safer.
Alternatively, run `yarn create:local-proxy` and set `SOURCE_PORT=8443` if your template uses a different default port.
5. Open **`https://localhost:8443`** in your browser.
1. Open **`https://localhost:8443`** in your browser.
## Next steps

2
docs/en/tutorials/mobile/react-native/index.md
View File

@ -24,7 +24,7 @@ Before implementing UI changes, run the `Acme.BookStore` mobile application and
1. Open the solution in **ABP Studio** and run the **Initialize Solution** task once (creates SSL certificates and other one-time setup).
2. For browser testing, follow [Running on Web](../../../framework/ui/react-native/running-on-web.md) — start the **Default** run profile; ABP Studio opens the app at **`https://localhost:8443`**.
3. For an Android emulator or iOS simulator, follow [Running on Device](../../../framework/ui/react-native/running-on-device.md) — switch to the **MobileEmulator** run profile, update `react-native/Environment.ts`, and start the profile (or run `yarn tunnel:api` manually).
3. For an Android emulator or iOS simulator, follow [Running on Device](../../../framework/ui/react-native/running-on-device.md). The sample is a **Pro, non-tiered Monolith** solution — switch to the **MobileEmulator** run profile, update `react-native/Environment.ts`, and start the profile (or run `yarn tunnel:api` manually). For **Tiered** or **Microservice** solutions, use the manual backend steps in that guide instead.
See the [React Native overview](../../../framework/ui/react-native/index.md) for environment setup and project creation.

Write Preview
Loading…
Cancel
Save