6min.

La KiwiParty đŸ„ 2018, nous y Ă©tions !

Pour cette 9e Ă©dition de la KiwiParty Ă  Strasbourg, nous avons une nouvelle fois rĂ©pondu prĂ©sents, et avons eu la chance d’assister Ă  de nombreuses confĂ©rences de qualitĂ©.

Logo de la kiwiparty 2018

Par ailleurs, JoliCode a soutenu cette annĂ©e la KiwiParty en se portant sponsor. Nous en avons profitĂ© pour faire dĂ©couvrir aux visiteurs notre outil redirection.io, qui permet de gĂ©rer les plans de redirection de sites Web, en amĂ©liorant ainsi l’expĂ©rience utilisateur et en minimisant l’occurrence d’erreurs HTTP – un must have pour le SEO et pour les frontends de qualité !

En avant pour un rapide résumé de quelques conférences qui ont retenu notre attention.

##Manifeste pour un Web Ă©thique

Arnaud Malon nous a rappelĂ© qu’en tant que dĂ©veloppeurs, nous avons un rĂŽle primordial Ă  jouer pour garder le Web universel (👋 coucou les sites qui ne fonctionnent que sous Chrome 👋), respectueux des gens (en prenant en compte l’accessibilitĂ© numĂ©rique), de la vie privĂ©e et de la planĂšte.

Des exemples de tweets sujets Ă  controverse :

La présentation est disponible sur youtube.

##Embarquement Agile : Comment transmettre sa culture Ă  une nouvelle personne en 5 semaines ?

Florian Ferbach nous a prĂ©sentĂ© rapidement le processus d’intĂ©gration d’une nouvelle personne chez Marmelab : « l’embarquement Agile Â».

Le processus est assez atypique. Durant 5 semaines, la nouvelle recrue travaillera sur des projets annexes (5 sprints d’une semaine), encadrĂ©e par un tuteur et un product owner. La plupart des projets sont des jeux. Chaque rĂ©alisation vise Ă  faire sortir le dĂ©veloppeur de sa zone de confort et valider les savoir-faire mais Ă©galement les savoir-ĂȘtre des nouvelles recrues. La rĂ©trospective et la dĂ©mo sont organisĂ©es avec l’ensemble des employĂ©s de Marmelab.

La vidéo de la conférence est disponible sur youtube.

##MJML, le nouveau standard pour Ă©crire nos emails ?

Thomas Deneulin nous a présenté MJML, un package nodejs afin de simplifier la conception des emails.

En effet, lors de la conception d’un e-mail, deux critĂšres sont Ă  prendre en compte :

  • Le responsive ;
  • Le support des diffĂ©rents webmails.

Ces deux points Ă©tant difficiles Ă  traiter en temps normal, MJML nous propose une liste de composants disponibles afin de simplifier cette tĂąche :

Il y a de nombreuses contributions sur Github et mĂȘme une application MJML pour desktop afin de visualiser le rendu en temps rĂ©el.

Vous pouvez retrouvez sa conférence sur youtube.

##CSS3+, une plongée dans le futur

Dans une premiĂšre partie, Jonathan Giamporcaro nous a prĂ©sentĂ© quelques fonctionnalitĂ©s clĂ© en CSS pouvant ĂȘtre utilisĂ©es Ă  l’heure actuelle ou en passe de le devenir. Parmi celles-ci, nous avons notĂ© :

  • Flexbox (ModĂšle de positionnement) ;
  • Les propriĂ©tĂ©s personnalisĂ©s (Custom Properties) ;
  • Le Scroll snap points (Pour les sliders notamment) ;
  • Les sĂ©lecteurs de niveau 4 (:has, :placeholder-shown, :any-link, 
).

En deuxiÚme partie, Jonathan nous a parlé du projet révolutionnaire HOUDINI.

CSS Houdini permet d’exposer certaines parties du moteur CSS aux dĂ©veloppeurs via plusieurs API pour “hacker” le moteur de rendu CSS.

Parmi ces API, nous trouvons :

  • Layout API : Cette API permet aux dĂ©veloppeurs de crĂ©er leur propre algorithme de mise en page via la propriĂ©tĂ© CSS display ;
  • Typed Object Model : Il s’agit de fournir aux dĂ©veloppeurs une interface JavaScript permettant de manipuler le CSS ;
  • Paint API : Cette API permet de gĂ©nĂ©rer, en JavaScript, une image Ă  chaque fois qu’une propriĂ©tĂ© CSS attend une image.

Vous pouvez retrouvez sa conférence sur youtube.

##GĂ©rer le mode hors-ligne grĂące aux Service Workers

Corinne Schillinger nous a fait une prĂ©sentation, avec dĂ©mo Ă  l’appui, des Service workers. Ils offrent de nombreuses perspectives et peuvent notamment permettre de gĂ©rer le mode offline de nos sites ou applications. Ils viennent remplacer de vieux projets expĂ©rimentaux, comme par exemple Gears. Les Service Workers sont dĂ©sormais bien supportĂ©s par la plupart des navigateurs. Il faut voir le Service Worker comme un processus qui tourne en tĂąche de fond de votre navigateur et qui va exĂ©cuter des actions Ă  chaque fois que vous essayez d’accĂ©der au site pour lequel le Service Worker a Ă©tĂ© enregistrĂ©. Le Service Worker n’a pas accĂšs au DOM. Il est non-bloquant.

Pour le mettre en place, certains points doivent ĂȘtre respectĂ©s :

  • le protocole HTTPS, pour des raisons de sĂ©curitĂ©, la seule exception est localhost pour les environnements de dĂ©veloppement ;
  • la same-origin policy ;
  • Il est recommandĂ© de positionner le fichier JS Ă  la racine du projet pour ne pas limiter ses possibilitĂ©s d’action.

Corinne nous a montrĂ© un exemple d’implĂ©mentation avec la mise en cache des diffĂ©rents assets.

Vous pouvez retrouvez sa conférence sur youtube.

Section intitulĂ©e a-rel-nofollow-noopener-noreferrer-href-https-speakerdeck-com-slig36-arretez-de-nous-demander-combien-coute-une-ligne-de-code-arretez-de-nous-demander-combien-coute-une-ligne-de-code-aArrĂȘtez de nous demander combien coĂ»te une ligne de code !

AurĂ©lie Guillaume nous a proposĂ© d’aborder le coĂ»t d’une ligne de code.

Cette question est souvent posĂ©e par les clients – mĂȘme si pour notre part, nous n’avons jamais rencontrĂ© ce type de demande – avec comme attente une unitĂ© de mesure :

  • Notion de temps
  • Notion de prix
  • Notion de complexitĂ©
  • Notion de vĂ©locitĂ©
  • 


Cela peut ĂȘtre difficile de rĂ©pondre Ă  cette question car beaucoup de choses sont Ă  prendre en compte :

  • Les coĂ»ts humains ;
  • Les coĂ»ts de conception : gestion de projet, UI, UX, dĂ©veloppement, etc ;
  • Les coĂ»ts de Q/A & processus qualité ;
  • Les coĂ»ts de mise en place de l’infrastructure ;
  • CoĂ»t du « code legacy Â» & des Ă©volutions ;
  • Les failles de sĂ©curitĂ© ont aussi un coĂ»t
    • CoĂ»t en image pour l’entreprise ;
    • Perte directe du Chiffre d’Affaires ;
    • DĂ©veloppement en urgence pour sĂ©curiser la faille ;
    • Mise en pĂ©ril potentielle de la sociĂ©té ;
  • Le coĂ»t de la techno, Ă©ventuellement propriĂ©taire ;
  • La maniĂšre d’implĂ©menter le code peut aussi faire varier le coĂ»t : CMS, Framework ou from scratch.

Le coĂ»t d’une ligne de code n’est pas une Ă©quation, et il n’y a pas de rĂ©ponse Ă  la question « Combien coĂ»te une ligne de code ? Â». Au lieu de parler de coĂ»t, parlez plutĂŽt de valeur. Il faut simplement expliquer aux clients que leur projet ne doit pas ĂȘtre perçu comme un coĂ»t, mais une valeur rĂ©elle pour leurs entreprises.

Vous pouvez retrouver sa conférence sur youtube.

Section intitulĂ©e a-rel-nofollow-noopener-noreferrer-href-http-jonathanlevaillant-fr-2018-kiwiparty-pdf-preprocesseurs-vs-css-natif-le-match-aPrĂ©processeurs vs CSS natif : Le match !

Jonathan Levaillant a commencĂ© sa prĂ©sentation en mettant en Ă©vidence les dĂ©rives possibles des prĂ©-processeurs, et en donnant deux exemples :

  • Le nesting
  • La directive @extend

Il a ensuite confrontĂ© trois fonctionnalitĂ©s offertes par les prĂ©processeurs Ă  leurs Ă©quivalents en CSS natif :

  • calc() : Calcul sur des unitĂ©s diffĂ©rentes ;
  • custom properties var(–) : bĂ©nĂ©ficient de la cascade et peuvent ĂȘtre manipulĂ©es en JavaScript ;
  • pseudo-classe :matches : simplification d’écriture de sĂ©lecteurs.

Pour finir, il nous conseille d’utiliser les prĂ©-processeurs pour la partie dynamique, et le CSS natif pour la partie structurelle.

Vous pouvez retrouvez sa conférence sur youtube.

Section intitulĂ©e pour-finir-en-kiwiPour finir en Kiwi !

Merci Ă  l’équipe des bĂ©nĂ©voles pour l’organisation de cette Ă©dition 2018, qui Ă©tait une trĂšs belle rĂ©ussite. Nous n’avons pas pu aborder toutes les prĂ©sentations, mais vous en retrouverez les enregistrements sur youtube.

À l’annĂ©e prochaine !


Cet article porte sur la conférence Kiwi Party 2018.

Kiwi Party 2018

Commentaires et discussions

Nos articles sur le mĂȘme sujet

Ces clients ont profité de notre expertise