Tutoriel

Devenez un p***** de développeur

Programming, motherfucker est une communauté de développeurs humiliés depuis des années par les programmes, les méthodologies et le management, tous centrés sur les heures facturables et les tests sans intérêt. Alors que le développeur veut surtout… développer. Tiens, en parlant de développement web, voici une sacrée liste de tutoriels qui devrait faire de vous un p***** de développeur ^__^ →

Frameworks Javascript

jQuip — jQuery en partie

jQuip est une initiative lancée par Demis Bellot dont l’objectif est de rendre jQuery modulable pour éviter d’avoir des Ko en trop. Le projet jQuip démontre que 90% des fonctions les plus utilisées de jQuery pourraient se caser dans 13% de la taille actuelle du framework, soit seulement 4.28 Ko minifiés et gzippés, nous apprend developpez.com. Grosso modo le découpage de jQuery opéré par jQuip (Ajax, CSS, Docready, events, sélecteurs) permettrait de n’utiliser que les parties de jQuery nécessaires à un projet ou à une page web spécifique.

Frameworks Javascript

Popcorn.js is — Framework Javascript vidéo & audio HTML5

Popcorn.js is est un framework Javascript créé par Mozilla pour faciliter la création de vidéos interactives. Popcorn normalise les propriétés, les méthodes et les événements natifs des éléments média audio et video HTML5 sous la forme d’une API extensible via des plugins. En gros, il s’agit du jQuery de la vidéo. C’est dire l’ambition des concepteurs qui espèrent révolutionner le monde de la vidéo en l’adaptant au web via l’utilisation des ressources visuelles, audios et vidéos disponibles sur les réseaux sociaux. →

Plugin jQuery

Blueberry : un diaporama « responsive »

Blueberry est un plugin jQuery expérimental et open source permettant de faire défiler des images (Slider) dans un environnement fluide (Responsive Web Design). Les utilisateurs utilisent de plus en plus souvent des smartphones pour consulter des pages web ; les intégrateurs web ont donc de plus en plus besoin de maquettes flexibles pour les satisfaire. Voici donc un diaporama adapté à cet usage. →

Plugin jQuery

Elastislide : un carousel jQuery réactif (Responsive Webdesign)

Le webdesign réactif (traduction approximative de Responsive Webdesign) est un ensemble de techniques permettant d’adapter la mise en page d’un site web selon le périphérique de l’utilisateur. Avec l’arrivée des Media Queries en CSS3, le webdesign réactif devient de plus en plus utilisé. Il manquait toutefois des carousels réactifs. C’est le cas de Elastislide qui profitera au mieux des caractéristiques de l’écran. Via @guerrier. →

Tutoriel

Apprendre jQuery

La série Decoding jQuery proposée par Shi Chuan (créateur de Mobile Boilerplate et faisant partie de l’équipe de HTML5 Boilerplate) nous propose une immersion (en anglais) dans le code source de jQuery. Après 4 parties consacrée aux bases du framework et aux subtilités de la programmation objet dans jQuery, l’auteur attaque les fonctions et les méthodes principales qui font le charme de jQuery ( extend(), isWindow(), parseXML(), globalEval() et toArray() ) pour le moment. →

Tutoriel

Codecademy : un cours Javascript interactif et ludique

Apprennez les bases de la programmation Javascript de manière interactive et pro-active avec Codecademy. Ce site propose une console dans laquelle l’apprenant est inviter à saisir des lignes de code pour voir ce que ça donne. Très simple, voire basique, cette initiative permettra néanmoins à celles et ceux qui veulent se lancer dans la programmation d’avoir quelques bases tout en s’amusant. Vous pourrez partager votre avancement dans les leçons avec vos amis pour une saine émulation et un système de badges vous donnera des jalons pour mesurer vos progrès. Via roget.biz

Plugin jQuery

FlexSlider — un Slider flexible et sémantique pour jQuery

FlexSlider est un slider, un de plus, qui permettra de faire défiler vos contenus avec le marquage HTML de votre choix.  FlexSlider est utilisable avec le clavier, ce qui est toujours bon pour l’accessibilité ; son poids plume (6 kb minifié) est également un atout de taille. Il est possible d’ajouter une légende (caption) pour chaque image. Pour cela, une simple balise p sous l’image suffit. Pour plus de sémantique et pour profiter des nouvelles balises apportées dans la hotte du Père Noël HTML5, il faudrait tester FlexSlider avec une balise figure et un bon vieux figcaption des familles. Merci à @allfordesign et @oncletom pour la suggestion 🙂 →