Developpez.com - Rubrique JavaScript

Le Club des Développeurs et IT Pro

Fuel UX, la bibliothèque JavaScript qui étend le Bootstrap de Twitter

Pour le développement Web

Le 2012-10-24 09:37:06, par vermine, Expert éminent sénior
Fuel UX, la bibliothèque JavaScript qui étend le Bootstrap de Twitter
pour le développement Web.


Fuel UX est une bibliothèque légère qui étend le Bootstrap de Twitter avec certains contrôles JavaScript supplémentaires, l'outil en ligne de commande Grunt pour construire des applications JavaScript et une compatibilité AMD (Asynchronous Module Definition).

Bootstrap rassemble des outils proposés par Twitter. Ceux-ci permettent de créer des applications Web à partir de templates HTML, de CSS, de formulaires, etc. pour réaliser des interfaces utilisateurs. Fuel UX complète cette liste d'outils.

Jusqu'à présent, les contrôles suivants sont inclus :

  • ComboBox : combine les input et les listes déroulantes pour une sélection de données simple et flexible ;
  • DataGrid : restitue les données dans une table avec la pagination, le tri et la recherche ;
  • Pillbox : gère les éléments sélectionnés avec des labels colorés ;
  • Search : combine les input et les button pour une recherche interactive ;
  • Spinner : fournit un input numérique avec incrémentation et décrémentation.


Le projet est documenté et espère ne pas s'arrêter-là. Les contributions extérieures sont d'ailleurs les bienvenues.

Les sources sur GitHub.
La documentation avec les exemples.
Le Bootstrap de Twitter.

Source : d'après un article sur DailyJS. Cet article parle également de uiji.js qui utilise les sélecteurs CSS pour construire des objets jQuery et de QuoJS pour le développement mobile.
  Discussion forum
1 commentaire
  • okoweb
    Membre confirmé
    Bonjour,
    Cette bibliothèque est géniale mais j'ai eu des soucis à l'intégrer dans un projet utilisant déjà bootstrap.
    Le widget qui m'a intéressé est datagrid.
    Dans mon projet j'avais déjà ce requirejs :
    Code :
    require(["jquery", "bootstrap.min", "m-radio.min"], function($e) {
    Du coup quand j'ajoute datagrid, ni mes js de bootstrap, ni datagrid ne fonctionne. Pourtant dans mon script initial mes js de bootstrap fonctionne à la perfection.
    Code :
    require(["jquery", "bootstrap.min", "m-radio.min", "data", "datasource", "datagrid"], function($, sampleData, StaticDataSource) {
    mais ça marche plutôt ainsi
    Code :
    require(["jquery", "data", "datasource", "datagrid"], function($, sampleData, StaticDataSource) {
    Et mes autres scripts js bootstrap ne fonctionnent plus.

    Où est-ce j'ai péché ?

    Merci d'avance...