Créez votre première application Shiny en R : tutoriel pas à pas

D’une page à une seule sortie à une application interactive fonctionnelle — construite pièce par pièce.

Programming
Shiny

Créez votre première application Shiny à partir d’un fichier vierge. Commencez par la plus petite application possible, ajoutez un curseur, reliez-le à une sortie graphique réactive, lancez-la, modifiez l’entrée et regardez la sortie se mettre à jour, puis copiez un app.R complet à exécuter en local.

Date de publication

28 juin 2026

Modifié

17 juillet 2026

AstucePoints clés
  • La plus petite application est réelle. Un ui avec une sortie, un server qui la remplit, et shinyApp() — voilà une application complète et exécutable.
  • Ajoutez de l’interactivité en un seul geste : déposez une entrée (un sliderInput) dans le ui, puis lisez-la dans le server comme input$<id>.
  • La sortie réactive, c’est la récompense. Enveloppez un graphique dans renderPlot({ … }) qui lit input$bins ; Shiny le redessine à l’instant où le curseur bouge — pas d’actualisation, pas de code d’événement.
  • Lancez-la avec shiny::runApp() (ou le bouton Run App de RStudio) ; l’application s’ouvre dans un panneau de navigateur.
  • Construisez en faisant grandir, pas en devinant. Commencez petit, lancez, ajoutez une pièce, relancez — chaque exemple ici utilise des données intégrées et tourne tel quel.

Introduction

Vous connaissez l’anatomie — un ui, un server, et shinyApp() pour les relier (structure d’une application). Vous allez maintenant la mettre à l’œuvre et construire une application complète à partir d’un fichier vierge.

Nous allons la faire grandir par étapes : la plus petite application qui affiche une seule chose, puis une entrée, puis un graphique qui réagit à cette entrée. Chaque étape est une application complète et exécutable — vous la lancez, vous la voyez fonctionner, et vous ajoutez la pièce suivante. À la fin, vous aurez un histogramme des temps d’éruption d’Old Faithful avec un curseur qui contrôle le nombre de barres, et vous aurez vu le graphique se redessiner pendant que vous le déplacez. Cette mise à jour en direct est tout l’intérêt de Shiny.

Nous utilisons le jeu de données intégré faithful de R, donc tout tourne avec pour seule installation le package shiny.

Étape 1 : la plus petite application possible

Commencez par le strict minimum d’une application : un ui qui réserve un emplacement de sortie, un server qui le remplit, et l’appel de lancement. Nous afficherons d’abord une simple ligne de texte — sans entrée pour l’instant — pour prouver que la forme fonctionne.

# app.R
library(shiny)

ui <- fluidPage(
  titlePanel("Old Faithful eruptions"),
  textOutput("intro")
)

server <- function(input, output, session) {
  output$intro <- renderText({
    "This app will plot eruption waiting times."
  })
}

shinyApp(ui = ui, server = server)

Le ui réserve un emplacement de texte avec textOutput("intro") ; le server remplit cet id exact avec output$intro <- renderText({ … }). La correspondance des ids — "intro" aux deux endroits — c’est la connexion (voir structure d’une application pour le contrat d’id complet). Enregistrez ceci sous app.R et vous avez une application qui tourne, fût-elle ennuyeuse.

NoteCopiez l’application finale dans app.R et exécutez-la en local

Le code de cette page n’est pas exécuté ici — une application Shiny a besoin d’une session R active, elle ne peut donc pas tourner dans une page web statique. Copiez n’importe quel bloc dans un fichier app.R et exécutez-le en local avec shiny::runApp() (ou cliquez sur Run App dans RStudio). Chaque exemple est autonome et n’utilise que des données intégrées, il tourne donc tel quel.

Étape 2 : ajouter une entrée

Une ligne statique n’est pas interactive. Ajoutez un contrôle d’entrée — un curseur — pour que l’utilisateur ait quelque chose à modifier. Les entrées vont dans le ui ; chaque contrôle prend un inputId comme premier argument, c’est ainsi que le server le lira plus tard.

# app.R
library(shiny)

ui <- fluidPage(
  titlePanel("Old Faithful eruptions"),
  sidebarLayout(
    sidebarPanel(
      sliderInput("bins", "Number of bins:",
                  min = 1, max = 50, value = 30)
    ),
    mainPanel(
      textOutput("intro")
    )
  )
)

server <- function(input, output, session) {
  output$intro <- renderText({
    paste("You chose", input$bins, "bins.")
  })
}

shinyApp(ui = ui, server = server)

Deux choses ont changé. Le ui utilise maintenant sidebarLayout() pour placer le curseur dans un panneau latéral et la sortie dans le panneau principal — une mise en page propre et standard. Et le server lit la valeur du curseur comme input$bins — le même id que celui avec lequel le curseur a été déclaré. Lancez ceci et déplacez le curseur : la ligne de texte se met à jour avec le nombre que vous choisissez. Cette mise à jour automatique est la réactivité, et vous n’avez écrit aucun code pour la déclencher.

Étape 3 : relier l’entrée à un graphique réactif

Le texte convient pour une démo, mais le vrai but est un graphique qui répond au curseur. Remplacez la sortie texte par une sortie graphique, et faites en sorte que le server dessine un histogramme dont le nombre de barres vient de input$bins.

Dans le ui, réservez un emplacement de graphique avec plotOutput("distPlot"). Dans le server, remplissez cet id avec renderPlot({ … }) — une fonction de rendu qui lit input$bins et dessine l’histogramme. Comme le graphique lit input$bins, Shiny sait qu’il dépend du curseur et le redessine dès que le curseur bouge.

# app.R
library(shiny)

ui <- fluidPage(
  titlePanel("Old Faithful eruptions"),
  sidebarLayout(
    sidebarPanel(
      sliderInput("bins", "Number of bins:",
                  min = 1, max = 50, value = 30)
    ),
    mainPanel(
      plotOutput("distPlot")
    )
  )
)

server <- function(input, output, session) {
  output$distPlot <- renderPlot({
    x    <- faithful$waiting
    bins <- seq(min(x), max(x), length.out = input$bins + 1)
    hist(x, breaks = bins, col = "#3a86d4", border = "white",
         xlab = "Waiting time to next eruption (min)", main = "")
  })
}

shinyApp(ui = ui, server = server)

Lisez le bloc du server comme une phrase : prendre les temps d’attente, les découper en input$bins intervalles égaux, dessiner l’histogramme. La seule pièce mobile est input$bins — tout le reste est fixe. Chaque type de rendu a un emplacement de sortie correspondant : renderPlot remplit plotOutput, renderText remplit textOutput, renderTable remplit tableOutput. Appariez-les par id et Shiny s’occupe du reste.

Étape 4 : lancez-la et faites un changement

Enregistrez le fichier sous app.R et lancez-le :

shiny::runApp()

Dans RStudio, vous pouvez plutôt cliquer sur le bouton Run App qui apparaît au-dessus d’un app.R ouvert. Dans les deux cas, l’application s’ouvre — un curseur à gauche, un histogramme à droite.

Screenshot of the running Shiny app titled Old Faithful eruptions, showing a Number of bins slider set to 30 beside a histogram of eruption waiting times.

L’application en cours d’exécution : un curseur Number of bins à gauche, et un histogramme des temps d’attente des éruptions d’Old Faithful à droite.

Maintenant la récompense : déplacez le curseur. À mesure que vous le bougez, l’histogramme se redessine instantanément — des barres grossières et larges en bas, une forme finement détaillée en haut. Vous avez modifié une entrée et la sortie qui en dépend s’est recalculée d’elle-même. C’est la réactivité, et c’est pourquoi une application Shiny semble vivante là où un rapport statique est figé. Vous n’avez jamais écrit de gestionnaire « au changement » ; déclarer que le graphique lit input$bins a suffi.

Pour arrêter l’application, appuyez sur Échap dans la console R (ou cliquez sur le bouton stop rouge dans RStudio). La session R est occupée pendant que l’application tourne, arrêtez-la donc avant d’exécuter d’autre code.

L’application complète

Voici le app.R terminé d’un seul tenant — copiez l’ensemble dans un fichier nommé app.R et lancez-le :

# app.R — your first Shiny app
library(shiny)

# ui — what the user sees
ui <- fluidPage(
  titlePanel("Old Faithful eruptions"),
  sidebarLayout(
    sidebarPanel(
      sliderInput("bins", "Number of bins:",
                  min = 1, max = 50, value = 30)
    ),
    mainPanel(
      plotOutput("distPlot")
    )
  )
)

# server — the R logic
server <- function(input, output, session) {
  output$distPlot <- renderPlot({
    x    <- faithful$waiting
    bins <- seq(min(x), max(x), length.out = input$bins + 1)
    hist(x, breaks = bins, col = "#3a86d4", border = "white",
         xlab = "Waiting time to next eruption (min)", main = "")
  })
}

# launch
shinyApp(ui = ui, server = server)

Voilà une vraie application Shiny fonctionnelle : une entrée, une sortie réactive, et le câblage entre les deux. Tout ce qui est plus grand — plus d’entrées, des tableaux, des tableaux de bord — ce sont les trois mêmes parties, répétées.

Pas de R installé ? Exécutez cette application exacte en direct dans votre navigateur — elle démarre R avec WebAssembly, rien à installer. Ouvrir dans le Playground ▸

Problèmes fréquents

L’application s’affiche mais la zone du graphique est vide. L’outputId et le nom output$ ne correspondent pas. plotOutput("distPlot") est rempli par output$distPlot — exactement la même orthographe, casse comprise. Une faute de frappe d’un côté ou de l’autre laisse l’emplacement vide, sans erreur. Vérifiez que les deux chaînes concordent.

L’application refuse de se lancer / « could not find function shinyApp ». Une application à fichier unique doit se terminer par shinyApp(ui = ui, server = server) ; sans cette dernière ligne, ui et server ne sont que des objets et rien ne démarre. Confirmez aussi que le fichier est nommé app.R et que library(shiny) est en haut — un package manquant ou une parenthèse/virgule non appariée stoppe l’application avant son chargement.

Le curseur bouge mais rien ne se met à jour (« grisé » / figé). Deux causes. Si toute l’application est atténuée et ne répond pas, la session R a probablement rencontré une erreur en plein rendu — vérifiez la console R pour un message rouge. Si le curseur bouge mais pas le graphique, le code de rendu ne lit pas réellement l’entrée : le graphique ne réagit qu’aux entrées qu’il lit, assurez-vous donc que input$bins apparaît à l’intérieur du bloc renderPlot({ … }).

Questions fréquentes

Enregistrez l’application dans un fichier nommé app.R, puis exécutez shiny::runApp() depuis la console R (cela lance l’application dans le dossier courant). Dans RStudio, vous pouvez plutôt cliquer sur le bouton Run App au-dessus d’un app.R ouvert. L’application s’ouvre dans un panneau de navigateur et continue de tourner jusqu’à ce que vous l’arrêtiez.

L’emplacement de sortie et l’affectation dans le server utilisent des ids différents. Une sortie déclarée plotOutput("distPlot") doit être remplie par output$distPlot — les noms doivent correspondre exactement, casse comprise. Une non-concordance laisse l’emplacement vide sans aucun message d’erreur, vérifiez donc d’abord les deux orthographes.

Appuyez sur Échap dans la console R (ou cliquez sur le bouton stop rouge dans RStudio). Tant qu’une application tourne, elle occupe la session R, vous devez donc l’arrêter avant de pouvoir exécuter d’autre code R.

Un ui avec une sortie, un server qui la remplit, et shinyApp(ui, server) pour la lancer — trois courts blocs dans un seul app.R. Vous n’avez besoin d’aucune entrée pour avoir une application valide et exécutable ; vous les ajoutez quand vous voulez que l’utilisateur change quelque chose.

Non. RStudio ajoute le pratique bouton Run App, mais n’importe quelle configuration fonctionne : écrivez app.R dans n’importe quel éditeur et lancez-le avec shiny::runApp() depuis une console R. Posit Cloud exécute le tout dans un navigateur sans rien à installer — voir installation et configuration.

Testez vos connaissances

Étendez l’application terminée pour que l’utilisateur puisse choisir la couleur des barres de l’histogramme. Ajoutez une seconde entrée au ui — un selectInput avec l’id "col" proposant quelques couleurs (par ex. "steelblue", "tomato", "seagreen") — et faites en sorte que l’histogramme l’utilise.

Ajoutez selectInput("col", "Bar colour:", choices = c("steelblue", "tomato", "seagreen")) au sidebarPanel. Puis lisez-le dans renderPlot comme input$col et passez-le à hist(..., col = input$col). Les noms doivent correspondre : "col" dans le ui, input$col dans le server.

# app.R
library(shiny)

ui <- fluidPage(
  titlePanel("Old Faithful eruptions"),
  sidebarLayout(
    sidebarPanel(
      sliderInput("bins", "Number of bins:",
                  min = 1, max = 50, value = 30),
      selectInput("col", "Bar colour:",
                  choices = c("steelblue", "tomato", "seagreen"))
    ),
    mainPanel(
      plotOutput("distPlot")
    )
  )
)

server <- function(input, output, session) {
  output$distPlot <- renderPlot({
    x    <- faithful$waiting
    bins <- seq(min(x), max(x), length.out = input$bins + 1)
    hist(x, breaks = bins, col = input$col, border = "white",
         xlab = "Waiting time to next eruption (min)", main = "")
  })
}

shinyApp(ui = ui, server = server)

Le graphique lit maintenant deux entrées — input$bins et input$col — donc Shiny le redessine dès que l’une ou l’autre change. Ajouter de l’interactivité, c’est toujours ce schéma : une nouvelle entrée dans le ui, le input$<id> correspondant lu à l’intérieur d’une fonction de rendu.

Dans l’application ci-dessus, qu’est-ce qui fait que l’histogramme se redessine quand vous déplacez le curseur ?

A. Un bouton d’actualisation que l’utilisateur clique après avoir déplacé le curseur. B. Le bloc renderPlot lit input$bins, donc Shiny le redessine dès que bins change. C. Une fonction observe() qui surveille le curseur. D. Le sliderInput appelle directement renderPlot.

B. Comme le code de rendu lit input$bins, Shiny sait que le graphique dépend du curseur et le redessine automatiquement quand la valeur change — c’est la réactivité. A est faux : il n’y a pas d’étape d’actualisation. C est faux : aucun observateur n’est nécessaire pour une sortie qui lit directement l’entrée. D est faux : le ui et le server ne s’appellent jamais — ils ne sont reliés que par la correspondance des ids.

Conclusion

Vous avez construit une application Shiny complète en la faisant grandir : la plus petite application à sortie seule, puis un curseur, puis un graphique qui y réagit — et vous avez vu l’histogramme se redessiner pendant que vous déplaciez le curseur. Cette boucle — lire une entrée à l’intérieur d’une fonction de rendu, et la sortie se met à jour d’elle-même — est le cœur de chaque application Shiny que vous écrirez un jour. Les applications plus grandes ont simplement plus d’entrées et plus de sorties câblées de la même façon.

La mise à jour automatique que vous avez vue, c’est la réactivité, et jusqu’ici vous n’en avez utilisé que la forme la plus simple. Ensuite, vous apprendrez comment elle fonctionne réellement — les expressions réactives, quand le code se réexécute, et comment garder une application rapide à mesure qu’elle grandit.

Leçons connexes

Cette page vous a-t-elle été utile ?

Recevez les nouvelles leçons R & Python par e-mail

Pratique, reproductible, sans spam. Désinscription à tout moment.

Double opt-in. Nous ne partageons jamais votre e-mail.

Partager cette pageXLinkedInRedditHN

Réutilisation

Citation

BibTeX
@online{2026,
  author = {},
  title = {Créez votre première application Shiny en R : tutoriel pas à
    pas},
  date = {2026-06-28},
  url = {https://www.datanovia.com/learn/programming/shiny/foundations/first-app},
  langid = {fr}
}
Veuillez citer ce travail comme suit :
“Créez votre première application Shiny en R : tutoriel pas à pas.” 2026. June 28. https://www.datanovia.com/learn/programming/shiny/foundations/first-app.