Skip to content

Introduction

SlopCode est un agent de codage d’IA open source. Il est disponible sous forme d’interface basée sur un terminal, d’application de bureau ou d’extension IDE.

SlopCode TUI avec le thème slopcode

Commençons.


Prérequis

Pour utiliser SlopCode dans votre terminal, vous aurez besoin de :

  1. Un émulateur de terminal moderne comme :

  2. Clés API pour les fournisseurs de LLM que vous souhaitez utiliser.


Installation

Le moyen le plus simple d’installer SlopCode est d’utiliser le script d’installation.

Terminal window
curl -fsSL https://slopcode.dev/install | bash

Vous pouvez également l’installer avec les commandes suivantes :

  • Node.js

    Terminal window
    npm install -g slopcode
  • Via Homebrew sur macOS et Linux

    Terminal window
    brew install slopcode

    Nous vous recommandons d’utiliser le tap SlopCode pour les versions les plus récentes. La formule officielle brew install slopcode est maintenue par l’équipe Homebrew et est mise à jour moins fréquemment.

  • Via Paru sur Arch Linux

    Terminal window
    sudo pacman -S slopcode # Arch Linux (Stable)
    paru -S slopcode-bin # Arch Linux (Latest from AUR)

Windows

  • Via Chocolatey

    Terminal window
    choco install slopcode
  • Via Scoop

    Terminal window
    scoop install slopcode
  • Via NPM

    Terminal window
    npm install -g slopcode
  • Via Mise

    Terminal window
    mise use -g github:grappeggia/slopcode
  • Via Docker

    Terminal window
    docker run -it --rm ghcr.io/grappeggia/slopcode

Le support de l’installation de SlopCode sur Windows à l’aide de Bun est actuellement en cours de développement.

Vous pouvez également récupérer le binaire dans les Releases.


Configuration

Avec SlopCode, vous pouvez utiliser n’importe quel fournisseur de LLM en configurant ses clés API.

Si vous débutez avec les fournisseurs de LLM, nous vous recommandons d’utiliser SlopCode Zen. C’est une liste curée de modèles qui ont été testés et vérifiés par l’équipe SlopCode.

  1. Exécutez la commande /connect dans le TUI, sélectionnez slopcode et allez sur slopcode.dev/auth.

    /connect
  2. Connectez-vous, ajoutez vos informations de facturation et copiez votre clé API.

  3. Collez votre clé API.

    ┌ API key
    └ enter

Vous pouvez également sélectionner l’un des autres fournisseurs. En savoir plus.


Initialisation

Maintenant que vous avez configuré un fournisseur, vous pouvez accéder à un projet sur lequel vous voulez travailler.

Terminal window
cd /path/to/project

Et exécutez SlopCode.

Terminal window
slopcode

Ensuite, initialisez SlopCode pour le projet en exécutant la commande suivante.

/init

Cela permettra à SlopCode d’analyser votre projet et de créer un fichier AGENTS.md à la racine du projet.

Cela aide SlopCode à comprendre la structure du projet et les modèles de codage utilisés.


Utilisation

Vous êtes maintenant prêt à utiliser SlopCode pour travailler sur votre projet. N’hésitez pas à lui demander n’importe quoi !

Si vous débutez dans l’utilisation d’un agent de codage IA, voici quelques exemples qui pourraient aider.


Poser des questions

Vous pouvez demander à SlopCode de vous expliquer la base de code.

How is authentication handled in @packages/functions/src/api/index.ts

Ceci est utile s’il y a une partie de la base de code sur laquelle vous n’avez pas travaillé.


Ajouter des fonctionnalités

Vous pouvez demander à SlopCode d’ajouter de nouvelles fonctionnalités à votre projet. Cependant, nous recommandons d’abord de lui demander de créer un plan.

  1. Créer un plan

SlopCode dispose d’un Mode Plan qui désactive sa capacité à apporter des modifications et suggère plutôt comment il implémentera la fonctionnalité.

Accédez-y à l’aide de la touche Tab. Vous verrez un indicateur à cet effet dans le coin inférieur droit.

<TAB>

Décrivons maintenant ce que nous voulons qu’il fasse.

When a user deletes a note, we'd like to flag it as deleted in the database.
Then create a screen that shows all the recently deleted notes.
From this screen, the user can undelete a note or permanently delete it.

Vous souhaitez donner à SlopCode suffisamment de détails pour comprendre ce que vous voulez. Ça aide pour lui parler comme si vous parliez à un développeur junior de votre équipe.

  1. Itérer sur le plan

Une fois qu’il vous donne un plan, vous pouvez lui faire part de vos commentaires ou ajouter plus de détails.

We'd like to design this new screen using a design I've used before.
[Image #1] Take a look at this image and use it as a reference.

SlopCode peut scanner toutes les images que vous lui donnez et les ajouter à l’invite. Vous pouvez le faire en glissant et en déposant une image dans le terminal.

  1. Créez la fonctionnalité

Une fois que vous vous sentez à l’aise avec le plan, revenez au Mode Build en appuyant à nouveau sur la touche Tab.

<TAB>

Et demandez-lui d’apporter les modifications.

Sounds good! Go ahead and make the changes.

Apporter des modifications

Pour des modifications plus simples, vous pouvez demander à SlopCode de construire directement sans avoir à revoir le plan au préalable.

We need to add authentication to the /settings route. Take a look at how this is
handled in the /notes route in @packages/functions/src/notes.ts and implement
the same logic in @packages/functions/src/settings.ts

Vous devez fournir suffisamment de détails pour qu’SlopCode effectue les bonnes modifications.


Annuler les modifications

Disons que vous demandez à SlopCode d’apporter quelques modifications.

Can you refactor the function in @packages/functions/src/api/index.ts?

Mais vous réalisez que ce n’est pas ce que vous vouliez. Vous pouvez annuler les modifications à l’aide de la commande /undo.

/undo

SlopCode annulera désormais les modifications que vous avez apportées et affichera votre message d’origine encore.

Can you refactor the function in @packages/functions/src/api/index.ts?

À partir de là, vous pouvez modifier l’invite et demander à SlopCode de réessayer.

Ou vous pouvez refaire les modifications à l’aide de la commande /redo.

/redo

Partager

Les conversations que vous avez avec SlopCode peuvent être partagées avec votre équipe.

/share

Cela créera un lien vers la conversation en cours et le copiera dans votre presse-papiers.

Voici un exemple de conversation avec SlopCode.


Personnaliser

Et c’est tout ! Vous êtes désormais un pro de l’utilisation de SlopCode.

Pour vous l’approprier, nous vous recommandons de choisir un thème, de personnaliser les raccourcis clavier, de configurer les formateurs de code, de créer des commandes personnalisées ou de jouer avec la SlopCode Config.