Galerie

Ma première application

Une fenêtre, un titre, un bouton : votre première application décrite en BERKIOS CODE.

Télécharger l'exempleFichier .zip depuis la dernière release GitHub.

Type : BERKIOS Code · Niveau : débutant · Fichiers : main.bk, main.berkios.json

Ce que vous allez apprendre

Décrire une interface dans un fichier texte .bk.
Voir le résultat dans le navigateur avec l'aperçu.
Ouvrir votre application dans le Studio.

Avant de commencer

L'outil berkios doit être installé et réglé sur le français :

berkios --lg --fr

Étape 1 : récupérer ou créer le fichier

Soit vous téléchargez l'exemple, soit vous créez le fichier de départ vous-même :

berkios nouveau main.bk

Étape 2 : le code

langue français

application "Ma première application"
  version 1.0
  type interface
  édition pro

interface Accueil
  étiquette titre "Bonjour"
    taille du texte 26
    gras
  bouton valider "Cliquer ici"
    quand on clique : afficher "Bravo !"

Étape 3 : vérifier

berkios valider main.bk

OK — main.bk est valide (0 avertissement(s)).

Si vous faites une faute (un mot mal écrit, une ligne mal décalée), le compilateur vous indique la ligne.

Étape 4 : voir l'application

berkios apercu main.bk

L'application s'ouvre dans votre navigateur. Cliquez sur Cliquer ici : le message « Bravo ! » apparaît. Modifiez le fichier et enregistrez : la page se recharge toute seule.

Étape 5 : l'ouvrir dans le Studio

berkios compiler main.bk -o main.berkios.json

Dans le Studio : Fichier → Importer, puis choisissez main.berkios.json. Vous pouvez maintenant déplacer les composants avec la souris : le texte et le dessin sont deux façons de décrire la même application.

Le code expliqué

Ligne	Rôle
`langue français`	La langue des mots-clés du fichier. Un fichier = une langue.
`application "Ma première application"`	Nom de l'application, suivi de ses réglages (`version`, `type`, `édition`).
`interface Accueil`	Un écran, qui s'appelle `Accueil`.
`étiquette titre "Bonjour"`	Un texte. `titre` est son identifiant, `"Bonjour"` son contenu.
`taille du texte 26` / `gras`	Mise en forme du composant au-dessus (lignes décalées d'un cran).
`bouton valider "Cliquer ici"`	Un bouton.
`quand on clique : afficher "Bravo !"`	Ce qui se passe au clic.

À vous de jouer

Ajoutez un champ de saisie et un second bouton qui vide le formulaire :

langue français

application "Ma première application"
  version 1.0
  type interface
  édition pro

interface Accueil
  étiquette titre "Bonjour"
    taille du texte 26
    gras
  champ nom "Votre prénom"
  bouton valider "Cliquer ici"
    quand on clique : afficher "Bravo !"
  bouton effacer "Effacer"
    quand on clique : vider le formulaire

Vérifiez avec berkios valider, puis relancez l'aperçu.

Pour aller plus loin

Exemple suivant : Gestion de stock
Leçon : Votre premier fichier .bk

Cette page en Markdown · llms.txt · documentation complète pour les IA