# L'IA dans le développement : # Quelles utilisations ? ## 1. **Détour pour expliquer le sujet** Participation à différents événements à venir + toujours une envie de donner des confs dans un avenir plus ou moins proche ## 2. **Mon projet en début d'année inspiré par Electronic Tales** **Mission** : Accompagner les devs, en particulier les devs sous-représenté·e·s dans la Tech (souvent issu·e·s de formations courtes et axées sur une/deux technos) par des cursus autour de ce que nous appelons la computer culture : **fondamentaux de la computer science (algo, architecture des ordinateurs...), du hardware (comment démonter un ordi ?), du hacking, aide pour démarrer dans l'open source, etc.**  **Atelier : L'archéologie des ordinateurs** - Exploration et démontage de machines pour comprendre leur fonctionnement. - Un atelier que je voulais tester aux **GD**, mais je n'ai pas encore lancé le projet. ## 3. Intérêt pour leur approche  <!-- .element: style="height: 400px;" -->  <!-- .element: style="height: 400px;" --> ## 4. **Who Run The Tech** - Meetups à venir - **25 mars** : Data/IA - **17 juin** : Développement (web/mobile) - **23 septembre** : Cloud, Infrastructure - **25 novembre** : Cybersécurité Je voulais proposer l'archéologie des ordinateurs mais ne correspond pas, selon moi, aux thèmes proposés. ## 5. **Réflexions sur l'IA dans le développement** - **Vidéo vue** : [L'IA est en train de s'empoisonner elle-même (et personne n'en parle)](https://www.youtube.com/watch?v=AfgAEIK9F8c) - L'IA génère du contenu qu'elle réutilise pour se renforcer — phénomène de **consanguinité informatique**. - **Risque ?** : L'IA génère peu de nouveautés dans le code. - Piste de solution : **est-ce qu'on peut utiliser notre veille pour améliorer les résultats obtenus ?** ## 6. **Test : Propriété `:has()` en CSS** - **HTML/CSS** seulement pour expérimenter. - **Propriété `:has()`**. - Exemple simple, à voir si applicable à des cas plus complexes. **Article intéressant sur le sujet** : [More Real-World Uses for :has()](https://css-tricks.com/more-real-world-uses-for-has/)<br> **Autre article avec de nombreux exemples (y compris comment ça permet de faire un dark mode sans JS - et qui explique également les limites que ça implique)** : [The Undeniable Utility Of CSS :has](https://www.joshwcomeau.com/css/has/) <!-- .element: style="text-align:left" --> ## Prompt utilisé Génère un fichier HTML et CSS affichant une grille de cartes dynamiques.<br> <!-- .element: style="text-align:left" --> Chaque carte peut contenir du texte, une image, ou un bouton.<br> La mise en page doit être responsive, avec une grille fluide qui s’adapte à la taille de l’écran.<br> Styles attendus :<br> Cartes avec une image → doivent être mises en avant avec un fond coloré et une largeur plus grande.<br> Cartes avec un bouton → doivent avoir une bordure distinctive et un effet de survol qui change le fond.<br> Ajoute une animation fluide au survol des cartes (box-shadow, transform).<br> Code bien structuré et clair.<br> <!-- .element: style="text-align:left" --> [Version 1 du code](https://codepen.io/Audrey-Belhoste/pen/NPWjZaz) ### Suite du prompt : <!-- .element: style="text-align:left" --> Je préfère que tu utilises la propriété :has() <!-- .element: style="text-align:left" --> [Version avec :has()](https://codepen.io/Audrey-Belhoste/pen/MYWmMrR) ## 7. **Donc quelles utilisations de l'IA ?** - Exemple simpliste qui sert à illustrer que l'on peut utiliser la veille pour affiner et améliorer nos **prompts IA**. - Dans l'avenir, j'ai plutôt envie de me tourner vers des **fichiers d'exemple** : Fournir des fichiers qui servent de modèle pour générer du code, pour les tests par exemple. ## 8. **Merci pour votre attention** **Pour retrouver la présentation** : [https://prez.slickteam.fr/](https://prez.slickteam.fr/)