Comment développer plus rapidement des sites pour les smartphones et les tablettes

Découvrez comment les frameworks vont vous permettre de développer beaucoup plus rapidement des sites pour Smartphone et Tablette.

Parmi les frameworks les plus connus vous verrez jQuery et BootStrap 3.

Tout est dans la vidéo ci-dessous.

[ppmaccordion][ppmtoggle title= »Afficher le texte de la vidéo »]

Comment développer plus rapidement des sites  pour les smartphones et les tablettes

 Bonjour à tous et bienvenu sur Développement Facile.

Ici Matthieu expert en développement applicatif, dans cette nouvelle vidéo je vais partager des concepts très importants qui vont vous permettre de développer plus rapidement vos sites Internet, vos applications, vos jeux, que ce soit pour les Smartphones, les tablettes ou les ordinateurs de bureau.

Les frameworks

Il vous suffit d’utiliser des Framework, c’est un ensemble de classes prêtes à l’emploi et l’avantage des Frameworks c’est que ça a été développé par des experts en développement, selon les frameworks plusieurs dizaines, plusieurs centaines de développeurs qui travaillent dessus, qui les améliorent qui les optimistes, et donc vous profitez ainsi l’expérience, des compétences de ces experts en développement, vous avez un gain de temps énorme parce ce que vous avez pas besoin d’effectuer toutes les recherches, toutes les optimisations de A à Z, vous avez déjà un framework qui est optimisé, performant, ça va vous permettre de créer beaucoup plus rapidement vos applications, vos sites pour les Smoby, les Smartphones et les tablettes, parce que par exemple pour créer un formulaire vous appellerez une classe, pour créer un appel Ajax vous appellerez une classe, pour faire tout un tas d’éléments, le cliquer déposer, vous utiliserez plusieurs fonctions JavaScript vous gagnez un temps énorme, vous avez par exemple, le framework vraiment que je vous conseille c’est jQueryMobile, si vous connaissez jQuery, jQueryUI, jQueryMobile est vraiment très simple à apprendre, très simple utiliser et si vous le connaissez pas du tout, ça tombe bien sur développement facile, sur jQuery, jQueryUI, jQueryMobile, il y a une bonne trentaine, voir 40 cours gratuit, ce sont des cours entièrement gratuits, toujours la vidéo, le code source et vos questions à l’équipe développement facile qui répondent toujours pour vous aider à vous en sortir, vous chercher dans le moteur de recherche vous tapez jQuery mobile, vous trouverez tous les cours gratuits, sinon vous avez également le framework bootstrap3 qui est très léger et très simple à utiliser également, donc vous permet de faire de l’ajax, de gérer CSS 3, HTML 5, vous avez tout un tas de fonctionnalités près intégrées donc pareil, il y a une dizaine de cours, voir une vingtaine de cours, sur bootstrap 3, des cours entièrement gratuits sur développement facile toujours avec une vidéo, le code source bootstrap3, comment l’utiliser, vous pouvez télécharger, voir les résultats en direct ce que ça donne, et derrière, posez toutes vos questions à l’équipe développement facile, qui vous répondra en direct donc jQuery mobile avec les cours disponibles gratuits sur développement facile, bootstrap3 avec les court gratuits sur développement facile, ces deux frameworks vont vous aider à créer des sites compatibles avec les Smartphonesn les tablettesn les ordinateurs de bureaun à utiliser des fonctionnalités près intégrées donc des sites qui fonctionnent sur la majorité des navigateurs Web.

Voir les exemples

Je vous montre des exemples de code source de jQuery mobile et bootstrap3, ça va vous permettre de voir visuellement un petit peu ce que vous pouvez faire, je ne vais pas vous expliquer les codes sources en détail, il y a les cours gratuits pour ça, au moins vous verrez ce que ça donne d’une façon visuelle donc c’est parti pour les exemples de code source.

Alors, pour vous mettre un petit peu l’eau à la bouche, voici un exemple d’utilisation du framework bootstrap, si ça vous intéresse, si ça vous convainc d’aller beaucoup plus loin avec bootstrap3 il y a tout un tas de tutoriels entièrement gratuits sur développement facile.com, donc sur développement – facile.com, vous trouverez à une bonne dizaine de tutoriels entièrement gratuits pour que vous puissiez apprendre à utiliser tout le potentiel de bootstrap3, donc c’est pour ça que je vais aller assez vite dans cette présentation, avec le fichier, un fichier CSS c’est une extension de bootstrap3 et là les fichiers JavaScript donc bootstrap3 repose sur jQuery, et par-dessus il y a une couche bootstrap donc bootstrap, globalement, comment il fonctionne utilise des classes et vous utilisez des divs, des images et vous affectez une classe pour une image avec les bords arrondis, une image sous forme de crecle, une image dans un cadre, pour mettre un lien sur une image, et donc avec les classes vous allez créer de la mise en forme bootstrap3, vous allez pouvoir utiliser la mise en forme de bootstrap3, création d’un cadre, toujours avec la classe submail, ça définit la taille de l’affichage sur un Smartphone, sur une tablette, sur un ordinateur de bureau, voilà, je vais très vite volontairement le but c’est de vous montrer ce que ça donne comme résultat, toujours le même logo, qui est affiché de différentes manières et uniquement grâce à la classe qui est affectée à l’image tout simplement, et donc vous avez des mises en forme, des créations de boutons avec une petite icône et votre texte, tout ça ça se fait grâce au framework Bootstrap 3 qui est vraiment très simple à utiliser vu que c’est globalement des classes CSS que vous allez appeler et définir des options dans les divs pour votre affichage qui sera conforme, que ce soit sur des Smartphones, des tablettes, des ordinateurs bureau et avec la majorité des navigateurs.

Pour jQuery c’est pareil, je vais aller assez vite, donc vous intégrez le CSS du fichier jQuery Mobile, le fichier JavaScript et le JavaScript de jQuery mobile et donc la même principe pour jQuery, vous utilisez des balises avec des attributs donc des options pour effectuer l’affichage de vos différents éléments là pour jQuery Mobile, toujours avec des classes, des classes CSS qui vont effectuer la mise en forme automatique de vos éléments, data rôle très important avec jQuery Mobile, le thème que vous choisissez pour l’affichage est ce que l’on peut fermer, c’est tombé en fait, c’est une navigation par menu accordions et donc ça vous donne ça à l’écran, vous avez votre menu en bas compatible sur mobile, donc l’affichage s’adapte forcément en fonction de la taille de l’écran disponible et un système d’accordions automatique, mais vous pouvez imbriquer des accordions les uns dans les autres, mettre des images dans votre accordions, des boutons également vous avez des boutons que vous pouvez ajouter donc c’est vraiment très pratique et vous voyez il y a pas tant de code que ça en fait, on définit des options sur chaque élément de de votre menu accordion, donc là également sur développement–facile.com il y a énormément de tutoriels sur jQuery, jQuery mobile, jQuery UI, donc je vous invite à les regarder pour apprendre à utiliser tout le potentiels de ce Framework pour créer des applications, des sites Internet compatibles avec les Smartphones, les tablettes, les ordinateurs de bureau, c’est exactement la même chose pour bootstrap3.

Votre plan d’actions !

Maintenant c’est à vous de jouer, je vous encourage fortement à choisir des Framework selon les besoins de votre application, les besoins de votre jeu, choisissez des Framework que ce soit jQuery, jQuery UI, jQuery mobile, bootstrap ou prototype, vraiment toujours il y a énormément de Frameworks disponibles donc avec les frameworks vous allez accélérer le développement de vos applications, de votre jeu sur les mobiles donc déjà sous cette vidéo, vous retrouverez le Framework jQuery mobile, jQuery, Bootstrap3 en téléchargement comme ça vous pourrez directement les utiliser dans votre développement, dans vos projets applicatifs, si vous avez des questions comme d’habitude posez les directement sous cette vidéo. Je vous invite à, là j’ai mis un URL, un lien cliquable ou une image à cliquer dessus et on se retrouve dans la deuxième vidéo, dans la deuxième vidéo vous allez apprendre à utiliser de A à Z jQuery, jQuery UI, jQuery Mobile, bootstrap3, vous allez apprendre, vous allez même avoir des exemples d’applications très complexes, très évoluées pour utiliser ces frameworks dans le détail, vous allez par exemple découvrir la programmation orientée objet avec JavaScript, la programmation événementielle, les modèles de conceptions, tout ça c’est expliqué en détail dans la deuxième vidéo, en plus il y a l’équipe développement facile qui vous accompagne personnellement pour vous aider à surmonter vos problèmes de code, vos difficultés donc tout cela c’est expliqué dans la deuxième vidéo dans le détail, cliquez simplement sur l’image, sur le lien lancer la deuxième vidéo, je vous explique, je vous retrouve tout de suite dans la deuxième vidéo, à tout de suite.

[/ppmtoggle] [/ppmaccordion]

Quel Framework utilisez vous ?

Venez nous présentez dans la zone commentaire les frameworks que vous utilisez le plus.