Aller au contenu principal

Démarrage rapide - Intégration Wast-o

Bienvenue dans la documentation développeur de Wast-o ! Cette section vous guide pour intégrer les fonctionnalités Wast-o dans votre application.

Options d'intégration​

Wast-o propose plusieurs méthodes d'intégration selon vos besoins :

  1. Intégration par iframe : Solution rapide et simple, idéale pour une intégration minimale
  2. Client SDK : Pour appeler l'API directement depuis votre code (JavaScript/TypeScript) avec un client typé, sans passer par les composants UI. Voir Client SDK.
  3. Composants React : Pour les applications React, intégration native avec composants réutilisables
  4. Composants Vue : Pour les applications Vue.js, composants dédiés
  5. Composants Svelte : Pour les applications Svelte, composants optimisés

Prérequis​

Avant de commencer, assurez-vous d'avoir :

  • Un accès à l'API Wast'O (https://api.wast-o.com)
  • Le site public pour les iframes (https://public-web.wast-o.com)
  • L'ID d'une ville active (obtenu via l'API /public/cities)
  • Une application web ou mobile prête à intégrer

Vue d'ensemble​

Les fonctionnalités disponibles pour l'intégration incluent :

  • Calendrier de collecte : Affichage des jours de collecte par type de déchet
  • Widget calendrier PDF : Recherche d'adresse, secteur, téléchargement PDF (iframe page=calendrier-pdf)
  • Challenges : Défis et quiz pour encourager le tri
  • Points de recyclage : Carte des points de collecte
  • Articles de blog : Contenu éditorial sur le tri des déchets

Choisir la bonne méthode​

Intégration par iframe​

Avantages :

  • Mise en place rapide
  • Pas de dépendances supplémentaires
  • Maintenance minimale (mises à jour automatiques)

Inconvénients :

  • Moins de personnalisation
  • Contraintes de sécurité (CSP)
  • Moins d'intégration avec votre application

Idéal pour : Intégrations rapides, prototypes, sites web simples

Client SDK​

Avantages :

  • Client typé, une seule dépendance
  • Accès à toutes les routes publiques (villes, défis, blog, tickets, chat, etc.)
  • Pas d'UI imposée : vous construisez votre propre interface

Inconvénients :

  • Vous devez gérer l'affichage des données vous-même

Idéal pour : Applications sur mesure, intégration dans un framework non couvert par les composants, appels API directs

Voir Client SDK pour l'installation et les exemples.

Composants natifs (React/Vue/Svelte)​

Avantages :

  • Personnalisation complète
  • Intégration native avec votre application
  • Meilleure performance
  • Contrôle total du styling

Inconvénients :

  • Nécessite l'installation de packages
  • Maintenance des dépendances
  • Plus de code à maintenir

Idéal pour : Applications complexes, personnalisation avancée, intégration native

Prochaines étapes​

Selon votre choix, consultez :

Support​

Pour toute question ou problème, consultez la documentation API ou contactez le support technique.