Ehi Gemini, sistema il CSS! Parlare con i DevTools in linguaggio naturale

Abstract

Quante ore passiamo con il tasto destro su “Ispeziona”, navigando tra DOM tree infiniti e regole CSS sovrascritte, solo per capire perché quel margin non si applica o perché il layout si rompe su un device specifico?

L’AI generativa ci aiuta già a scrivere codice nell’editor, ma il vero “dolore” del Frontend Developer è nel browser, a runtime. In questo talk vedremo come il Model Context Protocol (MCP) permette di collegare l’intelligenza di Gemini direttamente al motore di Chrome.

Trasformeremo il browser in un collaboratore attivo a cui chiedere – in linguaggio naturale:

• “Perché questo elemento non è centrato?” (Debug del Box Model)
• “Controlla il contrasto dei colori in Dark Mode.” (Audit di Accessibilità)
• “Fammi vedere come appare questa sezione su un tablet 1024px.” (Testing Responsivo automatizzato)

Niente più caccia al tesoro nei pannelli dei DevTools: una demo pratica per scoprire come l’AI può diventare il “pair designer” che hai sempre sognato, direttamente nel tuo terminale.