> For the complete documentation index, see [llms.txt](https://smedai.aivd.ch/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://smedai.aivd.ch/applications/gitbook/creer/blocs/blocs-de-code.md).

# Blocs de code

{% hint style="info" %}
Cette page vise des **contributeurs invités**.

Vous pouvez éditer le contenu d’un ou plusieurs espaces.

Vous n’avez généralement pas accès aux réglages d’**organisation**, de **site publié** ou de **mise en ligne**.

Pour ces sujets, contactez les responsables de l’espace ou l’équipe SIC.
{% endhint %}

Vous pouvez ajouter du code à vos pages GitBook en utilisant des blocs de code.

Lorsque vous ajoutez un bloc de code, vous pouvez définir la syntaxe, afficher des numéros de ligne, ajouter une légende, ou activer le retour à la ligne. Vous pouvez aussi copier le code en un clic.

Un bloc de code peut être utile pour :

* Partager des configurations
* Ajouter des extraits de code
* Partager des fichiers de code
* Montrer des exemples d'utilisation d'utilitaires en ligne de commande
* Montrer comment appeler des endpoints d'API
* Et bien plus encore !

#### Exemple d'un bloc de code

{% code title="index.js" overflow="wrap" lineNumbers="true" %}

```javascript
import * as React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(<App />, window.document.getElementById('root'));
```

{% endcode %}

Vous pouvez également combiner des blocs de code avec un [bloc d'onglets](/applications/gitbook/creer/blocs/onglets.md) pour proposer le même exemple de code dans plusieurs langues différentes :

{% tabs %}
{% tab title="JavaScript" %}
{% code title="example.js" %}

```javascript
let greeting = function (name) {
  console.log(`Hello, ${name}!`);
};
greeting("Anna");
```

{% endcode %}
{% endtab %}

{% tab title="Ruby" %}
{% code title="example.rb" %}

```ruby
greeting = lambda {|name| puts "Hello, #{name}!"}
greeting.("Anna")
```

{% endcode %}
{% endtab %}

{% tab title="Elixir" %}
{% code title="example.exs" %}

```elixir
greeting = fn name -> IO.puts("Hello, #{name}!") end
greeting.("Anna")
```

{% endcode %}
{% endtab %}
{% endtabs %}

{% hint style="info" %}
Vous pouvez rendre les blocs de code [pleine largeur](/applications/gitbook/creer/blocs.md#blocs-pleine-largeur) en cliquant sur le **menu Options** à côté du bloc, puis **Pleine largeur**.

<img src="https://gitbook.com/docs/~gitbook/image?url=https%3A%2F%2F3903131528-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FNkEGS7hzeqa35sMXQZ4X%252Fuploads%252FaS1QvPIBVYwhpFTGcPBN%252Foptions-menu.svg%3Falt%3Dmedia%26token%3D3ee40bbf-f4fb-41fa-aa30-306b559cbe88&#x26;width=300&#x26;dpr=3&#x26;quality=100&#x26;sign=54060725&#x26;sv=2" alt="The Options menu icon in GitBook" data-size="original">
{% endhint %}

#### Options du bloc de code

Lorsque vous cliquez sur le **menu Options** à côté du bloc de code, ou sur le **menu Actions** dans le bloc lui-même, vous verrez plusieurs options que vous pouvez définir.

**Définir la syntaxe**

Vous pouvez définir la syntaxe dans votre bloc de code pour n'importe quel langage pris en charge. Cela activera également la coloration syntaxique pour ce langage.

{% hint style="info" %}
Nous utilisons [Prism](https://github.com/PrismJS/prism) pour la coloration syntaxique. Vous pouvez utiliser [Test Drive Prism](https://prismjs.com/test.html#language=markup) pour vérifier quels langages Prism prend en charge. Si vous remarquez une discordance entre GitBook et Prism, il se peut que nous soyons en retard d'une ou deux versions.
{% endhint %}

{% code title="filename.txt" %}

```
// Du code
```

{% endcode %}

**Avec numéros de ligne**

Cela activera ou désactivera les numéros de ligne pour votre code.

Afficher les numéros de ligne est utile lorsque le code représente le contenu d'un fichier dans son ensemble, ou lorsque vous avez de longs blocs de code avec de nombreuses lignes. Masquer les numéros de ligne est utile pour des extraits, des instructions d'utilisation pour des expressions en ligne de commande ou terminal et des scénarios similaires.

**Avec légende**

Cela activera ou désactivera une légende qui se place en haut du bloc, au-dessus de vos lignes de code.

La légende est souvent le nom d'un fichier comme montré dans notre exemple ci‑dessus, mais vous pouvez aussi l'utiliser comme titre, description, ou tout autre élément de votre choix.

**Enrouler le code**

Cela activera ou désactivera le retour à la ligne du code, de sorte que les longues lignes de code seront renvoyées à la ligne pour être toutes visibles sur la page en même temps.

Le renvoi à la ligne est utile lorsque votre code est long et que vous voulez éviter que le lecteur ait à faire défiler de gauche à droite pour le lire. Si vous activez **Enrouler le code**, vous voudrez peut-être aussi afficher les numéros de ligne — cela facilitera la lecture du code et la compréhension du début des nouvelles lignes.

**Extensible**

Cela activera ou désactivera l'affichage du code en entier (lorsque l'interrupteur est désactivé) ou une fenêtre repliée du code que l'utilisateur peut développer (lorsque l'interrupteur est activé).

La vue repliée affiche par défaut 10 lignes de code avec un bouton pour développer et afficher le bloc de code complet. S'il y a moins de 10 lignes de code, tout le contenu sera affiché.

#### Actions sur le bloc de code

En plus des options ci‑dessus, vous pouvez également changer la langue affichée par le bloc de code et copier votre code instantanément.

**Copier le code**

Survolez un bloc de code et un certain nombre d'icônes apparaîtront. Cliquez sur l'icône du milieu pour copier le contenu du bloc de code dans votre presse‑papiers.

#### Représentation en Markdown

{% code title="index.js" overflow="wrap" lineNumbers="true" %}

```javascript
import * as React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(<App />, window.document.getElementById('root'));
```

{% endcode %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://smedai.aivd.ch/applications/gitbook/creer/blocs/blocs-de-code.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
