- Exemples complets
- Exemples didactiques
- Composants
2. Exemples et composants livrés avec WEBDEV
Les exemples et composants livrés avec WEBDEV présentent de manière didactique les différentes fonctionnalités de WEBDEV. Leur code source est commenté et détaillé. Différents types d'exemples sont livrés avec WEBDEV : - exemples complets : ces exemples correspondent à des sites complets, qui peuvent être utilisés sans adaptation.
- exemples didactiques : ces exemples illustrent une fonctionnalité spécifique.
- exemples unitaires : ces exemples sont constitués d'une page qui peut facilement être testée dans le projet en cours. Cette page permet illustre l'utilisation d'une fonction, d'une famille de fonctions, d'un champ, ...
- composants : ces exemples sont constitués d'un composant interne, d'un composant externe et d'un exemple d'utilisation.
Ces exemples et composants peuvent être ouverts directement depuis la fenêtre d'accueil de WEBDEV. - Si l'exemple n'est pas installé sur le poste, l'exemple est automatiquement téléchargé (depuis un serveur PC SOFT) et ouvert.
- Si l'exemple est installé sur le poste, une copie est automatiquement réalisée dans le répertoire "Mes Projets\Mes exemples".
L'exemple ouvert correspond à la copie de l'exemple original. Il est ainsi possible de travailler ou de faire des modifications sur cette copie. L'exemple original est ainsi conservé. A chaque nouvelle ouverture de l'exemple (via le bouton "Ouvrir un exemple"), il est possible de travailler sur l'exemple modifié ou de reprendre l'exemple original. Des exemples supplémentaires sont livrés avec la Lettre du Support Technique (LST) ou sont disponibles sur notre site (www.pcsoft.fr). | | | eCommerce | Le projet eCommerce est un site complet de commerce en ligne personnalisable via une interface d'administration Web.
- La partie vitrine / paiement du site est réalisée en AWP afin de permettre un référencement optimal des produits.
- La partie administration du site est réalisée en session classique WB pour garantir une sécurité optimale. | | Galerie_Photos | Cet exemple est un site de galerie photos et se compose de 2 parties principales :
- la partie "visiteur", réalisée en mode AWP et référençable.
- la partie administration réalisée en mode WEBDEV classique et sécurisée.
Parmi les fonctionnalités proposées, vous y trouverez :
- une organisation par albums de vos photos
- un lien vers les réseaux sociaux
- la possibilité pour les visiteurs de commenter vos publications
- la connexion des utilisateurs est gérée via le GPU de WEBDEV
- un formulaire de contact
- au niveau de l’administration du site, vous pourrez bien évidemment uploader vos photos, les classer par album et aussi les décrire
| | Honolulu | Honolulu : L'information circule mieux dans votre entreprise
Honolulu est totalement gratuit. Vous pouvez l'utiliser dans votre entreprise, sur autant de postes que vous le désirez, sans aucune limitation.
Il est livré avec un ensemble de modules permettant d'améliorer la circulation de l'information dans votre entreprise : messagerie, forum, blogs, … | | WAnnonces | Cet exemple est un site de gestion de petites annonces.
Recherches multicritères, ajout, modification et suppression d'annonces, ainsi qu'une gestion d'utilisateurs. | | webmillion | Dans cet exemple, nous abordons les principaux thèmes suivants :
1/ Utilisation des requêtes
2/ Utilisation des zones répétées "fichier" en parcours automatique
3/ Utilisation des zones répétées "fichier" en parcours manuel
Résumé de l'exemple livré avec WEBDEV :
Cette application Web réalisée avec WEBDEV permet de visualiser, de rechercher et de commander des TShirt.
Une fois la commande établie, il est possible d'utiliser le module PayBox de paiement sécurisé.
Cet exemple contient une page permettant de générer un fichier de données contenant un grand nombre d'enregistrements. | | WW_Association_AWP | Cet exemple présente un site associatif, et se compose de 2 parties principales :
- la partie "visiteur", réalisée en mode AWP donc référençable.
- la partie "espace membre" réalisée en mode WEBDEV classique donc sécurisée.
Ce site permet de présenter les actualités, les galeries photos, la présentation de l'association...
Les membres de l'association peuvent gérer leurs actualités, leurs photos, des échanges de messages ainsi qu'accéder aux petites annonces...
L'administrateur gère l'ensemble du site ainsi que les membres de l'association.
| | WW_Association_PHP | Cet exemple présente un site associatif en WEBDEV PHP.
Ce site se compose de 2 parties principales :
- la partie visiteur, accessible par tous.
- et la partie administration, réservée aux membres de l'association.
Ce site permet de présenter les actualités, les galeries photos, la présentation de l'association...
Les membres de l'association peuvent gérer leurs actualités, leurs photos, des échanges de messages ainsi qu'accéder aux petites annonces...
L'administrateur gère l'ensemble du site ainsi que les membres de l'association.
| | WW_Blog_AWP | Cet exemple est un site de gestion de blog.
Un blog est un journal ou un recueil d'actualités sur un site Internet.
Il est consultable par tous, et chacun peut y apporter des commentaires.
L'auteur du blog écrit ses messages lorsqu'il le souhaite.
Il est possible de mettre en forme le texte, d'inclure des images, des citations, etc...
Cet exemple est basé sur une génération AWP, ce qui permet entre autres de pouvoir référencer le site dans tous les moteurs de recherche.
De plus, le blog peut être exporté en RSS. (Utilisation des types RSS du WLangage) | | WW_Blogs_php | Cet exemple est un site Php de gestion de blogs réalisé avec WEBDEV.
Un blog est un journal ou un recueil d'actualités sur un site Internet.
Il est consultable par tous, et chacun peut y apporter des commentaires.
L'auteur du blog écrit ses messages lorsqu'il le souhaite.
Il est possible de mettre en forme le texte, d'inclure des images, des citations, etc...
De plus, chaque blog peut être exporté en RSS.
| | WW_CMS | Cet exemple est un exemple de CMS (Content Management System).
C'est un site de gestion de contenu, typiquement un site d'affichage d'articles.
Cet exemple est découpé en 2 parties :
- Une partie AWP pour la partie qui doit être référencée
- Une partie WEBDEV Classique pour la partie administration
Note :
Pour que certaines fonctionnalités de l'exemple fonctionnent (l'envoi d'emails par exemple) il est nécessaire de modifier les paramètres afin de les adapter à votre configuration.
Ces paramètres sont stockés sous forme de constantes définies dans le code du projet. | | WW_Emprunt | Grâce à la puissance de WEBDEV et à la simplicité du WLangage, ce site a été développé en 1 journée seulement !
Cet exemple permet de simuler des emprunts et notamment :
- de calculer le montant des mensualités à partir du montant emprunté donné
- de calculer le montant empruntable à partir d'une mensualité donnée
- de calculer le rapport d'un placement à partir d'un apport mensuel
Le tableau d'amortissement est affiché pour chacun des cas.
Ce tableau peut être édité dans un fichier au format PDF (fonctionnalité standard de WEBDEV). | | WW_FAQ | Cet exemple Responsive Web Design propose les principales fonctionnalités d'un site de FAQ (foire aux questions).
Il fournit les services suivants :
- Gestion des produits
- Rédaction des FAQ
- Edition des FAQ
- Affichage adapté aux mobiles | | WW_Forum_AWP | Cet exemple propose les fonctionnalités principales d'un forum utilisateur (création de forums, de sujets (ou topics) et de messages, modération par un administrateur, recherche, etc...)
WW_FORUM_AWP utilise entre autres les fonctionnalités suivantes :
- Recherche fulltext
- Champs riches
- Zones répétées
- Pages POPUP
- AJAX
- ... | | WW_Forum_PHP | Cet exemple propose les fonctionnalités principales d'un forum utilisateur (création de forums, de sujets (ou topics) et de messages, modération par un administrateur, recherche, etc...)
WW_FORUM_PHP utilise entre autres les fonctionnalités suivantes :
- Champ riche
- AJAX
- ... | | WW_MotorEquipment | Cet exemple est un exemple de boutique en ligne.
Il contient la partie "front-office" (présentation de produits), la partie panier, paiement sécurisé.
| | WW_Newsletter | WW_Newsletter permet de créer un site de gestion de newsletters. Il permet de créer, rédiger et gérer l'envoi en masse de newsletters à des abonnés. Les fonctionnalités du site sont les suivantes :
- inscription (double opt-in) et désinscription en ligne des abonnés
- consultation des newsletters publiques
- gestion des catégories de newsletters
- tableau de bord d'administration
- rédaction et mise en forme des newsletters en ligne
- création de modèles de newsletters
- etc. | | WW_Planning | Cet exemple permet d'afficher de façon dynamique les tâches des différents collaborateurs.
Il est possible d'ajouter, de modifier ou de supprimer des tâches dans le planning, simplement en cliquant sur les éléments du planning.
Toutes les manipulations sont effectuées grâce à AJAX.
Cet exemple utilise également le déplacement de champ par programmation.
| | WW_PlanningActivites_Club | Cet exemple présente un site pour une structure proposant des activités selon un planning précis ; par exemple pour un club de sport.
Le site présente la structure, les activités qu'elle propose, et affiche le planning.
Les principales pages sont :
- une page d'accueil présentant les activités,
- une page de présentation des activités,
- un planning des activités,
- une page "contact",
- un formulaire de pré-inscription. | | WW_Precilia_Sport | Le projet WW_Precilia_Sport est un exemple de site Web avec une partie boutique.
Le site prend la largeur complète du navigateur avec une image de fond. | | WW_Precilia_Winter | WW_Precilia_Winter est un site de vente en ligne de matériel de ski | | WW_PreciliaTShirts | WW_PreciliaTShirts est un site de vente en ligne de TShirts.
Ce site propose une page d'accueil (avec l'ensemble des produits), une page de description de produit (avec ajout au panier) ainsi que plusieurs pages annexes (faq, formulaire de contact, cgv, etc.).
| | WW_Presentation_Application_Mobile | Cet exemple est un site web responsive qui présente une application Mobile.
Il se compose d'une page statique totalement responsive. | | WW_Rewali | Cet exemple est un site de réservation de voyages.
Il propose des offres de voyages à des prix très attractifs.
Il est ensuite possible de choisir la durée du voyage, les dates de départ .. puis de valider l'achat jusqu'au paiment via Paypal.
Il utilise notamment le champ "bandeau défilant" et les plans.
| | WW_TamesShop | L'exemple WW_TamesShop fournit une boutique en ligne complète et immédiatement opérationnelle. Le site prend en charge les catégories de produits, les caractéristiques détaillées, les photos et propose plusieurs composants internes modulaires pour gérer l'espace client, le panier, le paiement... | | WW_TicketTracker | WW_TicketTracker est un exemple complet de gestion de tickets d'incidents. Cet exemple peut être utilisé dans tous les domaines où il est nécessaire de suivre des interventions entre plusieurs personnes.
L'inscription au site est libre par défaut. Chaque inscrit peut créer des projet et y inviter des participants.
Chaque participant peut créer des tickets d'incidents et les affecter à l'un des participants du projet. | | WW_WebDoc | WebDoc est une Gestion Electronique de Documents (GED).
WebDoc utilise la recherche fulltext pour effectuer des recherches dans le contenu des documents.
Les documents sont classés par catégorie. Un tree-view dynamique affiche l'arborescence des catégories.
Cet exemple montre également comment récupérer le contenu d'un document PDF. | | WW_WebImmo | Site de présentation de bien immobilier. Ce site est développé en Responsive Web Design, sa mise en page s'adapte automatiquement à toutes les tailles de navigateurs.
|
| | | WebApp | Cet exemple présente une utilisation didactique des plans en WEBDEV. | | WW_Acces_Chorus_Pro | Cet exemple montre comment accéder à l'API Chorus Pro. | | WW_Administration_ResponsiveWebDesign | Page simple, responsive. | | WW_Agencements | Cet exemple est un site pouvant être visualisé sur un terminal mobile.
Le site utilise les agencements de WEBDEV afin d'adapter l'UI du site aux terminaux mobiles.
| | WW_Agenda | L'exemple WW_Agenda est un exemple d'utilisation du champ Agenda pour WEBDEV.
| | WW_Assistant | Avec WEBDEV, il est possible de réaliser ses propres assistants Web, et ceci notamment grâce à la fonction WLangage 'PageAfficheDialogue' qui permet d'afficher une page de manière modale.
Ceci permet donc de créer un dialogue avec l'utilisateur.
Et pour passer d'un plan à un autre de l'assistant, il suffit d'utiliser le concept de plan présent également dans WEBDEV.
| | WW_Blog_ResponsiveWebDesign | Blog simple, responsive. | | WW_Cadrage_Visage_IA | Cet exemple contient une popup permettant de recadrer facilement une image après un upload (typiquement pour le cadrage et redimensionnement d'une photo de profil). | | WW_CRUD_Firestore | Cet exemple montre comment faire les opération de manipulation de base de donnée de base avec Firebase. | | WW_Dessin_HTML5 | WEBDEV met à disposition des fonctions de dessin en code navigateur, pour les navigateurs supportant HTML5.
Cet exemple didactique présente :
- un tableau de dessin,
- et une mise en situation : le choix visuel par l'internaute des catégories de place lors d'une réservation de spectacle.
| | WW_Double_Authentification | Cet exemple montre comment utiliser la double authenfication afin de sécuriser l'accès à des comptes utilisateurs.
Il utilise une double authentification TOTP qui génère un code à 6 chiffres toutes les 30 secondes.
Le code est généré par n'importe quel Authenticator qui gère le protocole TOTP (Google, Microsoft, ...) | | WW_Etat | Cet exemple montre les différentes méthodes pour réaliser un état :
- impressions basées sur différentes sources de données (requêtes, variables, ...)
- impressions basées sur des champs (Table, ...)
- impression d'états composés
- impressions spécifiques (portrait / paysage, état avec filigrane, état avec code-barres, ...)
| | WW_Flexbox | Cet exemple présente le champ Flexbox qui détermine le positionnement des champs placés dedans. | | WW_Flux_RSS | Cet exemple montre comment lire et afficher un flux RSS dans une page WEBDEV grâce au type RSS et aux fonctions de manipulation du RSS du WLangage.
Un modèle de champ facilement réutilisable est utilisé pour afficher les données RSS.
| | WW_Gestion_Auto_Erreurs | Cet exemple montre l'utilisation de la gestion automatique des erreurs de WEBDEV.
Il explique comment gérer des erreurs fatales, des erreurs non fatales et quels sont les différents moyens disponibles dans WEBDEV.
| | WW_Graphe | Cet exemple didactique présente diverses utilisations du champ graphe. | | WW_hCaptcha | Cet exemple propose l'utilisation du champ hCaptcha pour protéger les fonctionnalités de votre site. | | WW_Kanban | Cet exemple montre un usage didactique du champ Kanban avec la mémorisation et le chargement d'un kanban sauvegardé | | WW_Kendo_Grid | Cet exemple montre l'utilisation d'une table Kendo UI grid et l'utilisation du composant WEB. La Grid Kendo permet, entre autres, de faire un DragAndDrop des entêtes de colonnes de table pour créer des ruptures. | | WW_PayPal_PHP | Cet exemple PHP réalisé avec WEBDEV présente comment proposer dans vos sites WEBDEV PHP un paiement sécurisé avec la solution PayPal.
Il montre comment :
- inclure un bouton de paiement PayPal dans une page,
- indiquer les informations de paiement à Paypal,
- définir une page de validation de paiement,
...
| | WW_Signature | WW_Signature est un exemple montrant comment dessiner en HTML5 et sauvegarder l'image dessinée en code navigateur. | | WW_SiteClientSAAS | L'exemple "WW_SiteClientSAAS" est un exemple d'utilisation des fonctions d'administration SaaS de WEBDEV.
Cet exemple se présente sous forme d'un site de vente de solutions SaaS.
Pour utiliser cet exemple, un site SaaS doit être configuré tel que défini dans le code d'initialisation du projet.
L'internaute peut ainsi s'abonner à une ou plusieurs tarifications données d'un site SaaS sans faire appel à l'administrateur du serveur SaaS. | | WW_Statut_Liste | Cet exemple est une implémentation très simple de la webhook mise à disposition par le robot de surveillance.
Il suffit d'indiquer l'URL de la page webhook de l'exemple comme webhook à appeler dans les paramètres du robot de surveillance puis de définir les catégories et les contrôles.
La page affichera toutes les 2 minutes l'état des contrôles. | | WW_TableauDeBord | L'exemple "WW_TableauDeBord" est un exemple didactique sur l'utilisation du champ Tableau de bord.
Cet exemple présente comment :
- manipuler le champ en mode "édition",
- sauver/charger une configuration,
- configurer le champ (configuration initiale, ajout / suppression de widgets, ...),
- rafraîchir un widget.
| | WW_Toast | Remplacez les toasts natifs par les toasts avancés et personnalisables du composant interne Toast avancé | | WW_UtilisationChampDisposition | Le champ Disposition (Layout) facilite la mise en place d'UI dynamiques où des champs sont affichés et/ou masqués par programmation.
Lorsqu'un champ devient invisible (par exemple via la propriété Visible), le champ Disposition repositionne automatiquement tous les autres champs pour conserver une interface harmonieuse et éviter les "trous".
Cet exemple présente 2 cas d’utilisation de ce champ Disposition dans une page WEBDEV. | | WW_Websocket_Page | Cet exemple montre comment utiliser un serveur de websocket pour gérer une communication entre plusieurs clients grâce à une simple page statique WebDev
Nécessite le lancement préalable de WW_WebsocketServeur | | WW_WebsocketServeur | Cet exemple est un serveur de websocket pour l'exemple WW_WebSocket_Page | | WW_ZoneRepetee_PageInterne | Cet exemple présente l'utilisation des pages internes dans un champ Zone répétée, par exemple pour inclure une zone répétée dans une zone répétée, mais également un champ Table ou un champ Graphe. | | WW_Zoom_Auto | Cet exemple propose un modèle de champ basé sur une image, permettant d'afficher une miniature d'une image et grâce à un clic sur celle-ci, d'agrandir l'image sans perturber la mise en page.
Limitations :
- Les images ne peuvent pas être chargées depuis une base de données
- Le modèle de champ ne peut pas être inclus dans une zone répétée | | WWDialogueNavigateur | Cet exemple montre un dialogue entre deux navigateurs distincts. Il permet d'ouvrir une nouvelle page dans un nouveau navigateur et de récupérer des valeurs modifiées. |
WEBDEV est livré en standard avec projets correspondants à des composants. Ces projets contiennent : - une configuration de projet correspondant au composant.
- une configuration de projet correspondant à l'utilisation du composant.
- un composant interne.
Voici les principaux composants livrés avec WEBDEV :
| | | WW_Extraction | WW_Extraction
L'extraction du contenu d'un fichier dépend de sa structure.
Pour certains types de fichiers, WEBDEV propose des fonctions WLangage permettant d'extraire leur contenu : HTMLVersTexte, XMLVersTexte , PDFVersTexte (à partir de WEBDEV 14), ... etc.
Cependant pour d'autres fichiers, il sera nécessaire d'étudier leurs structures et de programmer l'extraction du contenu en fonction de ces structures.
Il est également intéressant de stocker le contenu d'un fichier pour effectuer ultérieurement des recherches fulltext.
Grâce à cet exemple, il devient très facile d'extraire et de stocker le contenu de divers documents (Open Office, Word 2007, ...) afin de retrouver ceux dont on a besoin grâce à la recherche fulltext. | | WW_NuageTags | Cet exemple montre comment afficher un nuage de tags dans une application WEBDEV dynamique.
En effet, sur Internet, une page d'un site répond plus ou moins à un ensemble de mots-clés.
L'objectif de cet exemple est donc de présenter comment afficher les mots-clés d'un site dans une zone de la page en indiquant de manière graphique les mots-clés importants.
Les mots-clés se retrouvent alors sous forme de liens de différentes tailles : plus le mot-clé est important dans le site, plus sa police est élevée. | | WW_PayBox | Le composant PayBox permet de mettre en oeuvre une solution de paiement sécurisé dans un site WEBDEV.
Cet exemple permet de tester cette solution grâce à un compte de test. | | WW_PayPal | Cet exemple contient un composant interne qui permet d'inclure dans les pages WEBDEV des boutons de paiement PayPal.
|
Des composants supplémentaires seront livrés avec la Lettre du Support Technique (LST) ou disponibles sur notre site (www.pcsoft.fr). |
|
|