À la découverte de Shiny

Shiny, qu’est-ce que c’est ?

Envie de partager vos plus beaux projets R ? Ah, ce que l’on vous comprend ! Eh bien, bonne nouvelle : les équipes de RStudio ont développé Shiny, un package qui vous permet de créer des applications dynamiques pour le web… incontournable pour partager avec le monde entier ! Facile d’accès dans sa version “basique” (aka, sans trop mettre la main dans le design), ce package crée des applications web, sans avoir à toucher au HTML, ni au CSS..

Shiny, comment ça marche ?

Bon, c’est bien beau tout ça, mais concrètement, comment ça se passe ? Tout commence par l’installation (à noter que le package est préinstallé dans RStudio) :

[pastacode lang=”R” manual=”install.packages(%22shiny%22)%0Alibrary(shiny)” message=”” highlight=”” provider=”manual”/]

Une fois la librairie chargée, vous découperez votre application Shiny en deux éléments, une partie “ui” (pour User Interface, soit tout ce qui sera affiché à l’utilisateur), et une partie “server” (qui contiendra toutes les commandes qui s’opèreront côté serveur, dans R).

Commençons par la partie “ui”. Il s’agit de la portion de votre code qui contiendra les éléments graphique de l’interface de votre application Shiny : d’abord les éléments de mise en page (titre, nombre et taille des éléments, boutons et sliders, etc.). Mais surtout, cette partie contiendra les composantes de votre application : des objets qui communiqueront avec la partie serveur, pour venir afficher ces éléments (tableaux, dataviz, code…) dans votre interface graphique.

UI

On ne vous le répétera jamais assez : rien de mieux qu’un exemple pour bien comprendre ! Alors, pour découvrir Shiny, nous allons travailler ensemble sur la création d’une application (très simple) qui vous permet de voir les X premières lignes d’un des jeux de données proposés, X étant un chiffre entré par l’utilisateur. Commençons par UI :

[pastacode lang=”R” manual=”%23%20D%C3%A9finition%20de%20l’interface%20utilisateur%20de%20notre%20application%20%0Aui%20%3C-%20shinyUI(fluidPage(%0A%20%20%0A%20%20%23%20Le%20titre%20de%20votre%20application%0A%20%20titlePanel(%22Aper%C3%A7u%20d’un%20dataset%22)%2C%0A%20%20%0A%20%20%23Indiquer%20le%20’layout’%20de%20votre%20application%20%3A%20autrement%20dit%20le%20squelette%20visuel%20de%20l’application%20%0A%20%20sidebarLayout(%0A%20%20%20%20%23Composants%20de%20la%20r%C3%A9gion%20gauche%20de%20l’application%20%0A%20%20%20%20sidebarPanel(%0A%20%20%20%20%20%20%23Ici%2C%20nous%20ins%C3%A9rons%20un%20champ%20pour%20entrer%20un%20chiffre%2C%20ainsi%20qu’un%20menu%20d%C3%A9roulant%0A%20%20%20%20%20%20textInput(inputId%20%3D%20%22lignes%22%2C%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20label%20%3D%20%22Combien%20de%20lignes%20voulez-vous%20voir%20%3F%20%22%2C%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20value%20%3D%2010)%2C%20%0A%20%20%20%20%20%20selectInput(inputId%20%3D%20%22labs%22%2C%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20label%20%3D%20%22Dataset%22%2C%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20choice%20%3D%20c(%22cars%22%2C%22rock%22%2C%22beaver1%22%2C%20%22sleep%22)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20)%0A%20%20%20%20)%2C%0A%20%20%20%20%0A%20%20%20%20%23Ici%2C%20nous%20indiquons%20l’%C3%A9lement%20qui%20sera%20pr%C3%A9sent%20dans%20la%20fen%C3%AAtre%20principale%20%3A%20l’element%20%22dataset%22%2C%20qui%20est%20un%20graph%20%0A%20%20%20%20mainPanel(%0A%20%20%20%20%20%20tableOutput(%22dataset%22)%0A%20%20%20%20)%0A%20%20)))” message=”” highlight=”” provider=”manual”/]

Server

Penchons-nous maintenant sur la partie serveur. C’est ici que vous entrerez tout votre code R, qui s’exécutera avant tout affichage de votre application. Autrement dit, c’est lui qui crée les éléments qui seront affichés dans l’interface. C’est dans cette partie que sont appelées les composantes.

[pastacode lang=”R” manual=”server%20%3C-%20shinyServer(function(input%2C%20output)%20%7B%0A%20%20%23On%20retrouve%20ici%20l’%C3%A9lement%20%22dataset%22%2C%20qui%20communique%20avec%20ui%20par%20’output’.%20%0A%20%20output%24dataset%20%3C-%20renderTable(%7B%0A%20%20%20%20%23Nous%20imprimons%20les%20%C3%A9l%C3%A9ments%20d’apr%C3%A8s%20les%20donn%C3%A9es%20en%20entr%C3%A9e%20%3A%20ces%20derniers%20sont%20appell%C3%A9s%20avec%20%60%C3%ACnput%60%20puis%20le%20nom%20de%20la%20composante%20de%20ui%20(ici%20’labs’%20et%20’lignes’)%0A%20%20%20if(input%24labs%20%3D%3D%20%22cars%22)%7B%0A%20%20%20%20%20print(head(cars%2C%20input%24lignes))%0A%20%20%20%7D%20else%20if(input%24labs%20%3D%3D%20%22rock%22)%7B%0A%20%20%20%20%20print(head(rock%2C%20input%24lignes))%0A%20%20%7D%20else%20if(input%24labs%20%3D%3D%20%22sleep%22)%7B%0A%20%20%20%20%20print(head(sleep%2C%20input%24lignes))%0A%20%20%7D%20else%20%7B%0A%20%20%20%20%20print(head(beaver1%2C%20input%24lignes))%0A%20%20%20%7D%0A%20%20%7D)%0A%7D)” message=”” highlight=”” provider=”manual”/]

Enfin, pour voir votre application en local, c’est très simple.

[pastacode lang=”R” manual=”shinyApp(ui%2C%20server)” message=”” highlight=”” provider=”manual”/]

Une fenêtre s’ouvre, et vous pouvez désormais admirer votre application !

Shiny, un peu plus loin

Vous vous en doutez, il est possible d’aller beaucoup plus loin que cette première application, notamment en terme de design (mais pour cela, il faudra peut-être mettre un peu les mains dans le HTML et/ou dans le CSS). Vous pouvez également charger des thèmes préfaits, par exemple pour réaliser des tableaux de bords. Et bien sûr, au delà du visionnage en local, il est possible de déployer votre application sur le web : soit en passant par https://www.shinyapps.io/, soit en installant votre propre serveur — une solution de choix en contexte pro. Mais tout ça c’est une autre histoire, peuplée de Shiny Server et de Shiny Proxy… et nous en reparlerons plus tard !

Vous avez envie de créer vos apps, mais vous êtes un peu perdu ? La solution : appelez-nous, nous vous proposerons une solution de développement Shiny sur-mesure. Et, si vous tenez à le faire par vous même, nous avons la formation qui vous convient ! Et surtout, n’oubliez pas d’imprimer, de plastifier et de garder toujours sous le coude notre Cheatsheet en français 😉 !