Front End Developer: ruolo e principali tool utilizzati
Front End Developer: chi è e cosa fa
Quando si parla di sviluppo di app, siti web o sistemi digitali, si è soliti distinguere tra una parte visibile (Front End), relativa all’interfaccia utente, e una seconda parte (Back End) non visibile ma fondamentale al funzionamento del sistema. Tale distinzione nasce dall’esigenza di velocizzare i tempi di sviluppo e di modifica e dalla necessità di ottenere prodotti funzionali e facilmente fruibili.
Il Front End Developer è uno sviluppatore informatico che si occupa della creazione della parte visibile di un’app o un sito e dell’ottimizzazione della relativa User Experience1. Egli, quindi, lavora affinchè un’app o un sito siano graficamente accattivanti e facili da navigare anche da parte di utenti meno esperti.
Front End Developer: principali strumenti
Il Front End Developer utilizza particolari tool e specifici linguaggi di programmazione e di markup. Vediamo i principali.
- HTML. Acronimo di HyperText Markup Language, può essere definito il linguaggio di markup per eccellenza. Sviluppato nei primi anni novanta, il metalinguaggio ha avuto una fortissima diffusione in seguito ai primi utilizzi commerciali del web. Si tratta di un linguaggio di formattazione che descrive le modalità di impaginazione del contenuto di una pagina web attraverso tag di formattazione2;
- CSS. I Cascade Style Sheets (fogli di stile a cascata), o più semplicemente CSS, rappresentano un metalinguaggio che gestisce il design delle pagine web e lavora in combinazione con HTML per creare la dimensione visibile all’utente. I fogli di stile sono definiti a cascata perché sono dipendenti da un unico foglio che eredita a cascata le proprietà di tutti gli altri. Oggigiorno esistono svariate piattaforme che permettono anche agli utenti meno esperti di creare il proprio sito o blog semplificato. Se l'obiettivo però è dar vita a qualcosa di più complesso di una semplice vetrina, imparare a utilizzare questo strumento è fondamentale;
- JavaScript. A differenza dei linguaggi precedenti, JavaScript è un linguaggio di programmazione che garantisce l’interattività della pagina web. Se infatti HTML e CSS permettono al sito di possedere un contenuto statico, JavaScript permette alla pagina web di essere dinamica, cioè di possedere specifiche feature (mappe, link…) con cui l’utente può interagire;
- Browser e DevTools. Il browser è lo strumento che permette di visitare le pagine web codificate in HTML, CSS e JavaScript. Attraverso una fase di parsing e di analisi dei tag, il browser elabora la pagina web e ne permette la visualizzazione. I DevTools permettono invece di indagare le pagine web, cioè di analizzarne i codici e di individuare gli eventuali errori di scrittura;
- Text Editor. Visual Studio Code, Sublime Text e Notepad++ sono i Text Editor più utilizzati dai Front End Developer. Si tratta di programmi per la composizione di testi che facilitano la scrittura e consentono l’inserimento di immagini e altre funzionalità all’interno delle pagine web;
- Framework di Front End. Per gli sviluppi più complessi è possibile utilizzare dei framework per applicazioni web, ovvero dei moduli o strutture di base ready-to-use che agevolano il lavoro degli sviluppatori e permettono un grande risparmio di tempo. La maggior parte dei framework più utilizzati sono open source, come React - mantenuto da Meta e da una comunità di singoli sviluppatori e aziende - AngularJS - sviluppato da Google e dalla comunità di sviluppatori individuali - e il più recente Vue.js - creato da Evan You, ex dipendente di Google;
- Strumenti di User Experience Design. Il Front End Developer non si limita alla sola progettazione dell'interfaccia grafica di una pagina web, bensì studia e implementa il miglior modo per ottimizzare la User Experience. Una buona padronanza degli strumenti di design e modellazione è dunque fondamentale. Tra i più utilizzati vi è Adobe XD, prodotto e distribuito da Adobe all'interno della raccolta Creative Cloud.
Fonti
1. Chi è il front end developer, university2business.it
2. Introduzione all’HTML, html.it