FEVR Frontenders Verona

Leggere è un’attività molto complessa che sempre più spesso si svolge davanti a schermi di smartphone, tablet e computer. Quando trattiamo la tipografia o il layout di un sito web ci sono molte variabili di cui dobbiamo tenere conto, sia come designer che come sviluppatori. In questo intervento faremo un’incursione nel campo della leggibilità*, esplorando studi, metodologie, pratiche e tecniche che possono aiutarci a rendere il nostro sito più confortevole per gli utenti.Edoardo Cavazza

Stitches is a modern styling library. Built with developer experience in mind, it introduces first-class tokens, variants, themes and other features to improve the creation of design systems.

FEVR presenta The KanbanKlub Verona.Il primo appuntamento il 1 Giugno in streaming su questo gruppo, con Giulio RoggeroIn un contesto Agile i Feature Teams sono una delle strutture organizzative più efficaci per sviluppare un ecosistema complesso in modo rapido, mantenendo alta la qualità e basso il TCO (total cost of ownership). Spesso questi team sono però vincolati da architetture monolitiche, o a lasagna/spaghetti, che non consentono di operare end-to-end sulle feature, creando dipendenze tra team, colli di bottiglia e frustrazione. Lo stile architetturale a Microservizi (sì, è uno stile e non un pattern e quindi va interpretato a seconda dei casi) da una mano a questi team ad essere più indipendenti tra loro e li aiuta a lavorare tutti con lo stesso scopo: generare valore per gli utenti finali in modo continuo. In questo talk vedremo come organizzare più team che lavorano su uno stesso prodotto e come lo stile architetturale a Microservizi supporti questa organizzazione evolvendo con l'evolversi dei team

Facciamo un viaggio insieme per capire come funziona TypeScript: partiremo dalle basi per arrivare man mano a capire come modellare casi più complessi e interessati, sfruttando al meglio le features che questo linguaggio ci offre, ad esempio per modellare tipi algebrici ed alcuni trick da sfruttare per rendere type-safe alcuni pattern di programmazione "dinamica" che normalmente usiamo in JavaScript. Alla fine della sessione arriveremo a toccare anche alcune delle ultime novità introdotte in TS che permettono di esprimere meglio delle idee/modelli di programmazione sui tipi (aka "meta-programming")

The principles of Atomic Design have transformed (probably forever) the way we look at UI components and code modularization. Pattern Libraries and Design Systems – predominantly built in React – have become widespread across many companies.No doubts, these are cool tools and approaches, and we have all fallen in love with them. But...In this talk, I'll share not only the learnings but also all the "buts" that we have found in our exciting journey developing (in React, of course) a Design System for Badoo.SPEAKERCristiano RastelliPassionate web designer & developer, currently Design System Lead at MagicLab. In love with Atomic Design, Style Guides and CSS architecture.Likes to work at the intersection of business, design and development.Attendee/speaker/organiser of technical conferences and meetups.Twitter:https://twitter.com/areaweb

I Web Components sono ormai realtà e sono il next step della realizzazione di componenti ed interfacce web modulari.Che li si scrivano in Vanilla JS o con uno dei tanti tool ormai sul mercato, i Web Components sono ormai realtà e sono il next step della realizzazione di componenti ed interfacce web modulari.Scopriamone quanto è semplice scriverli e quanta potenza possono sprigionare. Faremo luce anche sui vantaggi e, perché no, anche gli svantaggi di questa (neanche troppo) nuova tecnologia che renderà ancora più potenti le nostre applicazioni.Per dimostrarlo vedremo una strana combinazione tra un web components (scritto in Angular) ed il famosissimo Wordpress...sembra una strana coppia ma funziona!

Per la prima volta un meetup a reti unificateMilano Frontend MeetupBologna FrontendFrontenders Veronasi riuniscono per una tavola rotonda (da pranzo) in livestreaming in cui si parlerà di Remote Working!Ospiti:Andrea De Carolis - BolognaCarmine Alfano - NapoliClaudio Caciagli - BolognaDavide Di Pumpo - MilanoGiulia Tosato - MantovaLuca Mezzalira - LondraMarco Solazzi - Tokyo

GreenSock Animation Platform (GSAP) è un animation framework scritto in Javascript, ingegnerizzato e messo a punto in più di 10 anni di sviluppi dai migliori designer. Può gestire praticamente qualsiasi elemento contenuto nel DOM ( CSS, SVG, React, canvas, oggetti, ecc…) e può essere integrato in qualsiasi progetto perchè indipendente da altre librerie e framework. Se considerate che è estremamente rapido e viene utilizzato da più di 8 milioni di siti e dalle più grandi compagnie al mondo come per esempio Google, Amazon, Coca Cola e EA Sports potete sceglierlo ad occhi chiusi per i vostri progetti che includono animazioni.

I framework sono un strumento decisamente utile, in alcuni casi addirittura indispensabili, ma scegliere quello che si adatta meglio alle nostre esigenze può portare via molto tempo, specialmente adesso che ne abbiamo una miriade. La complessità di questo processo sta nel fatto che oltre agli aspetti tecnici, devono essere presi in considerazione anche aspetti come: documentazione, community, tempo necessario per imparare a usare lo strumento stesso, etc.In questo talk porterò alla vostra attenzione Svelte, un framework javascript relativamente giovane che sta rapidamente conquistando la simpatia degli sviluppatori. Insieme vedremo come Svelte si differenzia dal trio più affermato, Vuejs, React e Angular; una comparazione dei sorgenti di una micro applicazione scritta con Vuejs e Svelte; Come creare componenti in stile Web Components.A fine talk avrete quello che serve per capire se Svelte vale il vostro tempo!

Come designer e developer siamo chiamati alla realizzazione di prodotti che soddisfino sia il nostro cliente che l’utente finale.Vedremo quali sono gli strumenti che possiamo scegliere per soddisfare entrambe le parti in causa, quando usarle e con chi, e come vanno ad impattare sul tempo di sviluppo: analisi dei requisiti, workshop, wireframe, prototipi, librerie di componenti e una buona dose di empatia.

Il talk racconta l’esperienza del frameworkless movement dal punto di vista dello sviluppatore UI partendo dalle basi: cosa sono i framework e perché li utilizziamo? Quali insidie nascondono? Saranno illustrati gli strumenti utili a scegliere consapevolmente il miglior framework per il nostro contesto, come ad esempio i Design System, valutando anche l’opzione “no-framework”.

In questo periodo l’hype intorno a Flutter sta crescendo molto. Ma che dire del “buon-vecchio” React Native? In questo talk, vedremo le basi e le differenze tra i due framework. In particolare vedremo come costruire la UI e come funzionano i due framework sotto il cofano. Infine cercheremo di capire quando e perché scegliere un framework cross-platform ma soprattutto quale dei due. Questo viaggio è basato sulla storia vera di uno sviluppatore Android che ha deciso di esplorare la selva oscura del cross-platform sia per lavoro che per divertimento.

Siete mai risuciti a testare con successo la vostra UI? Sono affidabili i vostri test E2E? Oppure vi trovate spesso con test lenti, che falliscono senza motivo e che vi obbligano a lunghe sessioni di debug per capire dove e perchè non vanno a buon fine? Ci sono passato anche io e ovviamente e dopo tanto studio e tanta pratica ora non ho più questo problema. Al talk condividerò con voi tutta l’esperienza che ho fatto sui test di UI.Vi parlerò delle più importanti best practice da seguire per avere dei test finalmente affidabili! Dei test che vi lasciano dormire sereni, che non vi fanno venire la voglia di rimuoverli dalle pipeline, che non falliscono per niente e che, quando falliscono, vi fanno capire molto velocemente cos’è andato storto. Inoltre, sapevate che Cypress è utilizzabile anche come ambiente di sviluppo, oltre che come ambiente di test?Alcune note:le best practice sono sono applicabili a qualsiasi strumento di testing ma durante la serata tutti gli esempi saranno basati su Cypress, strumento del quale è difficile non innamorarsi in questo tipo di contestoalcuni esempi saranno basati su React ma saranno semplicissimi e ciò che vi racconterò è applicabile a qualsiasi framework

Come si è evoluto il web tra il 2018 e il 2019 cavalcando l’onda dell’emotional marketing, quali sono i suoi attuali punti di forza e perché si è sviluppato in questo modo.Relatore della serata direttamente da Bologna FrontEnd: Margherita Ferri