Video summary

Comment créer un site web avec Claude code (guide rapide)

Main summary

Key takeaways

Technology

Summary of the tutorial (Claude Code → website online)

Goal / outcome

This tutorial explains how to create a static website using Cloud Code (Claude Code). The workflow generates an initial site from a screenshot + prompt, saves the resulting code to GitHub, and then deploys it publicly using a web host (Hostinger).

4-step workflow presented

  1. Install Cloud Code

    • Download the desktop application.
    • After login, use the Code tab (the guide mentions a chat-like LIA interface, but focuses on the Code workflow).

  2. Generate a first website version from a screenshot

    • Use design inspiration from Dribbble.
    • Example prompt: “SEO consultant landing page” (landing page for an SEO consultant in Lyon).
    • Take or choose a screenshot, upload it in Cloud Code, and run the prompt.
    • Cloud Code generates an HTML file containing the website code.
    • A local project/folder is created on first use (example: “Cloud Code Test” containing an index.html).

  3. Connect Cloud Code to GitHub

    • Create a GitHub repository to store the website files.
    • In Cloud Code: Customise connector → GitHub integration → connect.
    • Cloud Code may require permissions/authorization and can generate a token or require an extra connection step.
    • Cloud Code uploads the generated code into the GitHub repository.

  4. Deploy the site to the web with a hosting provider

    • Hosting recommended: Hostinger (best value is mentioned).
    • Choose a plan compatible with custom HTML websites (example: Business).
    • Add a domain (Hostinger sometimes offers promos/free domain depending on subscription length).
    • Deployment uses a Git repository connection:
      • Cloud Code asks for Hostinger Git repo info (repo is private, so SSH is needed).
      • In GitHub: Settings → Deploy keys and create an SSH deploy key.
      • Add the deploy key and allow access (e.g., key name: “Hostinger”).
      • In Hostinger: paste the SSH repository URL provided by Cloud Code (including the “main” branch) to create the repository connection.
    • Use Deploy (the guide shows a successful deployment and access via a temporary URL / domain).

Product / pricing mentions (as given in subtitles)

  • Cloud Code (Pro)

    • Roughly €15–€20/month
    • Subtitles mention approximately ~$17/month annually and ~$20/month monthly.

  • Web hosting (Hostinger)

    • Roughly €10–€20/month
    • Possible promotional discounts and sometimes a free domain depending on commitment length.
    • Recommendation: commit at least 12 months (“a month isn’t worth it”).

  • Domain name

    • Typically €15–€20/month
    • Possible first-year free via offer.

  • GitHub

    • Described as free for storing code and acting as a “bridge” between Cloud Code and the host (compared to using something like “Google Drive” for website/app code).

Key technical concepts highlighted

  • Prompt + screenshot → HTML generation
  • Local project folder for preview before deployment
  • GitHub repository as code storage
  • Deploying from a private repo
  • Using SSH deploy keys to allow Hostinger/Cloud Code access to the private GitHub repo
  • Repository URL + branch (“main”) to set up the deploy pipeline
  • Mentions potential automatic deployment as a future workflow improvement

Main speakers / sources

  • Speaker: The tutorial narrator (referred to as “I” throughout).
  • Tools / sources referenced: Cloud Code (Claude Code), GitHub, Hostinger, and Dribbble (design inspiration).

Original video