lobsite! Se connecter S'inscrire

Héberger un prototype Claude Code

Partagez le prototype cliquable de Claude Code : une commande lui donne un lien, un nouveau lien par itération, et un mot de passe si besoin.

Claude Code la lance dans le dossier du prototype et vous donne le lien à envoyer.
Déposez un fichier HTML, un dossier ou un .zip Vérifié dans votre navigateur ; rien n'est envoyé tant que vous ne publiez pas.

Claude Code transforme une idée en prototype cliquable en un après-midi : de vrais écrans, de vrais liens, des boutons qui mènent quelque part. C’est le partage qui coince, car un dossier sur votre portable n’est pas un lien à envoyer à un client, à une PM ou à un participant de test. Demandez à Claude Code de « mettre ce prototype en ligne » et il lance une commande qui renvoie une adresse HTTPS en ligne et un lien pour le garder. Pas de compte, pas de Git, pas de pipeline de build à mettre en place d’abord.

Comment ça marche

  1. Construisez le prototype avec Claude Code. Des pages HTML simples, ou une petite application React ou Vite. Demandez une vraie page par écran, pour que chaque écran ait sa propre adresse, que l’on peut ouvrir et mettre en favori.
  2. Demandez à Claude Code de le partager. Il lance npx -y lobsite --yes dans le dossier. Seuls les fichiers buildés sont envoyés, et rien ne pose de question en chemin.
  3. Envoyez le lien. Claude relaie l’adresse et le lien de récupération. Ouvrez le lien de récupération et connectez-vous pour garder le prototype au-delà de 6 heures ; l’adresse ne change pas.

Demandez un prototype, pas une maquette

Quelques lignes en début de session évitent une série de corrections avant de partager. Collez ceci dans Claude Code avec votre brief :

Build this as a static, clickable prototype:
- One HTML page per screen, linked with relative paths (about.html, not /about.html).
- Fake data in the page itself; no backend, no API keys, no login.
- Every button and link goes somewhere, even if it's a "not built yet" screen.
- Works on a phone as well as a laptop.
When it's done, share it with `npx -y lobsite --yes` and give me the link.

Les chemins relatifs comptent le plus : ils permettent aux mêmes fichiers de s’ouvrir depuis votre portable, depuis une adresse d’aperçu, puis depuis votre propre domaine.

Un lien par itération

Un prototype change après chaque revue. Gardez fonctionnel le lien déjà envoyé, et placez la nouvelle version à côté :

npx -y lobsite --yes --preview

Un déploiement d’aperçu a sa propre adresse, tandis que le lien principal continue d’afficher la version en cours de revue. Envoyez l’aperçu à la personne qui a demandé le changement. Une fois validé, npx lobsite promote <id> en fait la version principale, et un retour arrière l’annule en une étape si les retours vont dans l’autre sens. Dans un compte gratuit, les déploiements des 7 derniers jours gardent leur adresse d’aperçu (30 jours avec Standard) : « v2 » et « v3 » sont encore là pour comparer à la revue suivante.

Qui peut le voir

  • Sans compte, le prototype n’est pas indexé par les moteurs de recherche, et il est supprimé au bout de 6 heures si vous ne le récupérez pas.
  • Les adresses d’aperçu ne sont jamais indexées, quelle que soit l’offre.
  • Avec Standard, ajoutez un mot de passe dans les réglages du site. Chaque adresse du site le demande, aperçus et domaine personnalisé compris. Les relecteurs le saisissent une fois par navigateur, et le changer déconnecte tout le monde. Le mot de passe vit dans le tableau de bord, pas dans le projet : il ne finit jamais dans un dépôt.

C’est en général le sens de « peut-on garder ça entre nous et le client ? ». Pour ce qui est vraiment confidentiel, ne le mettez pas du tout dans un prototype.

Le tester avec des utilisateurs

Un prototype hébergé est une URL, et c’est tout ce dont la plupart des outils de test ont besoin. Collez l’adresse dans Maze, Lyssna ou UserTesting comme tâche sur site web, ou envoyez-la directement aux participants. Chaque écran a son propre chemin : une tâche peut commencer sur /checkout.html, et la réussite peut être « a atteint /thanks.html ».

Besoin de réponses venant du prototype lui-même, comme un écran d’inscription ou un questionnaire ? Faites pointer le formulaire vers /_lobsite/forms/feedback et, une fois le prototype dans un compte, les réponses arrivent par e-mail avec filtrage du spam. Voir formulaires.

Essai sans compte

Un déploiement sans compte reste en ligne 6 heures. Le lien de récupération le conserve, gratuitement.

Chaque déploiement a son URL

Prévisualisez avant la mise en ligne. Revenez en arrière en un clic, redirections comprises.

Protection par mot de passe

Avec Standard, chaque adresse du site demande un mot de passe. Les relecteurs le saisissent une fois par navigateur.

Conçu pour les agents

Aucune question posée sous un agent, et une ligne Tell the user: avec l’URL et le lien de récupération.

Des formulaires qui marchent, tout simplement

Faites pointer un formulaire vers /_lobsite/forms/contact. Filtrage du spam inclus.

Votre propre domaine

Comptes gratuits compris : ajoutez un enregistrement DNS et le site passe sur votre domaine. Chaque site a le HTTPS, quelle que soit l’offre.

Prototypes Claude Code : Lobsite et les moyens habituels de partager

Lobsite Lien de partage d’artifact Claude Netlify Drop GitHub Pages
Qui envoie Claude Code, en une commande Vous, depuis claude.ai Vous, en déposant un dossier Claude Code, avec commit et push
Compte pour commencer Aucun pendant 6 heures Compte Claude Aucun pendant environ une heure Compte GitHub et dépôt
Multipage et builds React Oui, tout le dossier Une page par artifact Oui Oui, avec un workflow pour le build
Un lien par itération --preview, avec promote et rollback Un nouvel artifact à chaque fois Un nouveau site, ou un nouveau déploiement à chaque fois Non intégré
Mot de passe Oui, avec Standard Règles de partage d’équipe uniquement Dans les offres Netlify payantes Non

Un lien d’artifact Claude suffit pour un écran. Dès que le prototype est un dossier de pages écrites par Claude Code dans votre projet, un hébergeur qui prend le dossier tel quel vous épargne le copier-coller.

Questions fréquentes

Puis-je héberger un prototype Claude Code gratuitement ?

Oui. Sans compte, il est en ligne 6 heures. Récupérez-le avec le lien que Claude vous donne et il reste en ligne dans un compte gratuit, à la même adresse.

Les liens de mon prototype fonctionnent en local mais cassent une fois en ligne. Pourquoi ?

Le plus souvent, des chemins absolus : /about.html pointe vers la racine du domaine, qui diffère entre votre portable et une adresse hébergée. Demandez à Claude Code d’utiliser des liens relatifs (about.html, ./img/logo.png), puis redéployez. Seuls les fichiers modifiés sont envoyés.

Un prototype React avec des routes fonctionne-t-il ?

Oui. Activez le mode monopage avec spa = true dans lobsite.toml, ou Application monopage dans les réglages du site, pour que les liens vers /settings ou /orders/42 ouvrent l’application au lieu d’une 404.

Puis-je mettre le prototype d’un client sur son propre domaine ?

Oui. Les comptes gratuits incluent un domaine personnalisé : ajoutez un enregistrement DNS et le prototype y déménage, en HTTPS.

Claude Code peut-il mettre à jour le prototype après une revue ?

Oui. lobsite.toml mémorise le site, donc la même commande, depuis n’importe quelle session, met à jour la même adresse. Ajoutez une ligne à CLAUDE.md pour que chaque session procède de la même façon ; voir Déployer un site depuis Claude Code.

Voir aussi