# How do I create my first ArkTS app in DevEco Studio?

> Create, understand and run a Hello World app with ArkTS and ArkUI in DevEco Studio: project template, directory structure, Index.ets code, signing and running on a device.

Source: https://ohosify.com/en/blog/first-arkts-app
Published: 2026-10-01

**Short answer:** In DevEco Studio, create a new project with the **Application > Empty Ability** template, open `entry/src/main/ets/pages/Index.ets`, and click **Run** after selecting a device or emulator. The template already contains a working Hello World page written in ArkTS and ArkUI.

## What do you need first?

- DevEco Studio, installed. See [How to install DevEco Studio](/en/blog/install-deveco-studio).
- A target: an emulator, or a connected device with developer mode enabled.

## How do I create the project?

1. Open DevEco Studio and create a new project.
2. Select **Application**, then the **Empty Ability** template.
3. Fill in the project fields: project name, Bundle name (the defaults are fine for a first app), Compatible SDK (for example `5.0.0(12)`) and the model, **Stage**.
4. Finish and wait for the project to sync.

Note: since DevEco Studio 4.1 Beta1, a new project is created for HarmonyOS by default. To target OpenHarmony, change the project-level `build-profile.json5`:

```json
"compileSdkVersion": 12,
"compatibleSdkVersion": 12,
"runtimeOS": "OpenHarmony"
```

## What is in the project directory?

| Path | Purpose |
|---|---|
| `AppScope/app.json5` | Application-level configuration |
| `entry/src/main/ets/entryability` | The application entry point |
| `entry/src/main/ets/pages` | Page files, such as `Index.ets` |
| `entry/src/main/resources` | Images, media, strings and layout resources |
| `entry/src/main/module.json5` | Module configuration |
| `entry/build-profile.json5` | Module build options |
| `oh_modules` | Installed dependencies |
| `hvigorfile.ts` | Build script |

## What does Index.ets contain?

The template creates a page with a text and a button that navigates to a second page. The simplest version of it is:

```ts
@Entry
@Component
struct Index {
  @State message: string = 'Hello World';

  build() {
    Row() {
      Column() {
        Text(this.message)
          .fontSize(50)
          .fontWeight(FontWeight.Bold)
      }
      .width('100%')
    }
    .height('100%')
  }
}
```

`@Entry` makes this page an entry, `@Component` declares a UI component, `@State` makes `message` reactive and `build()` describes the UI. Change `'Hello World'` to your own text and run again to see the update. Details: [What is ArkTS?](/en/blog/what-is-arkts).

## How do I run the app?

1. Connect a device (or start the emulator). To check that the device is visible, see the [hdc command guide](/en/blog/hdc-command-guide).
2. For a physical device, enable automatic signing in **File > Project Structure > SigningConfigs**.
3. Select the device in the toolbar and click the **Run** button.

Menu names can change between DevEco Studio versions, so use the [official tutorial](https://github.com/openharmony/docs) if a menu looks different.

## Next steps

- [What is ArkTS?](/en/blog/what-is-arkts)
- [hdc command guide](/en/blog/hdc-command-guide)
- [OpenHarmony vs HarmonyOS](/en/blog/openharmony-vs-harmonyos)