Comment créer une application NodeJS d’organisation d’événements type « Fête du livre » ?

Ce tutoriel permet de créer une application NodeJS à l’aide du générateur Newmips pour gérer l’organisation d’un événement.

L’application créée permet d’organiser un salon :

  • Ressources matérielles (salles, tables, bancs, équipement audio, etc.)
  • Ressources physiques (invités, agents en charge de l’organisation, bénévoles, etc.)
  • Planning d’occupation des salles
  • Edition des badge d’entrée (format A4)
  • Etc.

Elle prend comme exemple la fête du livre organisée sur 3 jours.

 

Etape 1 – Implémentation de l’application modèle

Aller dans le studio Newmips et cliquer le bouton « Modèles d’applications »

Choisir dans la liste déroulante l’application « Salon du livre ».

Cette dernière s’appuie sur le code source disponible à cette adresse :
https://github.com/newmips/templates/tree/master/salon_livre

Attendre que l’application soit générée et que l’écran de prévisualisation s’affiche.

 

Etape 2 – Génération des badges d’entrée au format A4

1 – Ajout des utilisateurs

Aller dans le menu « Administration » via la liste déroulante à gauche dans le menu.

Dans le menu de gauche, cliquer sur « Rôle » puis « Créer ». Saisir la valeur « Visiteur ». Cliquer sur « Sauvegarder »

Dans le menu de gauche, cliquer sur « Groupe » puis « Créer ». Saisir la valeur « Visiteur ». Cliquer sur « Sauvegarder »

Dans le menu de gauche, cliquer sur « Utilisateur » puis « Créer ».
Saisir les champs « Nom » et « Prénom ».
Choisir « Visiteur » dans la liste déroulante pour le rôle et le groupe.
Cliquer sur « Sauvegarder ».

 

2 – Chargement du modèle de document

Préparer un fichier Dust (HTML) pour imprimer le badge :


<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<style type="text/css">
* {
    font-family: Arial;
    font-size: 16px;
}
@media print {
    * {
    font-family: Arial;
    font-size: 16px;
}
.new-page {
page-break-before: always;
}
}
</style>
<script src="https://cdn.jsdelivr.net/npm/jsbarcode@3.11.0/dist/JsBarcode.all.min.js" type="text/javascript"></script>
</head>
<body onload="javascript:JsBarcode('#barcode','{f_code_barre}');">
    <div with="100%" style="text-align: center;">
        <img id="barcode"/>
        <br><br> {f_nom} {f_prenom}
    </div>
</body>
</html>

Dans le menu de gauche, cliquer sur « Modèle de document » puis « Créer » :

  • Nom du fichier : « Badge »
  • Fichier : votre document au format Dust (HTML)
  • Entité : « Utilisateur »
  • Sous-entités : « Rôle » et « Groupe »

Cliquer sur le bouton « Sauvegarder »

 

3 – Génération du badge

Afficher un utilisateur, cliquer sur l’onglet « Modèle de document » et choisir « Badge » dans la liste déroulante.

Vous pouvez ouvrir ou télécharger le document généré :

 

Badge Code Barre 1D

 

Etape 4 – Paramétrage du système

Vous pouvez désormais créer des enregistrements dans les différentes entités du système pour préparer l’événement :

  • Editeur
  • Libraire
  • Livre
  • Mobilier
  • Lieu
  • Espace
  • Hôtel
  • Auteur

 

 

Newmips – www.newmips.com