Tutoriel · 10 min · 2025-04-01 · Par Équipe MaitriseLIA

Comment créer un site web avec Claude Code (sans expérience en code)

En 2025, vous n

Développement web avec Claude Code sans coder
Crédit photo : Unsplash

En 2025, créer un site web professionnel ne nécessite plus de connaître React, SQL ou le déploiement cloud. Claude Code peut s'occuper du développement pendant que vous définissez votre vision.

La stack recommandée

Pour un site web moderne sans se prendre la tête :

  • Frontend : React + Vite (Claude Code gère tout)
  • Base de données : Supabase (PostgreSQL managé, gratuit jusqu'à 500MB)
  • Hébergement : Netlify (déploiement automatique depuis GitHub, gratuit)
  • Domaine : OVH (à partir de 10€/an pour un .fr)

Étape 1 : Acheter votre domaine sur OVH

Rendez-vous sur ovhcloud.com, recherchez votre domaine (ex: monsite.fr), achetez-le (10-15€/an). Gardez les informations de connexion — vous en aurez besoin pour la configuration DNS plus tard.

Étape 2 : Créer votre compte GitHub

GitHub est l'endroit où votre code sera stocké. Créez un compte gratuit sur github.com. Vous n'avez pas besoin de comprendre Git pour ce tutoriel — Claude Code s'en occupe.

Étape 3 : Créer votre compte Supabase

Supabase est votre base de données. Gratuit pour les petits projets. Créez un compte sur supabase.com, puis un nouveau projet. Notez l'URL du projet et la clé anon — vous en aurez besoin.

Étape 4 : Démarrer avec Claude Code

Installez Claude Code et lancez-le dans un dossier vide :

```bash

mkdir mon-site && cd mon-site

claude

```

Demandez à Claude de créer la base de votre projet :

"Crée un site web pour [votre activité]. Stack : React + TypeScript + Vite + Tailwind CSS. Pages nécessaires : Accueil, Services, À propos, Contact. Design : moderne, professionnel, dark mode. Commence par la structure complète du projet."

Étape 5 : Connecter Supabase

Si votre site a besoin d'un formulaire de contact :

"Connecte ce site à Supabase. URL : [votre-url-supabase]. Crée une table contacts pour stocker les soumissions du formulaire avec : nom, email, message, date."

Étape 6 : Pousser sur GitHub

"Initialise un repository Git, crée un .gitignore approprié, et pousse tout sur GitHub."

Claude exécute toutes les commandes Git nécessaires.

Étape 7 : Déployer sur Netlify

  1. Connectez-vous sur netlify.com avec votre compte GitHub
  2. Add new site → Import an existing project → sélectionnez votre repo
  3. Build command : npm run build | Publish directory : dist
  4. Cliquez Deploy

En 2-3 minutes, votre site est en ligne.

Étape 8 : Connecter votre domaine OVH

Dans Netlify : Domain settings → Add domain → entrez votre domaine OVH.

Netlify vous donne les serveurs DNS à configurer dans votre espace OVH.

Attention : la propagation DNS prend 24-48h. Soyez patient.

Et si je veux modifier le site ?

C'est là que Claude Code brille vraiment. Pour changer n'importe quoi :

"Sur la page Accueil, change la couleur du bouton principal en orange et ajoute un bandeau de témoignages."

Claude modifie les fichiers, vous validez, Netlify redéploie automatiquement.

Notre Module 5 de la formation couvre cette stack de A à Z avec des cas pratiques réels.

Sources

  1. Anthropic — Documentation Claude
  2. Claude Code — Documentation officielle
  3. Model Context Protocol (MCP) — Specification

À propos de l'auteur

Équipe MaitriseLIA

Experts en formation Claude Code, Anthropic API et outils d'IA professionnels. Nos contenus sont rédigés par des spécialistes qui utilisent Claude Code et les MCPs au quotidien pour automatiser leurs business.