3.0 KiB

Raw Blame History

Créer ma première application

1. Télécharger le CLI

Se rendre à l'adresse https://forge.cadoles.com/arcad/edge/releases
Télécharger la dernière version du binaire cli disponible dans la page.

2. Créer l'arborescence de son application

L'arborescence d'une "Edge App" doit correspondre à une structure prédéfinie.

my-app
    |-> manifest.yml    # Le fichier "manifeste" décrivant votre application
    |-> public          # Répertoire contenant tous les fichiers accessibles publiquement
    |-> server
        |-> main.js     # Le point d'entrée pour le code "serveur" de votre application

3. Compléter le fichier `manifest.yml`

Ce fichier est le manifeste de votre application. Il permet au serveur d'identifier celle ci et de récupérer des informations la concernant.

---
# L'identifiant de votre application. Il doit être globalement unique. 
# Un identifiant du type nom de domaine inversé est en général conseillé (ex: tld.mycompany.myapp)
id: tld.mycompany.myapp

# Le titre de votre application.
title: My App

# Les mots-clés associés à votre applications.
tags: ["chat"]

# La description de votre application.
# Vous pouvez utiliser la syntaxe Markdown pour la mettre en forme.
description: |>
    A simple demo application

4. Créer la page d'accueil

Créer le fichier my-app/public/index.html:

<html>
    <head>
        <title>My App</title>
    </head>
    <body>
        <h1>My App</h1>
        <!-- Inclure le SDK -->
        <script type="text/javascript" src="/edge/sdk/client.js"></script>
        <script type="text/javascript">
            // On utilise le SDK via la variable globale "Edge"
            // pour se connecter au serveur de notre application.
            Edge.connect().then(() => {
                // Une fois connecté, on envoie un message au serveur.
                Edge.send({ "hello": "world" });
            });

            // On écoute les messages en provenance du serveur.
            Edge.addEventListener("message", (evt) => {
                console.log("New server message", evt.detail)
            });
        </script>
    </body>
</html>

5. Créer le fichier `server/main.js`

Ce fichier est nécessaire, même vide.

// La fonction "onInit()" (si déclarée) est automatiquement
// exécutée au démarrage du serveur de votre application.
function onInit() {

}

// La fonction "onClientMessage(ctx, message)" est automatiquement
// exécutée quand le serveur de votre application reçoit un
// message en provenance du client.
function onClientMessage(ctx, message) {
    console.log(message);

    // On utilise le module "net" pour renvoyer un message au client
    net.send(ctx, { "my": "message" });
}

6. Exécuter votre application en local

Utiliser le CLI téléchargé préalablement pour lancer votre nouvelle application localement.

cli app run -p ./chemin/vers/app

La page d'accueil devrait être accessible à l'adresse http://localhost:8080.

3.0 KiB Raw Blame History