diff --git a/en/application-dev/quick-start/figures/01.png b/en/application-dev/quick-start/figures/01.png deleted file mode 100644 index 8342856ec6643e20a941187852e6aef3ead11010..0000000000000000000000000000000000000000 Binary files a/en/application-dev/quick-start/figures/01.png and /dev/null differ diff --git a/en/application-dev/quick-start/figures/02.png b/en/application-dev/quick-start/figures/02.png deleted file mode 100644 index eef374a1fd63f2b1e4d72e3323e7f4c23f5705fb..0000000000000000000000000000000000000000 Binary files a/en/application-dev/quick-start/figures/02.png and /dev/null differ diff --git a/en/application-dev/quick-start/figures/04.png b/en/application-dev/quick-start/figures/04.png deleted file mode 100644 index 1190d1e5aa631b12171632d258e4c4fae32e9bba..0000000000000000000000000000000000000000 Binary files a/en/application-dev/quick-start/figures/04.png and /dev/null differ diff --git a/en/application-dev/quick-start/figures/07.png b/en/application-dev/quick-start/figures/07.png deleted file mode 100644 index 17f2b060d300667ff250935b6a37485843e854ce..0000000000000000000000000000000000000000 Binary files a/en/application-dev/quick-start/figures/07.png and /dev/null differ diff --git a/en/application-dev/quick-start/figures/chooseFAModel_ets.png b/en/application-dev/quick-start/figures/chooseFAModel_ets.png new file mode 100644 index 0000000000000000000000000000000000000000..784659f8b0efaf71620d06dd0df5c58d22ac47f4 Binary files /dev/null and b/en/application-dev/quick-start/figures/chooseFAModel_ets.png differ diff --git a/en/application-dev/quick-start/figures/chooseFAModel_js.png b/en/application-dev/quick-start/figures/chooseFAModel_js.png new file mode 100644 index 0000000000000000000000000000000000000000..4d121aa3a9a1e3ba68cc5f70f6944fcfa3cef792 Binary files /dev/null and b/en/application-dev/quick-start/figures/chooseFAModel_js.png differ diff --git a/en/application-dev/quick-start/figures/chooseStageModel.png b/en/application-dev/quick-start/figures/chooseStageModel.png new file mode 100644 index 0000000000000000000000000000000000000000..3125c8ba0591ce0c53344f35fb780eb956601624 Binary files /dev/null and b/en/application-dev/quick-start/figures/chooseStageModel.png differ diff --git a/en/application-dev/quick-start/figures/createProject.png b/en/application-dev/quick-start/figures/createProject.png new file mode 100644 index 0000000000000000000000000000000000000000..7a56a44e0e7f80671b86c521792352db625ccad7 Binary files /dev/null and b/en/application-dev/quick-start/figures/createProject.png differ diff --git a/en/application-dev/quick-start/figures/09.png b/en/application-dev/quick-start/figures/secondPage.png similarity index 100% rename from en/application-dev/quick-start/figures/09.png rename to en/application-dev/quick-start/figures/secondPage.png diff --git a/en/application-dev/quick-start/figures/06.png b/en/application-dev/quick-start/figures/signConfig.png similarity index 100% rename from en/application-dev/quick-start/figures/06.png rename to en/application-dev/quick-start/figures/signConfig.png diff --git a/en/application-dev/quick-start/start-overview.md b/en/application-dev/quick-start/start-overview.md index fd04d4b1e0e2551d2b2885f0314b39204692fc40..deb8f8029bc24a78a362f0babdaf5e85c2e000f3 100644 --- a/en/application-dev/quick-start/start-overview.md +++ b/en/application-dev/quick-start/start-overview.md @@ -41,6 +41,6 @@ To help you better understand the preceding basic concepts and application devel 1. Download the latest version of [DevEco Studio](https://developer.harmonyos.com/cn/develop/deveco-studio). -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/ohos-setting-up-environment-0000001263160443). +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). diff --git a/en/application-dev/quick-start/start-with-ets-fa.md b/en/application-dev/quick-start/start-with-ets-fa.md index c85c215057926bd8078496e61ee356c143d324aa..019490d354b8d7c6b6ff7771065aae1b7534b76c 100644 --- a/en/application-dev/quick-start/start-with-ets-fa.md +++ b/en/application-dev/quick-start/start-with-ets-fa.md @@ -5,18 +5,18 @@ > > To use ArkTS, your DevEco Studio must be V3.0.0.601 Beta1 or later. > -> For best possible results, use [DevEco Studio V3.1.0.100](https://developer.harmonyos.com/cn/develop/deveco-studio) for your development. +> For best possible results, use [DevEco Studio 3.1 Beta2](https://developer.harmonyos.com/cn/develop/deveco-studio) for your development. ## 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 **OpenHarmony** tab of the **Choose Your Ability Template** page, select **Empty Ability** and click **Next**. +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. - ![01](figures/01.png) + ![createProject](figures/createProject.png) 2. In the project configuration page, set **Compile SDK** to **8** or **9** (in the latter case, you also need to set **Model** to **FA**) and **Language** to **ArkTS** and retain the default values for other parameters. - ![02](figures/02.png) + ![chooseFAModel_ets](figures/chooseFAModel_ets.png) > **NOTE** > @@ -27,6 +27,7 @@ > 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. ## ArkTS Project Directory Structure (FA Model) @@ -41,11 +42,9 @@ - **src > main > ets > MainAbility > app.ets**: ability lifecycle file. - **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 > config.json**: 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 [Application Configuration File Overview (FA Model)](application-configuration-file-overview-fa.md). - - **build-profile.json5**: current module information and build configuration options, including **buildOption** and **targets**. + - **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**: application-level configuration information, including the signature and product configuration. - - **hvigorfile.ts**: application-level build script. @@ -291,7 +290,7 @@ You can implement page redirection through the [page router](../reference/apis/j 2. Choose **File** > **Project Structure...** > **Project** > **SigningConfigs**, and select **Automatically generate signature**. Wait until the automatic signing is complete, and click **OK**. See the following figure. - ![06](figures/06.png) + ![signConfig](figures/signConfig.png) 3. On the toolbar in the upper right corner of the editing window, click ![en-us_image_0000001364054485](figures/en-us_image_0000001364054485.png). The display effect is shown in the figure below. diff --git a/en/application-dev/quick-start/start-with-ets-stage.md b/en/application-dev/quick-start/start-with-ets-stage.md index f8408868d046d87cb87b6ae9fddc268612ea768b..d18a01875cf2e52abd45b493f8223c596912276d 100644 --- a/en/application-dev/quick-start/start-with-ets-stage.md +++ b/en/application-dev/quick-start/start-with-ets-stage.md @@ -5,18 +5,18 @@ > > To use ArkTS, your DevEco Studio must be V3.0.0.900 Beta3 or later. > -> For best possible results, use [DevEco Studio V3.1.0.100](https://developer.harmonyos.com/cn/develop/deveco-studio) for your development. +> For best possible results, use [DevEco Studio 3.1 Beta2](https://developer.harmonyos.com/cn/develop/deveco-studio) for your development. ## 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 **OpenHarmony** tab of the **Choose Your Ability Template** page, select **Empty Ability** and click **Next**. +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. - ![01](figures/01.png) + ![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. - ![07](figures/07.png) + ![chooseStageModel](figures/chooseStageModel.png) > **NOTE** > @@ -28,22 +28,24 @@ 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. + ## ArkTS Project Directory Structure (Stage Model) ![en-us_image_0000001364054489](figures/en-us_image_0000001364054489.png) +- **AppScope** > **app.json5**: global configuration of your application. - **entry**: OpenHarmony project module, which can be built into an OpenHarmony Ability Package ([HAP](../../glossary.md#hap)). +- **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). - **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. - + - **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**: application-level configuration information, including the signature and product configuration. - - **hvigorfile.ts**: application-level build script. @@ -123,7 +125,7 @@ - Create the second page file: In the **Project** window, choose **entry** > **src** > **main** > **ets**. Right-click the **pages** folder, choose **New** > **ArkTS File**, name the page **Second**, and click **Finish**. Below is the structure of the **Second** folder. - ![09](figures/09.png) + ![secondPage](figures/secondPage.png) > **NOTE** > @@ -281,7 +283,7 @@ You can implement page redirection through the [page router](../reference/apis/j 2. Choose **File** > **Project Structure...** > **Project** > **SigningConfigs**, and select **Automatically generate signature**. Wait until the automatic signing is complete, and click **OK**. See the following figure. - ![06](figures/06.png) + ![signConfig](figures/signConfig.png) 3. On the toolbar in the upper right corner of the editing window, click ![en-us_image_0000001364054485](figures/en-us_image_0000001364054485.png). The display effect is shown in the figure below. diff --git a/en/application-dev/quick-start/start-with-js-fa.md b/en/application-dev/quick-start/start-with-js-fa.md index d854f1a024362a31082c3c9ade34374b654ea84d..abb27d9fb942a406e22d98285626984bdc63d197 100644 --- a/en/application-dev/quick-start/start-with-js-fa.md +++ b/en/application-dev/quick-start/start-with-js-fa.md @@ -3,18 +3,18 @@ > **NOTE** > -> For best possible results, use [DevEco Studio V3.0.0.993](https://developer.harmonyos.com/cn/develop/deveco-studio#download) for your development. +> For best possible results, use [DevEco Studio 3.1 Beta2](https://developer.harmonyos.com/cn/develop/deveco-studio#download) for your development. ## Creating a JavaScript 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 **OpenHarmony** tab of the **Choose Your Ability Template** page, select **Empty Ability** and click **Next**. +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. - ![01](figures/01.png) + ![createProject](figures/createProject.png) 2. In the project configuration page, set **Compile SDK** to **8** or **9** (in the latter case, you also need to set **Model** to **FA**) and **Language** to **JS** and retain the default values for other parameters. - ![04](figures/04.png) + ![chooseFAModel_js](figures/chooseFAModel_js.png) > **NOTE** > @@ -26,6 +26,8 @@ 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. + ## JavaScript Project Directory Structure @@ -40,7 +42,7 @@ - **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 Limitations and Access](../ui/js-framework-resource-restriction.md). - **src > main > config.json**: 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 [Application Configuration File Overview (FA Model)](application-configuration-file-overview-fa.md). - - **build-profile.json5**: current module information and build configuration options, including **buildOption** and **targets**. + - **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**: application-level configuration information, including the signature and product configuration. @@ -226,7 +228,7 @@ You can implement page redirection through the [page router](../reference/apis/j 2. Choose **File** > **Project Structure...** > **Project** > **Signing Configs**, and select **Automatically generate signature**. Wait until the automatic signing is complete, and click **OK**. See the following figure. - ![06](figures/06.png) + ![signConfig](figures/signConfig.png) 3. On the toolbar in the upper right corner of the editing window, click ![en-us_image_0000001364054485](figures/en-us_image_0000001364054485.png). The display effect is shown in the figure below.