{"id":5757,"date":"2016-03-26T21:20:25","date_gmt":"2016-03-26T20:20:25","guid":{"rendered":"https:\/\/www.creativejuiz.fr\/blog\/?p=5757"},"modified":"2016-03-29T11:29:23","modified_gmt":"2016-03-29T09:29:23","slug":"css3-flexbox-plongez-dans-css-modernes","status":"publish","type":"post","link":"https:\/\/www.creativejuiz.fr\/blog\/conseil-critique-livre\/css3-flexbox-plongez-dans-css-modernes","title":{"rendered":"CSS3 Flexbox \u2013 Plongez dans les CSS modernes"},"content":{"rendered":"<p>Le 18 f\u00e9vrier dernier est sorti le dernier bouquin de Rapha\u00ebl Goetter sur un aspect cette fois tr\u00e8s pr\u00e9cis de CSS : Flexible Box Layout Module (alias Flexbox). L&rsquo;objet de ce bouquin est de d\u00e9mystifier le module en tentant une explication point par point, et surtout en plongeant le lecteur dans des cas concrets.<\/p>\n<p><!--more--><\/p>\n<h2>L&rsquo;auteur<\/h2>\n<p><img decoding=\"async\" class=\"alignleft wp-image-5774\" src=\"https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2016\/03\/raph.jpg\" alt=\"Rapha\u00ebl Goetter\" width=\"125\" height=\"188\" srcset=\"https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2016\/03\/raph.jpg 250w, https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2016\/03\/raph-200x300.jpg 200w\" sizes=\"(max-width: 125px) 100vw, 125px\" \/>Rapha\u00ebl Goetter, on ne le pr\u00e9sente plus !<br \/>\nCr\u00e9ateur de la <a href=\"http:\/\/alsacreations.com\">communaut\u00e9 Alsacr\u00e9ations<\/a>, auteur de <a href=\"http:\/\/www.amazon.fr\/Rapha%C3%ABl-Goetter\/e\/B004N0JN1U\/ref=as_li_ss_tl?_encoding=UTF8&amp;camp=1642&amp;creative=19458&amp;linkCode=ur2&amp;tag=creajuiz-21\">nombreux ouvrages dans le domaine du web<\/a>, il est aussi co-g\u00e9rant de l&rsquo;<a href=\"http:\/\/alsacreations.fr\">agence web Alsacr\u00e9ations<\/a> et cr\u00e9ateur du <a href=\"http:\/\/knacss.com\">framework CSS Knacss<\/a> ainsi que consultant et formateur en mati\u00e8re de CSS(3) et de Responsive Webdesign aupr\u00e8s de groupes nationaux et internationaux.<br \/>\nIl est \u00e9galement Papa et collectionne avec ses enfants <a href=\"http:\/\/blog.goetter.fr\/2016\/03\/20\/pokeflex\/\">des cartes Pokemon<\/a> !<\/p>\n<p>Vous pouvez le suivre sur <a href=\"https:\/\/twitter.com\/goetter\">Twitter<\/a> ou sur <a href=\"http:\/\/blog.goetter.fr\/\">son blog personnel<\/a>.<\/p>\n<h2>Le livre<\/h2>\n<p><img decoding=\"async\" class=\"alignleft wp-image-5776\" src=\"https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2016\/03\/flexbox-css3.jpg\" alt=\"flexbox-css3\" width=\"248\" height=\"300\" srcset=\"https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2016\/03\/flexbox-css3.jpg 413w, https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2016\/03\/flexbox-css3-248x300.jpg 248w\" sizes=\"(max-width: 248px) 100vw, 248px\" \/><\/p>\n<p>Vous l&rsquo;aurez compris : il parle de Flexbox ! Mais il en parle tr\u00e8s en d\u00e9tail et, s&rsquo;il vous plait, en couleurs !<\/p>\n<p>Pour ceux qui ne connaissent pas encore Flexbox mais qui utilisent CSS depuis maintenant quelques ann\u00e9es, ce livre est fait pour vous.<\/p>\n<p>Pour ceux qui utilisent Flexbox comme une solution magique \u00e0 certains probl\u00e8mes de mise en page, ce livre est \u00e9galement fait pour vous, car vous finirez enfin par comprendre ce que vous faites, et le ferez mieux par la suite !<\/p>\n<p>&nbsp;<\/p>\n<h3>En bref<\/h3>\n<p>Avec plus de 130 pages d\u00e9di\u00e9es uniquement \u00e0 ce sujet, <em>CSS3 Flexbox<\/em> est l&rsquo;ouvrage francophone le plus complet sur Flexbox o\u00f9 le module est expliqu\u00e9, d\u00e9cortiqu\u00e9 et d\u00e9taill\u00e9 dans une suite d&rsquo;exemples et de cas concrets propos\u00e9s par l&rsquo;auteur.<\/p>\n<p>Bien ma\u00eetris\u00e9, Flexbox permet de faciliter la vie des int\u00e9grateurs dans le d\u00e9veloppement de site web en apportant des solutions \u00e0 des probl\u00e8mes du quotidien. Cet ouvrage est sp\u00e9cialement con\u00e7u pour r\u00e9pondre \u00e0 des cas concrets, r\u00e9alistes, et est constitu\u00e9 de travaux pratiques et d&rsquo;exemples d\u00e9cortiqu\u00e9s.<\/p>\n<h3>Au programme<\/h3>\n<p>Au menu vous retrouverez, dans l&rsquo;ordre :<\/p>\n<ol>\n<li>Un historique de Flexbox<\/li>\n<li>Les bases du design avec Flexbox<\/li>\n<li>TP : R\u00e9ordonner des \u00e9l\u00e9ments<\/li>\n<li>Trois astuces utiles<\/li>\n<li>TP : une navigation responsive<\/li>\n<li>TP : un gabarit simple<\/li>\n<li>TP : une galerie d&rsquo;images<\/li>\n<li>Les principes fondamentaux<\/li>\n<li>TP : un formulaire fluide<\/li>\n<li>La propri\u00e9t\u00e9 Flex en d\u00e9tail<\/li>\n<li>Mod\u00e8les de design<\/li>\n<li>TP : construction de grilles<\/li>\n<li>Encore plus loin avec Flexbox<\/li>\n<li>Performances et compatibilit\u00e9<\/li>\n<li>Flexbox contre Grid Layout ?<\/li>\n<li>Ressources utiles<\/li>\n<\/ol>\n<p>Un condens\u00e9 d&rsquo;informations utiles et pratiques mises \u00e0 l&rsquo;\u00e9preuve en situation r\u00e9elle par l&rsquo;auteur. (et vous m\u00eame par la suite :p)<\/p>\n<p style=\"text-align: center;\"><a class=\"demo\" href=\"http:\/\/goetter.fr\/livres\/flexbox\/\">Le site web officiel<\/a><\/p>\n<h2>Avis de lecture<\/h2>\n<p>C&rsquo;est pour moi un pari r\u00e9ussi de la part de Rapha\u00ebl. Ce bouquin m&rsquo;a permis de comprendre des aspects tr\u00e8s pr\u00e9cis de Flexbox que je mettais parfois sur le compte de \u00ab\u00a0\u00e7a d\u00e9pend\u00a0\u00bb (vous aussi pour le connaissez, avouez !)<br \/>\nJ&rsquo;avais commenc\u00e9 \u00e0 explorer ce module sans forc\u00e9ment aller au bout des choses car le support (\u00e0 l&rsquo;\u00e9poque) me semblait plut\u00f4t limit\u00e9. Aujourd&rsquo;hui je suis r\u00e9concili\u00e9 avec Flexbox gr\u00e2ce au support apport\u00e9 par nos navigateurs modernes, et les explications de ce bouquin.<\/p>\n<p>Je le conseille vivement \u00e0 tous les webdesigners, int\u00e9grateurs, d\u00e9veloppeur front-end ou m\u00eame chefs de projets un peu curieux ou d\u00e9veloppeur back-end qui veulent savoir o\u00f9 ils mettent les pieds s&rsquo;ils utilisent un jour une grille \u00ab\u00a0toute faite\u00a0\u00bb en Flexbox.<br \/>\nAttention cependant \u00e0 ne pas sauter d&rsquo;\u00e9tapes : je pense qu&rsquo;il faut malgr\u00e9 tout un certain bagage technique pour aborder sereinement la lecture de ce bouquin.<\/p>\n<p class=\"center\"><a class=\"livre\" href=\"http:\/\/www.amazon.fr\/gp\/product\/B01CDKHS8G\/ref=as_li_tl?ie=UTF8&amp;camp=1642&amp;creative=19458&amp;creativeASIN=B01CDKHS8G&amp;linkCode=as2&amp;tag=creajuiz-21\">Le bouquin sur Amazon<\/a> <a class=\"livre\" href=\"http:\/\/izibook.eyrolles.com\/produit\/4067\/9782212009286\/CSS%203%20Flexbox?affiliate_code=geoffrey_crofte\">Le bouquin chez Eyrolles<\/a><\/p>\n<p>Bonne lecture \u00e0 vous !<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Le 18 f\u00e9vrier dernier est sorti le dernier bouquin de Rapha\u00ebl Goetter sur un aspect cette fois tr\u00e8s pr\u00e9cis de CSS : Flexible Box Layout Module (alias Flexbox). L&rsquo;objet de ce bouquin est de d\u00e9mystifier le module en tentant une explication point par point, et surtout en plongeant le lecteur dans des cas concrets.<\/p>\n","protected":false},"author":4,"featured_media":5778,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_bluesky_dont_syndicate":"","_bluesky_syndication_accounts":"","_bluesky_syndication_text":"","footnotes":""},"categories":[140],"tags":[428,604,277],"coauthors":[597],"class_list":["post-5757","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-conseil-critique-livre","tag-css3","tag-flexbox","tag-raphael-goetter"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/posts\/5757","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/comments?post=5757"}],"version-history":[{"count":0,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/posts\/5757\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/media\/5778"}],"wp:attachment":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/media?parent=5757"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/categories?post=5757"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/tags?post=5757"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/coauthors?post=5757"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}