> ## Documentation Index
> Fetch the complete documentation index at: https://docs.squarecloud.app/llms.txt
> Use this file to discover all available pages before exploring further.

# Premiers pas sur Square Cloud avec HTML/CSS

> Apprenez à démarrer sur Square Cloud avec HTML/CSS

## 🚀 Introduction

* Avant de commencer, assurez-vous de disposer d'un éditeur de texte adapté pour créer des fichiers HTML et CSS. Nous recommandons [Visual Studio Code](https://code.visualstudio.com/) ou tout autre éditeur de votre choix.
* Ensuite, vous devrez créer un compte sur Square Cloud, ce qui peut se faire via la [page de connexion](https://squarecloud.app/fr/signup). Vous pouvez utiliser votre e-mail, GitHub, ou les deux pour créer le compte.
* Enfin, vous devez disposer d'un plan payant actif sur votre compte. Vous pouvez consulter nos plans et en acheter un selon vos besoins [ici](https://squarecloud.app/fr/pricing).

<Info>Square Cloud offre une prise en charge native des projets statiques, tels que les sites HTML/CSS. Cela signifie que vous pouvez facilement héberger vos ressources HTML, CSS et autres ressources statiques sur la plateforme. Grâce au CDN premium intégré, vos sites seront livrés rapidement aux utilisateurs du monde entier.</Info>

<Note>
  Si vous téléversez votre application via le site web de Square Cloud, vous pouvez ignorer la section ci-dessous. Le site crée automatiquement le fichier de configuration `squarecloud.app` pour vous.
</Note>

## 📄 Fichiers requis

* index.html (Exemple de fichier principal).
* vite.html (Exemple de fichier principal pour les projets Vite).
* 404.html (Fichier de routage des erreurs 404, optionnel).

## 🖥️ Préparer le projet

Avant d'héberger votre projet sur Square Cloud, vérifiez d'abord que les fichiers du projet sont correctement configurés pour l'hébergement.

## 📤 Comment héberger votre projet

Maintenant que vous avez préparé tous les fichiers de votre projet HTML/CSS, l'étape suivante consiste à les téléverser sur Square Cloud et à mettre votre application en ligne. Il existe plusieurs façons de téléverser, mais nous en couvrirons deux : via le Dashboard ou via la CLI.

### Via le tableau de bord

<Steps>
  <Step title="Accéder à la page d'upload">
    Accédez à la [page d'upload](https://squarecloud.app/fr/dashboard/new) et téléversez le fichier zip de votre projet.
  </Step>

  <Step title="Configurer votre environnement">
    Après avoir téléversé votre zip, vous devrez configurer le nom, le fichier principal ou l'environnement d'exécution ainsi que d'autres paramètres de votre projet.\
    Si vous téléversez un projet web, veillez à sélectionner « Publication Web » et à définir un sous-domaine pour votre projet.
  </Step>

  <Step title="Déployer votre projet">
    Enfin, cliquez sur le bouton « Deploy » pour héberger votre projet sur Square Cloud.\
    Une fois le déploiement effectué, vous pouvez suivre l'état et les logs de votre projet depuis le tableau de bord.

    <Frame>
      <img src="https://cdn.squarecloud.app/docs/articles/dashboard/uploading.gif" alt="Téléversement d'une application vers Square Cloud" style={{ borderRadius: "0.2rem" }} />
    </Frame>
  </Step>
</Steps>

### Via la CLI

Pour utiliser cette méthode, vous devez créer un fichier de configuration nommé `squarecloud.app` à la racine de votre projet. Ce fichier contiendra la configuration nécessaire à votre projet.

<Card title="En savoir plus : comment créer le fichier de configuration pour Square Cloud." icon="link" href="/fr/getting-started/config-file">
  Le fichier squarecloud.app est un fichier de configuration qui servira à configurer votre application ; il sera utilisé pour définir votre environnement.
</Card>

<Steps>
  <Step title="Installer la CLI">
    Tout d'abord, vous devez avoir la CLI installée dans votre environnement. Si ce n'est pas encore le cas, exécutez la commande suivante dans votre terminal :

    ```
    npm install -g @squarecloud/cli
    ```

    Si vous l'avez déjà, nous vous recommandons de la mettre à jour. Pour cela, exécutez la commande suivante dans votre terminal :

    <Tabs>
      <Tab title="Windows">
        ```bash theme={null}
        squarecloud update
        ```
      </Tab>

      <Tab title="Linux, macOS et WSL">
        ```bash theme={null}
        curl -fsSL https://cli.squarecloud.app/install | bash
        ```
      </Tab>
    </Tabs>
  </Step>

  <Step title="S'authentifier">
    Maintenant, pour vous authentifier et utiliser les autres commandes de la CLI, vous trouverez votre clé d'autorisation [ici](https://squarecloud.app/fr/account/security) en cliquant sur « Request API Key ». Après avoir obtenu votre clé d'autorisation, exécutez la commande suivante :

    ```bash theme={null}
    squarecloud auth login
    ```
  </Step>

  <Step title="Téléverser votre projet">
    Enfin, pour déployer votre application sur Square Cloud à l'aide de la CLI, vous devez exécuter la commande suivante :

    ```bash theme={null}
    squarecloud upload 
    ```

    Ou si vous avez créé le zip manuellement, vous pouvez utiliser :

    ```bash theme={null}
    squarecloud upload --file <path/to/zip> 
    ```
  </Step>
</Steps>

## Contactez-nous

Si vous rencontrez toujours des **difficultés techniques**, notre **équipe de support spécialisée** est disponible pour vous aider. [**Contactez-nous**](https://squarecloud.app/fr/support) et nous serons ravis de vous aider à résoudre tout problème.
