React: La libreria JavaScript per la creazione di componenti UI interattivi e riutilizzabili.
I vantaggi sono notevoli, ad esempio quello di rendere agevole la gestione di ogni singola vista di una applicazione, la manutenzione di un progetto potendo agire sui singoli componenti e la chiarezza del codice.
React main features
Component based
Come già accennato, la caratteristica principale di React è che la gestione di ogni progetto avviene lavorando su componenti incapsulati.
Un componente React rappresenta e definisce un blocco atomico di codice HTML,
insieme ad eventuali comportamenti dinamici ad esso associati.
Ogni componente è isolabile e riutilizzabile in quanto composto unicamente da
metodi Javascript.
I componenti di React implementano un metodo render () che
prende i dati in input e restituisce cosa visualizzare.
La sintassi utilizzata per definire i componenti si chiama JSX, sviluppata
per agevolare l'interazione tra codice Javascript e markup HTML all'interno dei
componenti. Il codice scritto in questa sintassi viene compilato in modo da
diventare interamente codice Javascript.
const NewsCard = function() {
return {
title: 'Titolo della Card',
author: 'Nome Autore',
url: 'https://unitiva.it/news-title',
}
}
> |
Virtual DOM
Uno dei suoi punti di forza è il supporto del Virtual DOM.
Invece del tradizionale data binding bidirezionale, React usa la soluzione chiamata Dom Virtuale, tramite il quale è in grado di aggiornare la pagina Web in modo estremamente veloce. Questo è una rappresentazione rapida in memoria del DOM Reale, ovvero un'astrazione che consente di trattare JavaScript e il DOM come fossero reattivi. Ogni volta che lo stato del modello di dati varia, il Dom Virtuale e React eseguono il rendering dell'UI per creare una rappresentazione del Dom Virtuale. React calcola, poi, la differenza tra le due rappresentazioni del DOM virtuale ed esegue solo quello che è cambiato nel DOM reale. Questo consente di aggiornare la renderizzazione del DOM reale in tempi molto brevi.
Quando React è una buona scelta?
Redazioni web
I quotidiani online, i portali di informazione, tutti gli ambienti giornalistici con molti editor da gestire o con flussi redazionali complessi, comprese le esigenze di pubblicazione multilingua.
Intranet
Quando si vuole raccordare diversi applicativi web e si ha la necessità di disporre di una piattaforma comune, come accade nei moderni sistemi informativi, prende forma come strumento di riferimento per la comunicazione interna.
Back-end
Quando si vuole migliorare la facilità di gestione dei contenuti per editor o gruppi di lavoro ma si preferisce pubblicare attraverso altri strumenti web, come avviene in contesti di e-Commerce.
References.
Official website: https://facebook.github.io/react/
Wikipedia page: https://en.wikipedia.org/wiki/React_(JavaScript_library)
Free images: thanks to Storyset