Una storia lunga 10 anni



e-xtrategy

blog

hai selezionato  torna al blog webdevelopment

come il front-end automation aiuta tutto il team: il nostro talk #iad15

anche quest’anno e-xtrategy partecipa numerosa al consueto appuntamento con l’italian agile day: lorenzo massacci insieme a jacopo romei ha organizzato il workshop “managers vs developers” (stay tuned per tutti i dettagli!) ed io un talk dedicato al front-end.
ho parlato dei vantaggi del front-end automation e di come un set di strumenti ben configurati aiuti a condividere le informazioni all’interno di un team.

un talk tecnico con lo scopo di condividere la nostra esperienza su quanto i principi della metodologia agile siano fondamentali anche in attività trasversali di tutto il team di sviluppo: la condivisione delle informazioni, il riuso, la consapevolezza, la condivisione del debito tecnico e le attività di refactoring quotidiano.

una condivisione delle best practices ha fatto da base ai tool presentati, tra cui spiccano gli automatismi per la generazione di assets vettoriali, in ottica di rispondere alle densità dei moderni device, e una living styleguide che cresce insieme al nostro progetto, con l’obiettivo di allineare tutte le figure professionali allo stato dell’arte e ai componenti già esistenti e testati.
tra i test tools non potevano mancare le validazioni automatiche sul codice in base alle raccomandazioni w3c e il test comparativo, unico vero test quando si parla di fedeltà e prevenzione dei bug lato interfaccia.

le best practices, i tool e i test tool mostrati rappresentano la base del nostro front-end automation che utilizziamo per ottenere un ambiente di progetto che supporti tre punti fondamentali: rispondere ai cambiamenti, supportare la dinamicità del team ed essere manutenibile.

di seguito le slide del talk.

Manage the Flux of your web application: let’s Redux

Sull’onda della React Night organizzata qualche tempo fa, ho tenuto un nuovo talk su React per il FEVR, user group di Verona specializzato in sviluppo front-end.

In particolare mi sono concentrato sul pattern Flux e sulla sua “evoluzione” Redux: entrambi permettono di avere applicazioni che crescono nel tempo in maniera sana, mantenendo una complessità costante al crescere del progetto stesso. Tutto questo avendo un debito tecnico veramente basso o, in alcuni casi, addirittura nullo.

Qui trovi slide e video del talk. In generale davvero una bella serata, durante la quale ho conosciuto uno user group molto interessante, con il quale non vedo l’ora di collaborare di nuovo, magari per un nuovo talk in primavera.
Per ora, grazie per i feedback!

React Night

React, ultimo framework web nato in casa Facebook, è da qualche tempo la buzzword del mondo Javascript.

Anche noi di e-xtrategy abbiamo deciso di affrontare l’argomento, organizzando insieme alla community DevMarche una React Night: una mini-conferenza di tre talk sul React e tutto quello che ci gira intorno.

L’obiettivo della serata è stato fare una carrellata veloce: abbiamo prima introdotto React, per poi passare ad illustrare Flux, un pattern di programmazione che ben si sposa con questo nuovo framework ed infine ci siamo soffermati a vedere una demo funzionante.

Successivamente siamo passati ad illustrare due utilizzi non “canonici”.

Nel primo caso abbiamo illustrato un’app di esempio per iOS creata utilizzando React-Native, un framework per lo sviluppo di app native utilizzando un pattern del tutto analogo a React, e nell’altro il nostro amico Emanuele Rampichini ci ha parlato dello sviluppo un’applicazione React in ambiente desktop utilizzando github electron.

Non ci resta che vedere insieme i video della serata mentre nella nostra sezione formazione potete trovare anche le slide dei primi due talk, buona visione! 🙂

La nostra esperienza con AngularJs: ModulAngular

fedeli alla promessa di qualche post fa siamo stati ospiti del Cowo di Ancona e abbiamo presentato tools e strumenti che, negli ultimi anni, sono stati sperimentati e usati con successo in ambito di enterprise web application.

avere ben chiaro l’obiettivo del nostro progetto per capire se la struttura modulare realizzata che gira intorno al framework AngularJS può dare un valido supporto nella gestione di progetti medio/grandi e di medio/lungo termine.

la struttura presentata deve rispondere a 3 obiettivi:
rispondere al cambiamento riusabile e ritorno dell’investimento iniziale
supportare la dinamicità del team quando i diversi team variano nel tempo, sia nelle figure professionali in gioco, sia nell’effort richiesto
manutenibile resistere nel tempo e alle risorse che man mano diventano obsolute, condivisione del debito tecnico generato

spiccano tra la carrellata di tools e buone pratiche la living styleguide automatizzata con tutti gli elementi presenti all’interno della nostra applicazione.
tale scaffolding è, per lo sviluppatore come lo user designer, un riferimento da cui partire per stilare le proprie funzionalità fino a creare un’interfaccia completa partendo dagli elementi già esistenti ma senza escludere la creazione di altri, sempre discussi e condivisi insieme al team.

da sottolineare le buone pratiche per gestire la struttura file che vanno da una semplice organizzazione per cartelle fino ad arrivare all’utilizzo di Require.js e System.js combinato con l’utilizzo di bower e npm per la gestione delle dipendenze.

altro concetto importante è che in un progetto web di dimensioni medio/grandi è fondamentale implementare un meccanismo di One Click Build per evitare di commettere errori e risparmiare tempo utile per sviluppare nuove features.

abbiamo trattato anche il testing di applicazioni AngularJS sia con Karma per quanto riguarda i test unitari che con Protractor per i test E2E.

Qui la pagina Lanryd dell’evento con tutti i dettagli sui speaker, link alle slide a ai video.

Di seguito il video della serata splittato in due filmati e le slide:

Dal CSSDay 2015 di Faenza

debutta quest’anno, da uno spin-off del jsday, la conferenza dedicata ai front-end developer e al mondo dei css.

venerdì 27 marzo al palazzo naldi di faenza si parte carichi, subito dopo i convenevoli organizzativi, con nove talk seguiti da una folla di professionisti che ha fatto registrare il sold out.

a parte due talk più specifici (uno sui consigli per lo sviluppo su ambiente windows (@pietrobr) e uno sull’email design (@morloi)) il resto dei talk hanno dato spazio a raccolte di best practice, di tool e strumenti di supporto per buona scrittura della parte presentazionale delle nostre interfacce.

ottimi spunti e valide condivisioni delle esperienze dei speaker e di come nel tempo ognuno abbia trovato la propria suite di strumenti e le proprie convenzioni per scrivere css con le seguenti caratteristiche:

  • comprensibile
  • condivisibile
  • manutenibile
  • riusabile
  • scalabile

sono tornato contento con qualche tool in più nella lista e la consapevolezza che si sta affrontando la stessa situazione: il bisogno di lavorare sereni, di testare, di condividere con il resto del team, di costruire sitemi che funzionano e non pagine a se stanti.

unico appunto è che ho avuto la sensazione che la fase di montaggio delle interfacce fosse vista sempre come fase che accade in un preciso momento: dopo la UI e prima dello sviluppo. a parte il talk sulle styleguide di @Fabbrucci in cui si è parlato di MVP, prototipazione e cicli iterativi di sviluppo nel resto dei casi ho intuito un approccio al markup più tosto waterfall. come se il nostro lavoro finisse al momento della consegna del markup allo sviluppatore.

ma il nostro codice non ha necessità di essere condiviso solo tra altri front-end developer. come metto in condizione uno sviluppatore di poter utilizzare gli assets specifici dell’interfaccia?
in che fase del progetto eseguo i test di comparazione? e cosa testo della mia interfaccia quando lavoro sui mock?
una styleguide è utile ma se non è “living” styleguide serve a poco dopo la fase di discovery. e come vengono manutenute le styleguide su progetti che durano mesi e anni? soprattutto, come posso automatizzarne la generazione?
cosa cambia se sviluppo un sito web o un’applicazione mobile web based?
in caso di applicazione modulare come gestisco la logica degli stili per mantenere coerente anche la modularità dell’interfaccia?

tanti temi da trattare e tante domande a cui dare risposta. non resta che segnarsi l’appuntamento del CSSDay 2016 ma nel frattempo proveremo a dare risposte il 29 Aprile all’evento DEV marche organizzato nel cowo di Ancona in cui tratteremo lo sviluppo di front-end su progetti di grandi dimensioni basati su angular.

a presto!



lavorano con noi

successivo
precedente