---
title: Quick Start
slug: quick-start
docTags: 
createdAt: 2024-06-27T10:35:35.911Z
---

For Unity games, please refer to our [Unity tutorial](https://developers2.airconsole.com/airconsole-unity-plugin).

### *General idea*

1. Create a new directory with two files screen.html and controller.html.



::Image[]{src="https://api.archbee.com/api/optimize/L3gEEzW6h4GKdEukxKEmf-pYf4Y9aMZjhx0U9wJXcTL-20250303-115341.png" size="40" width="234" height="164" position="center" darkWidth="234" darkHeight="164" showCaption="false"}

2\. Include the [AirConsole JS API](https://aircn.sl/js-api) and use it to communicate between devices.

::Image[]{src="https://api.archbee.com/api/optimize/L3gEEzW6h4GKdEukxKEmf-aEidQrS8JiA8OvV8dbnLf-20250303-115406.png" size="40" width="239" height="164" position="center" darkWidth="239" darkHeight="164" showCaption="false"}

3\. Host your files (local/remote) and call: **airconsole.com/#**http\://YOUR\_GAME\_URL/

::Image[]{src="https://api.archbee.com/api/optimize/L3gEEzW6h4GKdEukxKEmf-Eu2hHO4ILHwwZuLmSQzLe-20250303-115426.png" size="30" width="116" height="164" position="center" darkWidth="116" darkHeight="164" showCaption="false"}

### *Step by step guide*

**Create files:**

Create a new directory for your game (E.g. game) and create two files in it:

**/game**

- <font color="#eb144c">screen.html</font>
- <font color="#eb144c">controller.html</font>

The screen.html is for the gameconsole's screen.
The controller.html are for the gameconsole's controllers (gamepads).

::Image[]{src="https://api.archbee.com/api/optimize/L3gEEzW6h4GKdEukxKEmf-ApSCsHN9_ZLgLObHnPptK-20250303-115535.png" size="40" width="260" height="240" position="center" darkWidth="260" darkHeight="240" showCaption="false"}

:::hint{type="warning"}
Make sure both files can be accessed by: [http://your-local-webserver/screen.html](http://your-local-webserver/screen.html) (or /controller.html)
:::

If you don't want to create your own screen.html and controller.html right now and just play around, you can use our pong example [(pong.zip)](https://github.com/AirConsole/games-pong/archive/master.zip) from [the Classic Pong walkthrough](https://developers2.airconsole.com/pong-example).

**Include AirConsole Javascript API file:**

Include the AirConsole Javascript API in both files <font color="#eb144c">/screen.html</font> and <font color="#eb144c">/controller.html</font>

```html
<script type="text/javascript" src="https://www.airconsole.com/api/airconsole-1.11.0.js"></script>
```

**Send a message:**

Here is a simple example where the controller sends "*How are you?*" to the screen and the screen replies with "*Full of pixels!*"

<font color="#eb144c">/controller.html</font>

```javascript
 <button id="btn-msg">Send Message</button>

 <script type="text/javascript">
    var airconsole = new AirConsole();

    // When we press our button, we send a message to the screen
    document.getElementById('btn-msg').addEventListener("click", function() {
      airconsole.message(AirConsole.SCREEN, "How are you?");
    });

    // Listen for messages
    airconsole.onMessage = function(from, data) {

      // Show message on device screen
      var info = document.createElement('DIV');
      info.textContent = data;
      document.body.appendChild(info);
    };
</script>   
```

<font color="#eb144c">/screen.html</font>

```javascript
<script type="text/javascript">
    var airconsole = new AirConsole();

    // Listen for messages from other devices
    airconsole.onMessage = function(from, data) {

      // We receive a message -> Send message back to the device
      airconsole.message(from, "Full of pixels!");

      // Show message on device screen
      var info = document.createElement('DIV');
      info.textContent = data;
      document.body.appendChild(info);
    };
</script>
```

**Test your game:**

You need to start a local webserver in your /game folder to serve the <font color="#eb144c">screen.html</font> and <font color="#eb144c">controller.html</font>

In this example we will host the two files on:

:::BlockQuote
http\://192.168.0.1:8080/screen.html
http\://192.168.0.1:8080/controller.html
:::

To run the game, go with the browser that should act as the screen to:

[https://www.airconsole.com/#http://192.168.0.1:8080/](http://www.airconsole.com/#http://192.168.0.1:8080/)

:::hint{type="danger"}
NOTE: there is NO screen.html at the end!
:::

there are problems with certain browsers like chrome not allowing access like this with http and https mixed. Alternatively you can use:
[http://http.airconsole.com/?http=1\&#http://192.168.0.1:8080/](http://http.airconsole.com/?http=1\&#http://192.168.0.1:8080/)
or use the simulator like desribed below

Game controllers (your smartphone) can join as usual over [www.airconsole.com](https://www.airconsole.com).
Enter the code you see on the screen.&#x20;

When accessing the game with a separate device make sure the content (controller.html) is also accessible for that device under the url in the link ( in our example http\://192.168.0.1:8080/controller.html )

The devices should now exchange the messages.

**Simulator:**

If you append /simulator in the URL, then you will get a split view of the screen and two controllers:

[http://http.airconsole.com/simulator/#http://192.168.0.1:8080/](http://www.airconsole.com/simulator/#http://192.168.0.1:8080/)

This makes testing and developing a lot easier

:::hint{type="warning"}
&#x20;If you run into issue with HTTPS (mixed content issues), refer to the [tunneling guide](https://developers2.airconsole.com/testing-with-your-phone#0a3QQ).
:::

**Device Ids - Important warning:**

Make sure you do not assume that the controllers have device\_ids 1, 2, 3 ... We strongly recommend you read the [device ids and states](https://developers2.airconsole.com/device-ids-and-state) guide!

**Next steps:**

Checkout the guide about our [pong example](https://developers2.airconsole.com/pong-example) or the [API](https://airconsole.github.io/airconsole-api/) to learn more about how to build games for AirConsole.

To getting started with uploading your game to AirConsole, you can log in here: [https://www.airconsole.com/developers](https://www.airconsole.com/developers)