learn: instructions for using feathersui-openfl with JS or AS3

_data/sidebar.json

@@ -120,6 +120,8 @@
       "semver",
       "tool-tips",
       "cookbook/index",
+      "use-feathers-ui-with-actionscript-3-adobe-air-flash",
+      "use-feathers-ui-with-javascript",
       "prerelease"
     ]
   },

learn/haxe-openfl/use-feathers-ui-with-actionscript-3-adobe-air-flash.md

@@ -0,0 +1,29 @@
+---
+title: Use Feathers UI with ActionScript 3.0
+sidebarTitle: Use with ActionScript 3.0
+layout: "docs.html"
+---
+
+While Feathers UI is written in the [Haxe programming language](https://haxe.org) and targets [OpenFL](https://openfl.org/), it can be used with [ActionScript 3.0](https://airsdk.dev/docs/development) instead, if you prefer. This allows Feathers UI to be integrated in to AS3 projects that target [Adobe AIR](https://airsdk.dev).
+
+## Installation
+
+Visit the [Feathers UI releases](https://github.com/feathersui/feathersui-openfl/releases) page on GitHub, and look for the _.swc_ file attached to the version of Feathers UI that you want to use. The file name should be in the format _feathersui-openfl-x.y.z.swc_ where _x.y.z_ is replaced by the version number, such as _1.2.0_.
+
+You can add this _.swc_ file to the compiler's **library path**, and the Feathers UI classes will be available in your project.
+
+If using the command line compiler, you'd use the `--library-path` compiler option:
+
+```sh
+mxmlc --library-path+=libs/feathersui-openfl-x.y.z.swc
+```
+
+In the various IDEs that support AS3, you can typically add _.swc_ libraries somewhere in your project or module settings.
+
+Before using any Feathers UI classes, and ideally as soon as possible after your app initializes, run the following code:
+
+```as3
+haxe.initSwc(null);
+```
+
+An ideal place would be in the constructor of your main class. Some things may not work properly if you forget to add this line to your AS3 project.

learn/haxe-openfl/use-feathers-ui-with-javascript.md

@@ -0,0 +1,61 @@
+---
+title: Use Feathers UI with JavaScript in web browsers
+sidebarTitle: Use with JavaScript
+layout: "docs.html"
+---
+
+While Feathers UI and OpenFL are written in the [Haxe programming language](https://haxe.org), both projects are available on the [npm package registry](https://www.npmjs.com/), allowing [JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript) developers to create projects without Haxe.
+
+- [Feathers UI on npm](https://www.npmjs.com/package/feathersui-openfl)
+- [OpenFL on npm](https://www.npmjs.com/package/openfl)
+
+## Installation
+
+### Option 1: Install with npm
+
+In a JavaScript project, you can install Feathers UI using [**npm install**](https://docs.npmjs.com/cli/v10/commands/npm-install). OpenFL will be installed automatically as a dependency.
+
+```sh
+npm install feathersui-openfl
+```
+
+### Option 2: Load from a CDN
+
+If you prefer, you can load Feathers UI and OpenFL directly from the [unpkg CDN](https://unpkg.com/) in any HTML file.
+
+```html
+<script src="https://unpkg.com/openfl@8.9.6/dist/openfl.min.js"></script>
+<script src="https://unpkg.com/actuate@1.8.9-beta/dist/actuate.min.js"></script>
+<script src="https://unpkg.com/feathersui-openfl@1.2.0/dist/feathersui-openfl.min.js"></script>
+```
+
+The following sample code demonstrates a simple Hello World project:
+
+```js
+class HelloWorld extends feathers.controls.Application {
+  constructor() {
+    super();
+
+    this.layout = new feathers.layout.AnchorLayout();
+
+    this.button = new feathers.controls.Button();
+    this.button.layoutData = feathers.layout.AnchorLayoutData.center();
+    this.button.text = "Click Me";
+    this.button.addEventListener(
+      feathers.events.TriggerEvent.TRIGGER,
+      this.button_triggerHandler
+    );
+    this.addChild(this.button);
+  }
+
+  button_triggerHandler = (event) => {
+    feathers.controls.TextCallout.show("Hello World", this.button);
+  };
+}
+
+var stage = new openfl.display.Stage(0, 0, null, null, {
+  allowHighDPI: true,
+});
+document.body.appendChild(stage.element);
+stage.addChild(new HelloWorld());
+```