1# JS UI Framework<a name="EN-US_TOPIC_0000001125689015"></a>
2
3-   [Introduction](#section11660541593)
4-   [Directory Structure](#section1464106163817)
5-   [Available APIs](#section1096322014288)
6-   [Usage](#section1096366014288)
7-   [Repositories Involved](#section11683135113011)
8
9## Introduction<a name="section11660541593"></a>
10
11The JS UI framework is a set of JS-UI frameworks provided for you to develop OpenHarmony applications on mini system. The following figure shows the framework architecture.
12
13**Figure  1**  Framework architecture<a name="fig11520531310"></a>
14
15![](figures/framework-architecture.png "framework-architecture")
16
17The JS UI framework consists of the JavaScript data binding framework, JavaScript runtime, and JavaScript framework.
18
19-   **JavaScript data binding framework**
20
21    Provides a set of basic data binding capabilities through JavaScript.
22
23
24-   **JavaScript runtime**
25
26    Supports parsing and execution of JavaScript code.
27
28
29-   **JavaScript framework**
30
31    Provides the framework mechanism of JavaScript APIs and components through the C++ language.
32
33
34## Directory Structure<a name="section1464106163817"></a>
35
36The source code of the framework is stored in  **/foundation/arkui/arkui\_ace\_engine\_lite**. The directory structure is as follows:
37
38```
39/foundation/arkui/arkui_ace_engine_lite
40├── frameworks         # Framework code
41│   ├── common         # Common kits
42│   ├── examples       # Sample code
43│   ├── include        # Header files
44│   ├── module_manager # JS module manager
45│   ├── native_engine  # JS engine adapter
46│   ├── packages       # JavaScript implementation
47│   ├── src            # Source code
48│   ├── targets        # Configuration files of target devices
49│   └── tools          # Tool code
50├── interfaces         # APIs exposed externally
51│   └── innerkits      # Header files for internal subsystems
52│       └── builtin    # JavaScript third-party module APIs exposed by the JS UI framework
53└── test               # Test cases
54```
55
56## Available APIs<a name="section1096322014288"></a>
57
58For details about the APIs, see the  [JS Application Development](https://device.harmonyos.com/en/docs/apiref/js-framework-file-0000000000616658).
59
60
61
62## Usages<a name="section1096366014288"></a>
63
64- Application Development
65
66  Please refer to [Visual Application Development](https://docs.openharmony.cn/pages/v3.1/en/device-dev/guide/device-camera-visual-overview.md/) for more application development details.
67
68- Framework Development
69
70  For development action on the JS UI framework itself,  please refer to [The Framework Debugging Tool](https://gitee.com/openharmony/arkui_ace_engine_lite/blob/master/frameworks/tools/qt/simulator/README_zh.md), this tool provides one small PC simulator debugging environment, which can be used for framework code development.
71
72
73
74## Repositories Involved<a name="section11683135113011"></a>
75
76**arkui_ace_engine_lite**
77
78