1 / 0
00:00
1arc atelier

Claude Code & 1arc

L'IA développeur, et la couche relationnelle qui en fait un produit d'agence.

Infoclip · Atelier interne
Jeudi 11 juin 2026 · 1 h 30
Appuie sur pour démarrer

Programme de la session

1 h 30 ensemble — moitié théorie, moitié les mains dans le cambouis.

  1. 1
    Claude Code, c'est quoi ?15 min
    L'agent IA d'Anthropic qui lit, écrit et exécute du code.
  2. 2
    Avantages & inconvénients pour Infoclip10 min
    Ce que ça change concrètement dans une boîte comme la vôtre.
  3. 3
    1arc, le « Slack avec Claude Code intégré »15 min
    Le produit qu'on a construit pour internes + clients.
  4. 4
    Pause5 min
  5. 5
    Atelier autonomie20 min
    Chacun sur son compte. Tu briefes ton projet, Claude le construit, tu itères.
  6. 6
    Atelier discussion à 420 min
    Tous dans la même discussion. On code un projet ensemble.
  7. 7
    Q&R + discussion5 min

Claude Code, en une phrase

Un agent IA d'Anthropic qui vit dans ton terminal, lit ton projet, modifie tes fichiers et exécute des commandes — comme un développeur autonome assis à côté de toi.
Format
Outil en ligne de commande (CLI)
Modèle
Claude (Anthropic) — Opus, Sonnet, Haiku
Type
Agent : il décide des actions à enchaîner, pas juste un chat
Sortie
Modifications directes dans ton projet (fichiers, commandes shell)

Comment ça marche concrètement

1

Tu lui parles en français

« Ajoute un bouton "exporter en PDF" dans la page facture, avec une route /export-pdf qui rend du HTML stylé. »

2

Il lit ton projet

Il explore les fichiers, comprend la structure, repère les conventions de code, identifie les bons endroits à modifier.

3

Il propose un plan

Il liste les fichiers à créer/modifier, les commandes à exécuter, et te montre ce qu'il va faire avant.

4

Il exécute et itère

Il écrit les fichiers, lance les tests, lit les erreurs, corrige. Jusqu'à ce que ça marche. Tu peux interrompre, repivoter, lui demander de refaire.

Ce que Claude Code sait vraiment faire

Coder une feature

D'un brief à du code en prod — frontend, backend, base de données. Multi-fichiers, multi-langages.

Refactor / migration

Renommer 200 occurrences, passer un projet d'une lib à une autre, harmoniser des conventions.

Debug + investigation

Tu colles une erreur, il fouille les logs, les fichiers, propose un fix puis le teste.

Maintenance legacy

Reprendre un projet ancien, le documenter, ajouter des tests, le moderniser progressivement.

Prototypage rapide

Vitrine, mini-app interne, POC démo pour un client — en 30 min au lieu d'1 jour.

Docs & tests

Génération de README, doc API, tests unitaires, commentaires de code — tâches qu'aucun dev n'aime faire.

Avantages pour une boîte comme Infoclip

+ Ce que ça apporte
  • Vélocité ×3 à ×10 sur les tâches routinières : sites vitrines, CRUD, intégrations, mise en forme.
  • Devs senior libérés du boilerplate, focus sur l'architecture et la relation client.
  • Devs juniors boostés : ils livrent comme des séniors sur les tâches simples, montent en compétence plus vite.
  • Prototypes en démo client en quelques heures — gain énorme en avant-vente.
  • Maintenance legacy moins douloureuse : code ancien expliqué, modernisé, documenté en parallèle.
  • Marge brute améliorée sur les forfaits fixes (vous facturez l'expertise, vous payez moins de temps de prod).
Ce qu'il faut surveiller
  • Coût en API non négligeable sur les gros projets (~5 à 50 € par gros projet généré).
  • Pas infaillible : peut écrire du code qui marche mais mal architecturé, ou faire des choix surprenants.
  • Risque sécurité : accès filesystem, exécution shell — pas à mettre entre toutes les mains sans isolation.
  • Dépendance Anthropic : changement de pricing, de modèle, ou panne = impact direct sur la prod.
  • Pas de visibilité native sur l'usage : qui a fait quoi, combien ça a coûté, où en sont les projets.
  • Courbe d'apprentissage : 2-4 semaines pour qu'un dev en tire vraiment le meilleur.

Mais utilisé tel quel… il manque tout ce qui fait une boîte

Claude Code est un outil de développeur solo. Une agence comme Infoclip a 5 problèmes que la CLI ne résout pas.

1

Chacun code dans son coin

Aucune visibilité sur ce que font les autres devs avec Claude. Pas de partage de prompts qui marchent, pas d'historique commun.

2

Le client est exclu

Le client paie pour un site, mais ne voit pas l'IA qui le construit, ne peut pas réagir, ne peut pas demander de modif en direct.

3

Pas de versioning intelligent

« Reviens à avant cette modif » → bonne chance avec git, surtout pour un dev junior ou un client.

4

Pas de garde-fous métier

L'IA peut tout faire — y compris des choses que vous ne voulez pas qu'elle fasse sur le projet d'un client.

5

Pas d'escalade humaine

Quand l'IA bloque, le client ou le dev junior tourne en rond. Pas de bouton « appeler un expert Infoclip ».

La couche qui transforme Claude Code en produit d'agence

1arc

Un Slack avec Claude Code intégré, orienté équipe interne et clients.

1arc en une diapo

Discussions multi-utilisateurs

Devs Infoclip + client final dans une même conversation. Mentions @claude pour faire travailler l'IA, sinon vous discutez entre humains.

Claude code et publie

Une URL publique par projet, générée à la volée. Le client voit le résultat dans son navigateur en temps réel. HTTPS auto.

Expert Infoclip à 1 clic

Mention @infoclip ou bouton dédié : un humain de chez Infoclip est notifié et peut intervenir directement dans la discussion.

Versioning automatique

Chaque modif crée un snapshot git auto-labellisé « Avant : … ». Le client peut revenir en arrière en 1 clic, sans connaître git.

Visualisation fichiers

Panneau latéral : voir Claude écrire les fichiers en direct, ouvrir un fichier, le télécharger. Pas une boîte noire.

Multi-tenant par client

Chaque PME a son espace isolé, ses devs Infoclip dédiés, ses projets séparés. Pas de fuite entre clients.

Sous le capot

Frontend
Vanilla JS + WebSocket · Inter / JetBrains Mono
↓ WS temps réel ↓
Backend Node
Express + ws · spawn Claude Code (UID isolé)
Claude Code natif
Anthropic API · stream-json · session resumable
Caddy reverse proxy
Wildcard *.1arc.app · TLS on-demand · routage par sous-domaine

Stack volontairement simple : pas de Docker par projet, pas de toolchain frontend. Performance et lisibilité avant tout.

Démo en live

L'interface, en 60 secondes

👉 On bascule sur nathan.1arc.app pour voir

Pourquoi c'est différent de tout ce qui existe

Solo dev IA
Slack + bot IA
Marketplace freelance
1arc
IA qui code et publie
Chat équipe + client
Expert humain prestataire intégré
~
Versioning compréhensible non-tech
~
Modèle B2B2C agence → clients PME
Exemples
Lovable, Bolt, v0
Claude in Slack
Codementor, Toptal
1arc · Infoclip

3 cas d'usage typiques pour Infoclip

A

Démo client en avant-vente

RDV commercial → tu ouvres 1arc avec le prospect → il décrit son besoin → Claude code une démo en 10 min → tu signes le contrat.

Impact : +30 à 50 % de taux de signature sur les projets simples.
B

Petits projets en self-service client

Le client a un besoin de mini-site/landing. Il ouvre 1arc, brief Claude, itère seul. Toi tu factures le forfait mensuel + interviens via @infoclip si bloqué.

Impact : marge ×3 sur les petits forfaits que vous refusez aujourd'hui faute de temps.
C

Atelier collaboratif équipe + client

Tu invites le client + 2 devs Infoclip dans une discussion. Vous co-construisez : le client donne le besoin, Claude code, les devs valident/corrigent.

Impact : moins d'allers-retours, satisfaction client visible en direct.

Sécurité & isolation — ce qui est en place

Auth bcrypt

Mots de passe hashés, rate-limit sur tentatives, cookie signé HMAC

UID dédié pour Claude

Claude tourne sous un user système isolé, pas en root, environnement minimal whitelisté

Quota par utilisateur

Plafond mensuel 30 €/user, 2 spawns Claude simultanés max, alerte à 75 %

Refresh token auto

Timer systemd 15 min + hook 401 : l'auth ne pète jamais sans rattrapage automatique

TLS automatique

Caddy on-demand : chaque sous-domaine client a son cert HTTPS valide en 5 sec

Versioning git

Tout est snapshoté, jamais de perte de fichiers, restauration en 1 clic

À durcir pour multi-tenant 100 % isolé : gVisor (déjà en place sur la stack /root/1arc), audit log, RGPD compliance.

Pause 5 minutes

Café, questions rapides, on se retrouve pour les ateliers.

Atelier 1 · 20 min

Chacun en autonomie sur son compte

1

Connecte-toi

Va sur sandboxconnexion.1arc.app

Identifiants distribués sur papier. Tu arrives sur <prénom>.1arc.app.

2

Crée une discussion

Bouton bleu en haut à gauche. Le rappel pédagogique explique @claude et @infoclip.

3

Brief un projet

Au choix :

  • Portfolio perso
  • Site vitrine pour un faux client
  • Mini-CRM 3 pages
  • Landing avant-vente d'un produit imaginaire

Claude choisira un nom de projet intelligent automatiquement.

4

Itère 2-3 fois

Une fois le premier rendu fait, demande une modif. Puis une autre. Observe le ring bleu animé pendant que Claude code.

5

Explore le panneau fichiers

Icône dossier en haut à droite → arborescence du projet. Clique sur un fichier pour voir le code coloré. Télécharge un fichier ou le projet entier (tar.gz).

6

Teste la restauration

Onglet « Versions ». Restaure une version précédente. Constate que le site revient à l'état d'avant.

But : que chacun ressente l'outil comme un client le ferait. Pas comme un dev.
Atelier 2 · 20 min

Tous les 4 dans la même discussion

Étape 1 — Mise en place

Nathan crée une nouvelle discussion, invite Laurent + Christophe + Eric via le bouton « Inviter ».

Tout le monde voit la discussion apparaître côté sidebar avec le ruban bleu « Équipe ».

Étape 2 — Brief collectif

Sujet proposé : « CRM interne Infoclip » — 3 modules : Clients, Prospects, Factures.

Nathan tape le brief avec @claude pour lancer la construction.

Sans la mention, Claude reste silencieux — vous pouvez discuter entre humains avant de lancer l'IA.

Étape 3 — Itération à plusieurs voix

À tour de rôle, chacun demande une modif :

  • Laurent : « @claude rends le design plus sobre, accent bleu Infoclip »
  • Christophe : « @claude ajoute une vue Kanban pour les prospects »
  • Eric : « @claude ajoute un export CSV des factures »

Tout le monde voit les modifs en temps réel. Le panneau fichiers se met à jour.

Étape 4 — Solliciter l'expert

Au moment où Claude bloque sur une demande complexe (volontairement abstraite), quelqu'un mentionne @infoclip ou clique sur le bouton « Expert Infoclip ».

L'expert humain (joué par Nathan en miroir) répond depuis le compte infoclip. Sa bulle a un ring orange animé distinct.

Étape 5 — Rollback collaboratif

Quelqu'un déclenche une restauration sur une version intermédiaire. Tout le monde voit la notification système. Le projet revient en arrière sans drame.

But : voir comment Infoclip peut piloter un projet client à plusieurs voix, avec l'IA en outil et l'expert humain en filet de sécurité.

Q & R

Tout est sur la table.

Quel coût réel par client PME ?
Comment on facture l'expert humain ?
Quel niveau de qualité moyenne du code Claude ?
Que se passe-t-il si Anthropic change ses prix ?
Et les clients qui n'aiment pas l'IA ?
Calendrier de mise en prod ?