Update docs (19756)

Signed-off-by: Nester.zhou <ester.zhou@huawei.com>

en/application-dev/quick-start/start-overview.md

@@ -29,8 +29,9 @@ The application model is the abstraction of capabilities required by OpenHarmony
 
 Along its evolution, OpenHarmony has provided two application models:
 
-- Feature Ability (FA) model. This model is supported by OpenHarmony API version 7 and 8. It is no longer recommended. For details about development based on the FA model, see [FA Model Development Overview](../application-models/fa-model-development-overview.md).
-- Stage model. This model is supported since OpenHarmony API version 9. It is recommended and will evolve for a long time. In this model, classes such as **AbilityStage** and **WindowStage** are provided as the stage of application components and windows. That's why it is named stage model. For details about development based on the stage model, see [Stage Model Development Overview](../application-models/fa-model-development-overview.md).
+- **Stage model**: This model is supported since API version 9. It is recommended. In this model, classes such as **AbilityStage** and **WindowStage** are provided as the stage of application components and windows. That's why it is named stage model. For details about development based on the stage model, see [Stage Model Development Overview](../application-models/stage-model-development-overview.md). The examples in this document are all based on the stage model.
+
+- **Feature Ability (FA) model**: This model is supported since API version 7. It is no longer recommended. For details about development based on the FA model, see [FA Model Development Overview](../application-models/fa-model-development-overview.md).
 
 For details about the differences between the FA model and stage model, see [Interpretation of the Application Model](../application-models/application-model-description.md).
 
@@ -39,8 +40,8 @@ To help you better understand the preceding basic concepts and application devel
 
 ## Tool Preparation
 
-1. Download the latest version of [DevEco Studio](https://developer.harmonyos.com/cn/develop/deveco-studio).
+1. Download the latest version of [DevEco Studio](../../release-notes/OpenHarmony-v4.0-beta1.md#version-mapping).
 
 2. Install DevEco Studio and configure the development environment. For details, see [Setting Up the Development Environment](https://developer.harmonyos.com/en/docs/documentation/doc-guides-V3/environment_config-0000001052902427-V3).
 
-When you are done, follow the instructions in [Getting Started with ArkTS in Stage Model](start-with-ets-stage.md), [Getting Started with ArkTS in FA Model](start-with-ets-fa.md), and [Getting Started with JavaScript in FA Model](start-with-js-fa.md).
+When you are done, follow the instructions in [Getting Started with ArkTS in Stage Model](start-with-ets-stage.md).

en/application-dev/quick-start/start-with-ets-stage.md

 # Getting Started with ArkTS in Stage Model
 
 
-> **NOTE**
-> 
-> To use ArkTS, your DevEco Studio must be V3.0.0.900 Beta3 or later.
-> 
-> For best possible results, use [DevEco Studio 3.1 Beta2](https://developer.harmonyos.com/cn/develop/deveco-studio) for your development.
-
+>  **NOTE**
+>
+>  To use ArkTS, your DevEco Studio must be V3.0.0.900 Beta3 or later.
+>
+>  In this document, DevEco Studio 4.0 Beta1 is used. You can download it [here](../../release-notes/OpenHarmony-v4.0-beta1.md#version-mapping).
 
 ## Creating an ArkTS Project
 
-1. If you are opening DevEco Studio for the first time, click **Create Project**. If a project is already open, choose **File** > **New** > **Create Project** from the menu bar. On the **Choose Your Ability Template** page, select **Application** (or **Atomic Service**, depending on your project), select **Empty Ability** as the template, and click **Next**.
+The procedure for creating a project varies, depending on whether the API version is later than 9 or not.
+
+The following describes how to create the OpenHarmony projects of API 10 and API 9.
+
+### Creating a Project of API Version 10
+
+1. If you are opening DevEco Studio for the first time, click **Create Project**. If a project is already open, choose **File** > **New** > **Create Project** from the menu bar.
+
+2. On the **Choose Your Ability Template** page, select **Application** (or **Atomic Service**, depending on your project), select **Empty Ability** as the template, and click **Next**.
 
    ![createProject](figures/createProject.png)
 
-2. On the project configuration page, set **Compile SDK** to **9**, **Model** to **Stage**, and retain the default values for other parameters.
+3. On the project configuration page, set **Compile SDK** to **3.1.0(API 9** and retain the default values for other parameters.
 
    ![chooseStageModel](figures/chooseStageModel.png)
 
@@ -25,27 +32,102 @@
    > On the low-code development pages, you can design your application UI in an efficient, intuitive manner, with a wide array of UI editing features.
    >
    > To use the low-code development mode, turn on **Enable Super Visual** on the page shown above.
-   
-3. Click **Finish**. DevEco Studio will automatically generate the sample code and resources that match your project type. Wait until the project is created.
 
-4. After the project is created, in the **entry** > **build-profile.json5** file, change **runtimeOS** under **targets** to **OpenHarmony**, and click **Sync Now** in the upper right corner to start development.
+4. Click **Finish**. DevEco Studio will automatically generate the sample code and resources that match your project type. Wait until the project is created.
+
+5. After the project is created, in the project-level **build-profile.json5** file, move the **compileSdkVersion** and **compatibleSdkVersion** fields from under **app** to under the current **products**. You can identify the current **products** by clicking the ![en-us_image_0000001609333677](figures/en-us_image_0000001609333677.png) icon in the upper right corner of the editing area.
+
+   ![changeToAPI10](figures/changeToAPI10.png)
+
+6. Change the value of **targetSdkVersion** from **9** to **10** and set **runtimeOS** to **OpenHarmony**.
+
+   ![targetSdkVersion](figures/targetSdkVersion.png)
+
+7. Delete the **runtimeOS** configuration from the **targets** field in all module-level **build-profile.json5** files.
+
+   ![deleteRuntimeOS](figures/deleteRuntimeOS.png)
+
+8. Click **Sync Now** and wait until the synchronization is complete. A project of API version 10 is now created.
+
+### Creating a Project of API Version 9
+
+1. If you are opening DevEco Studio for the first time, click **Create Project**. If a project is already open, choose **File** > **New** > **Create Project** from the menu bar.
+
+2. On the **Choose Your Ability Template** page, select **Application** (or **Atomic Service**, depending on your project), select **Empty Ability** as the template, and click **Next**.
+
+   ![createProject](figures/createProject.png)
+
+3. On the project configuration page, set **Compile SDK** to **3.1.0(API 9** and retain the default values for other parameters.
+
+   ![chooseStageModel](figures/chooseStageModel.png)
+
+   > **NOTE**
+   >
+   > You can use the low-code development mode apart from the traditional coding approach.
+   >
+   > On the low-code development pages, you can design your application UI in an efficient, intuitive manner, with a wide array of UI editing features.
+   >
+   > To use the low-code development mode, turn on **Enable Super Visual** on the page shown above.
+
+4. Click **Finish**. DevEco Studio will automatically generate the sample code and resources that match your project type. Wait until the project is created.
+
+5. In the module-level **entry** > **build-profile.json5** file, set **runtimeOS** in **targets** to **OpenHarmony**.
+
+6. Click **Sync Now** and wait until the synchronization is complete. A project of API version 9 is now created.
+
+
+## ArkTS Project Directory Structure (Stage Model, API Version 10)
+
+![en-us_image_0000001364054489](figures/en-us_image_0000001364054489.png)
+
+- **AppScope > app.json5**: application-level configuration information.
+
+- **entry**: OpenHarmony project module, which can be built into an OpenHarmony Ability Package ([HAP](../../glossary.md#hap)).
+  - **src > main > ets**: a collection of ArkTS source code.
+  
+  - **src > main > ets > entryability**: entry to your application/service.
+  
+  - **src > main > ets > pages**: pages included in your application/service.
+  
+  - **src > main > resources**: a collection of resource files used by your application/service, such as graphics, multimedia, character strings, and layout files. For details about resource files, see [Resource Categories and Access](resource-categories-and-access.md#resource-categories).
+  
+  - **src > main > module.json5**: module configuration file. This file describes the global configuration information of the application/service, the device-specific configuration information, and the configuration information of the HAP file. For details, see [module.json5 Configuration File](module-configuration-file.md).
+  
+  - **build-profile.json5**: current module information and build configuration options, including **buildOption** and **targets**.
+  
+  - **hvigorfile.ts**: module-level build script. You can customize related tasks and code implementation in this file.
+
+- **oh_modules**: third-party library dependency information. For details about how to adapt a historical npm project to ohpm, see [Manually Migrating Historical Projects](https://developer.harmonyos.com/cn/docs/documentation/doc-guides-V3/project_overview-0000001053822398-V3#section108143331212).
 
+- **build-profile.json5**: application-level configuration options, including **signingConfigs** and **products**. The **runtimeOS** field in **products** indicates the runtime OS. Its default value is **HarmonyOS**. If you are developing an OpenHarmony application, change the value to **OpenHarmony**.
 
-## ArkTS Project Directory Structure (Stage Model)
+- **hvigorfile.ts**: application-level build script.
+
+## ArkTS Project Directory Structure (Stage Model, API Version 9)
 
 ![en-us_image_0000001364054489](figures/en-us_image_0000001364054489.png)
 
-- **AppScope** > **app.json5**: global configuration of your application.
+- **AppScope > app.json5**: application-level configuration information.
+
 - **entry**: OpenHarmony project module, which can be built into an OpenHarmony Ability Package ([HAP](../../glossary.md#hap)).
   - **src > main > ets**: a collection of ArkTS source code.
+  
   - **src > main > ets > entryability**: entry to your application/service.
+  
   - **src > main > ets > pages**: pages included in your application/service.
+  
   - **src > main > resources**: a collection of resource files used by your application/service, such as graphics, multimedia, character strings, and layout files. For details about resource files, see [Resource Categories and Access](resource-categories-and-access.md#resource-categories).
+  
   - **src > main > module.json5**: module configuration file. This file describes the global configuration information of the application/service, the device-specific configuration information, and the configuration information of the HAP file. For details, see [module.json5 Configuration File](module-configuration-file.md).
-  - **build-profile.json5**: current module information and build configuration options, including **buildOption** and **targets**. Under **targets**, you can set **runtimeOS** to **HarmonyOS** (default) or **OpenHarmony**, depending on the OS of your application.
-  - **hvigorfile.ts**: module-level build script. You can customize related tasks and code implementation.
+  
+  - **build-profile.json5**: current module information and build configuration options, including **buildOption** and **targets**. The **runtimeOS** field in **targets** indicates the runtime OS. Its default value is **HarmonyOS**. If you are developing an OpenHarmony application, change the value to **OpenHarmony**.
+  
+  - **hvigorfile.ts**: module-level build script. You can customize related tasks and code implementation in this file.
+
 - **oh_modules**: third-party library dependency information. For details about how to adapt a historical npm project to ohpm, see [Manually Migrating Historical Projects](https://developer.harmonyos.com/cn/docs/documentation/doc-guides-V3/project_overview-0000001053822398-V3#section108143331212).
-- **build-profile.json5**: application-level configuration information, including the signature and product configuration.
+
+- **build-profile.json5**: application-level configuration information, including the **signingConfigs** and **products** configuration.
+
 - **hvigorfile.ts**: application-level build script.
 
 
@@ -127,7 +209,7 @@
 
       ![secondPage](figures/secondPage.png)
 
-      > **NOTE**
+      >  **NOTE**
       >
       > You can also right-click the **pages** folder and choose **New** > **Page** from the shortcut menu. In this scenario, you do not need to manually configure page routes.
    - Configure the route for the second page: In the **Project** window, choose **entry** > **src** > **main** > **resources** > **base** > **profile**. In the **main_pages.json** file, set **pages/Second** under **src**. The sample code is as follows: