Utiliser Bootstrap Map pour vos applications JavaScript ArcGIS

Si vous avez parcouru ou utilisé la documentation de l'API JavaScript ArcGIS, vous aurez constaté qu'en rédigeant quelques lignes de code HTML/Javascript, on peut réaliser très simplement une première application web cartographique. L'étape suivante consiste généralement à ajouter des fonctionnalités plus avancées. Là encore, avec la richesse des exemples fournis dans la documentation cela reste assez simple de reprendre les morceaux de code adéquats pour les adapter à vos besoins. Une fois les premiers tests fonctionnels réalisés, il vous faudra probablement lever les mains du clavier et réfléchir sérieusement au design de votre application. Une connexion internet sur deux se faisant à partir d'un appareil mobile, il ne faudra pas oublier l'aspect "responsive" de votre application pour qu'elle s'adapte à tous les types d'écrans. C'est généralement là que ça se complique, et encore, vous n'avez pas commencé à rédiger vos pages HTML, votre code Javascript et vos styles CSS ! 

D'autres développeurs et concepteurs d'applications web ont déjà rencontré les mêmes difficultés et des solutions existent pour gagner du temps sur ces aspects et pouvoir créer rapidement des applications web au design moderne et "responsive". En particulier, plusieurs frameworks CSS très pratiques existent comme: Skeleton, Foundation Zurb, Yaml ou encore Bootstrap qui est aujourd'hui un des plus populaires.

Vous avez dit Boostrap ?

Bootstrap est un framework Open Source développé par les équipes de Twitter. Il fournit un ensemble de ressources (CSS, JavaScript et Fonts) permettant d'organiser les espaces des pages de votre application (à l'aide d'un système découpant la page en une grille) et d'y intégrer des éléments d'interface prêt à l'emploi comme des boutons, des listes, des boîtes de dialogue, des carrousels,  des icônes, des menus, des barre de progressions, ... tout cela dans un style homogène et paramétrable.

Et la carte dans tout ça ?

Pour vous permettre d'utiliser le framework Bootstrap dans le cadre de votre application web ArcGIS, Esri propose Bootstrap Map JS. Il s'agit d'un projet Open Source (dont le code est disponible ici sur l'espace GitHub d'Esri) qui permet à l'aide de quelques lignes de paramétrage de tirer profit à la fois du framework Bootstrap 3.0 et de l'API JavaScript ArcGIS construire une application web cartographique en responsive design. Après avoir télécharger Bootstrap Map JS, vous aurez la possibilité de choisir parmi différents modèles de pages et de les dériver pour concevoir l'application selon vos besoins. 

Bootstrap Map JS permet de gagner du temps dans la conception de la page de l'application en s'appuyant sur un framework très puissant. Il existe de nombreux exemples de sites web exploitant Bootstrap et vous trouverez une richesse de composants supplémentaires (souvent en JQuery) pour aller encore plus loin dans vos interfaces. 

Il ne me reste qu'à vous encourager à découvrir Bootstrap Map JS et n'hésitez pas à faire part de vos remarques sur ce projet et même à contribuer à son enrichissement via l'espace GitHub d'Esri.