{"id":351,"date":"2023-09-21T15:19:33","date_gmt":"2023-09-21T13:19:33","guid":{"rendered":"https:\/\/niwadev.com\/?p=351"},"modified":"2025-01-27T14:21:25","modified_gmt":"2025-01-27T13:21:25","slug":"nouvelles-technologies-fascinantes-ce-que-j-ai-retenu-de-la-conference-des-developpeurs-web-2023-a-hambourg","status":"publish","type":"post","link":"https:\/\/niwadev.com\/fr\/blog\/fascinating-new-technologies-my-takeaways-from-the-web-developer-conference-2023-in-hamburg\/","title":{"rendered":"Nouvelles technologies fascinantes - Ce que j'ai retenu de la conf\u00e9rence des d\u00e9veloppeurs Web 2023 \u00e0 Hambourg"},"content":{"rendered":"<p>Trois jours de conf\u00e9rence pour les d\u00e9veloppeurs web \u00e0 Hambourg. De nombreux ateliers, conf\u00e9rences et sessions de d\u00e9veloppement ont permis de pr\u00e9senter les innovations en mati\u00e8re de d\u00e9veloppement web. Les formats \u00e9taient aussi diff\u00e9rents que les sujets \u00e9taient vastes. Du Clean Code aux innovations technologiques en passant par l'IA avec ChatGPT et GitHub Copilot. Rien n'a \u00e9t\u00e9 oubli\u00e9.<\/p>\n\n\n\n<!--more-->\n\n\n\n<h2 class=\"gb-headline gb-headline-31e2764b gb-headline-text\">La WDC en quelques mots<\/h2>\n\n\n\n<h3 class=\"gb-headline gb-headline-02295dfb gb-headline-text\">\ud83c\udfd7\ufe0f Web Components<\/h3>\n\n\n\n<p>Le premier jour, j'ai particip\u00e9 \u00e0 une session de d\u00e9veloppement sur les Web Components avec TypeScript. De mon point de vue, les Web Components peuvent \u00eatre une bonne alternative dans certains sc\u00e9narios, \u00e0 moins que vous ne travailliez avec React. Ce framework est construit sur un DOM virtuel qui n'a rien \u00e0 voir avec le DOM r\u00e9el que le navigateur web finit par afficher. Par cons\u00e9quent, il y a des difficult\u00e9s lorsque vous travaillez avec les \u00e9v\u00e9nements ou le contenu des \u00e9l\u00e9ments, comme l'\u00e9l\u00e9ment input.<\/p>\n\n\n\n<h3 class=\"gb-headline gb-headline-3be06acc gb-headline-text\">\ud83c\udf10 Web Sockets<\/h3>\n\n\n\n<p>Les applications Web progressives ont besoin de donn\u00e9es provenant du backend et peuvent recevoir en permanence de nouvelles informations provenant de services par le biais de diff\u00e9rentes approches. Les Web Sockets sont l'avenir pour cela et s'adaptent bien. Un autre grand avantage des Web Sockets est la possibilit\u00e9 de communiquer en temps r\u00e9el. Cependant, vous devez toujours mettre en \u0153uvre le polling long comme solution de repli. En effet, \u00e0 l'heure actuelle, les Web Sockets ne sont pas prises en charge par tous les navigateurs\/syst\u00e8mes.<br>Autre fait int\u00e9ressant : des chercheurs exp\u00e9rimentent actuellement la possibilit\u00e9 de diffuser des sites web entiers vers le client \u00e0 l'aide de Web Sockets.<\/p>\n\n\n\n<h3 class=\"gb-headline gb-headline-c68cbda2 gb-headline-text\">\ud83d\udd10 D\u00e9veloppement d'API s\u00e9curis\u00e9es<\/h3>\n\n\n\n<p class=\"translation-block\">Les <a href=\"https:\/\/owasp.org\/API-Security\/editions\/2023\/en\/0x11-t10\/\" target=\"_blank\" rel=\"noopener\">OWASP Top Ten<\/a> ont pour but de sensibiliser le public. Le d\u00e9veloppement de logiciels s\u00e9curis\u00e9s ne s'arr\u00eate pas l\u00e0 : il peut s'agir de surveiller la cha\u00eene d'approvisionnement des logiciels (par exemple avec Snyk) ou d'adh\u00e9rer \u00e0 certains principes : \"Ne faites confiance \u00e0 aucune donn\u00e9e provenant de syst\u00e8mes tiers (internes ou externes)\". M\u00eame les syst\u00e8mes de confiance peuvent \u00eatre pirat\u00e9s, ce qui peut avoir un impact sur les appelants. Une validation stricte reste un facteur important \u00e0 cet \u00e9gard.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"768\" src=\"https:\/\/niwadev.com\/wp-content\/uploads\/2023\/09\/IMG_5337-1024x768.jpeg\" alt=\"Presentation of OWASP Top Ten and API Security, showing title slide on a TV screen.\" class=\"wp-image-353\" srcset=\"https:\/\/niwadev.com\/wp-content\/uploads\/2023\/09\/IMG_5337-1024x768.jpeg 1024w, https:\/\/niwadev.com\/wp-content\/uploads\/2023\/09\/IMG_5337-300x225.jpeg 300w, https:\/\/niwadev.com\/wp-content\/uploads\/2023\/09\/IMG_5337-768x576.jpeg 768w, https:\/\/niwadev.com\/wp-content\/uploads\/2023\/09\/IMG_5337-1536x1152.jpeg 1536w, https:\/\/niwadev.com\/wp-content\/uploads\/2023\/09\/IMG_5337-2048x1536.jpeg 2048w, https:\/\/niwadev.com\/wp-content\/uploads\/2023\/09\/IMG_5337-16x12.jpeg 16w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<h3 class=\"gb-headline gb-headline-06bb7fb8 gb-headline-text\">\ud83e\udde0 Nouvelles sur le d\u00e9veloppement de l'IA <\/h3>\n\n\n\n<p>Avec le service OpenAI d'Azure, il est relativement facile de construire une variante personnalis\u00e9e de ChatGPT pour vous-m\u00eame. Vous pouvez cr\u00e9er un chatbot intelligent pour votre service client par exemple. En entrant vos propres donn\u00e9es et en sp\u00e9cifiant ce \u00e0 quoi l'IA r\u00e9pond, vous avez le contr\u00f4le sur les r\u00e9ponses.<\/p>\n\n\n\n<h3 class=\"gb-headline gb-headline-cc197e24 gb-headline-text\">\u2601\ufe0f Bicep, Terraform, Pulumi - Un aper\u00e7u de l'Infrastructure-as-Code<\/h3>\n\n\n\n<p>Pour ceux qui utilisent Azure et se lancent dans l'Infrastructure-as-Code (IaC), Bicep est un bon outil \u00e0 avoir sous la main. Terraform est excellent pour les environnements cross-cloud. Cependant, vous devez savoir comment couvrir la gestion des \u00e9tats. Pulumi semble avoir du sens lorsque vous livrez votre application en tant que produit.<\/p>\n\n\n\n<h3 class=\"gb-headline gb-headline-0569d6ac gb-headline-text\">\ud83d\udea7 Fonctionnement en tant que service sans \"Cold Start\" (d\u00e9marrage \u00e0 froid)<\/h3>\n\n\n\n<p class=\"translation-block\">Gr\u00e2ce \u00e0 <a href=\"https:\/\/www.fermyon.com\/spin\" target=\"_blank\" rel=\"noopener\">Fermyon Spin<\/a>, vous pouvez \u00e9crire des fonctions Rust qui sont compil\u00e9es en WebAssembly et qui d\u00e9marrent donc aussi vite qu'une fl\u00e8che. De plus, ces fonctions n'ont pas besoin d'\u00eatre h\u00e9berg\u00e9es dans le Fermyon Cloud, puisque vous pouvez \u00e9galement mettre en place les syst\u00e8mes sur site. Un SDK est disponible pour de nombreux langages connus (par exemple Go ou TypeScript). Mais il n'est pas n\u00e9cessaire de l'utiliser.<br>Mon point fort personnel de la conf\u00e9rence !<\/p>\n\n\n\n<p>Si vous ne savez pas ce qu'est le FaaS, consultez la description de mon service \u00e0 <a href=\"https:\/\/niwadev.com\/fr\/faas-function-as-a-service\/\" target=\"_blank\" rel=\"noopener\" title=\"FaaS \u2013 Function-as-a-Service\">Function-as-a-Service.<\/a><\/p>\n\n\n\n<h3 class=\"gb-headline gb-headline-024b8854 gb-headline-text\">\ud83e\uddea D\u00e9veloppement pilot\u00e9 par les tests sur le frontend ?<\/h3>\n\n\n\n<p>Le TDD sur le frontend est tout aussi possible et m\u00eame plus facile avec Vitest qu'avec Jest. Ici, vous pouvez prendre Vitest comme un remplacement direct dans l'application et obtenir un mocking simplifi\u00e9 en plus. \u00c0 l'avenir, des solutions comme Playwright Components pourront couvrir la partie o\u00f9 un navigateur est n\u00e9cessaire pour tester le composant.<\/p>\n\n\n\n<p>Vous \u00eates int\u00e9ress\u00e9 par le TDD. Jetez un coup d'\u0153il \u00e0 mes <a href=\"https:\/\/niwadev.com\/fr\/tdd-test-driven-development\/\" target=\"_blank\" rel=\"noopener\" title=\"TDD \u2013 Test-Driven-Development\">services de d\u00e9veloppement pilot\u00e9 par les tests.<\/a><\/p>\n\n\n\n<h3 class=\"gb-headline gb-headline-1cc397bd gb-headline-text\">\ud83d\udcbb Innovations dans Next.JS<\/h3>\n\n\n\n<p>J'ai travaill\u00e9 intensivement avec Next.JS lors du d\u00e9veloppement de mon premier site web. Mais il s'est pass\u00e9 beaucoup de choses au cours de l'ann\u00e9e \u00e9coul\u00e9e. Avec l'App Router, le projet est d\u00e9sormais structur\u00e9 diff\u00e9remment. Mais les API sont \u00e9galement plus faciles \u00e0 \u00e9crire. Chaque verbe HTTP a sa propre m\u00e9thode.<\/p>\n\n\n\n<h2 class=\"gb-headline gb-headline-40d03c21 gb-headline-text\">Conclusion<\/h2>\n\n\n\n<p>Lors de la conf\u00e9rence, j'ai d\u00e9couvert de nombreux d\u00e9veloppements qui m'auraient \u00e9chapp\u00e9 dans mon travail quotidien. Je vais certainement regarder de plus pr\u00e8s Fermyon Spin, qui semble r\u00e9soudre un gros probl\u00e8me de FaaS. De plus, j'ai \u00e9galement eu l'occasion de revoir Hambourg apr\u00e8s presque 15 ans et je suis tr\u00e8s enthousiaste \u00e0 propos de cette ville.<\/p>\n\n\n\n<p> <\/p>","protected":false},"excerpt":{"rendered":"<p>Trois jours de conf\u00e9rence pour les d\u00e9veloppeurs web \u00e0 Hambourg. De nombreux ateliers, conf\u00e9rences et sessions de d\u00e9veloppement ont permis de pr\u00e9senter les innovations en mati\u00e8re de d\u00e9veloppement web. Les formats \u00e9taient aussi diff\u00e9rents que les sujets \u00e9taient vastes. Du Clean Code aux innovations technologiques en passant par l'IA avec ChatGPT et GitHub Copilot. Rien n'a \u00e9t\u00e9 oubli\u00e9.<\/p>","protected":false},"author":2,"featured_media":361,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_uag_custom_page_level_css":"","footnotes":""},"categories":[1],"tags":[24,18,21,22],"class_list":["post-351","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","tag-net","tag-azure","tag-cloud","tag-faas"],"aioseo_notices":[],"uagb_featured_image_src":{"full":["https:\/\/niwadev.com\/wp-content\/uploads\/2023\/10\/web-developer-conference-title.webp",1200,400,false],"thumbnail":["https:\/\/niwadev.com\/wp-content\/uploads\/2023\/10\/web-developer-conference-title-150x150.webp",150,150,true],"medium":["https:\/\/niwadev.com\/wp-content\/uploads\/2023\/10\/web-developer-conference-title-300x100.webp",300,100,true],"medium_large":["https:\/\/niwadev.com\/wp-content\/uploads\/2023\/10\/web-developer-conference-title-768x256.webp",768,256,true],"large":["https:\/\/niwadev.com\/wp-content\/uploads\/2023\/10\/web-developer-conference-title-1024x341.webp",1024,341,true],"1536x1536":["https:\/\/niwadev.com\/wp-content\/uploads\/2023\/10\/web-developer-conference-title.webp",1200,400,false],"2048x2048":["https:\/\/niwadev.com\/wp-content\/uploads\/2023\/10\/web-developer-conference-title.webp",1200,400,false],"trp-custom-language-flag":["https:\/\/niwadev.com\/wp-content\/uploads\/2023\/10\/web-developer-conference-title-18x6.webp",18,6,true]},"uagb_author_info":{"display_name":"Nicolas Wazulek","author_link":"https:\/\/niwadev.com\/fr\/blog\/author\/u_auth_niwa\/"},"uagb_comment_info":0,"uagb_excerpt":"Three days of Web Developer Conference in Hamburg. With many workshops, talks and dev sessions, the innovations in web development were presented. As different as the formats were, as extensive were the topics. From Clean Code to innovations in technology to AI with ChatGPT and GitHub Copilot. Nothing was left out.","_links":{"self":[{"href":"https:\/\/niwadev.com\/fr\/wp-json\/wp\/v2\/posts\/351","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/niwadev.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/niwadev.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/niwadev.com\/fr\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/niwadev.com\/fr\/wp-json\/wp\/v2\/comments?post=351"}],"version-history":[{"count":1,"href":"https:\/\/niwadev.com\/fr\/wp-json\/wp\/v2\/posts\/351\/revisions"}],"predecessor-version":[{"id":958,"href":"https:\/\/niwadev.com\/fr\/wp-json\/wp\/v2\/posts\/351\/revisions\/958"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/niwadev.com\/fr\/wp-json\/wp\/v2\/media\/361"}],"wp:attachment":[{"href":"https:\/\/niwadev.com\/fr\/wp-json\/wp\/v2\/media?parent=351"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/niwadev.com\/fr\/wp-json\/wp\/v2\/categories?post=351"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/niwadev.com\/fr\/wp-json\/wp\/v2\/tags?post=351"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}