Què és React i per a què serveix?

D'on surt React?

La web tradicionalment s'ha construït en HTML, JavaScript i CSS, separats en diferents carpetes. Això fa que sigui complicat escalar i extreure certes parts del codi (especialment JS i CSS) per migrar o reutilitzar funcionalitats a causa de les dependències entre aquests llenguatges.

Però què succeiria si poséssim tot això en un sol paquet? Això és el que devien preguntar-se els enginyers de Facebook i va propiciar que a mitjans de 2013 es llancés la primera versió de la ja famosa llibreria.

React està basat en un paradigma anomenat programació orientada a components en el qual cada component és una peça amb la qual l'usuari pot interactuar. Aquestes peces es creen usant una sintaxi anomenada JSX permetent escriure HTML (i opcionalment CSS) dins d'objectes JavaScript.
Aquests components són reutilitzables i es combinen per crear components més grans fins a configurar una web completa.
Aquesta és la forma de tenir HTML amb tota la funcionalitat de JavaScript i l'estil gràfic de CSS centralitzat i llest per ser abstraït i usat en qualsevol altre projecte.

Per què React?

React aporta una sèrie de clares avantatges enfront de la forma clàssica de realitzar una web, les seves facilitats per al desenvolupament unit al rendiment, la flexibilitat i organització del codi la converteixen en una de les millors opcions.

Una de les principals raons perquè això sigui possible és l'ús del DOM virtual, React és capaç de generar el DOM de forma dinàmica, fa els canvis en una còpia en memòria i després la compara amb la versió actual del DOM, d'aquesta manera evita renderitzar tota la pàgina cada vegada que hi hagi canvis, simplement s'aplica aquest canvi al component que hagi estat actualitzat, simple i ràpid. Això propicia una millor experiència d'usuari, a més d'un rendiment i una fluïdesa impressionant.

En tot projecte web és important tenir en compte el posicionament, i precisament aquest és un dels principals problemes d'aquest tipus de frameworks, això és degut al desacoblament entre la part del client i del servidor, el contingut HTML s'obté mitjançant peticions a l'API i posteriorment es genera, això provoca que quan el robot de Google rastreja la web el contingut encara no existeixi. Amb React no tindrem aquest problema ja que permet isomorfisme, això significa que és capaç de renderitzar aquest HTML tant en el client com en el servidor, de manera que quan arribi el robot de Google podrem lliurar-li el contingut ja renderitzat i això ens permetrà posicionar igual de bé que el típic wordpress de tota la vida.

React Native mereix un altre post per ell sol, però de moment cal comentar que és una altra eina que compilant el mateix codi Javascript facilita la generació d'aplicacions natives per a Android, iOS, etc.

Quina acceptació té al mercat?

La darrera enquesta de StackOverflow ens revela que React és el framework més estimat i més desitjat en aquest darrer any, a més de ser ja el segon més utilitzat només per darrere de jQuery. Això està fortament lligat al fet que Javascript torna a ser el llenguatge més popular per setè any consecutiu, cosa que marca una tendència clarament ascendent.

No és casualitat que empreses com Netflix, Airbnb, Dropbox, Paypal, Tesla, Whatsapp, Uber, etc. hagin apostat per aquesta tecnologia, la inversió que ha fet Facebook juntament amb el gran nombre de desenvolupadors que han contribuït a aquesta llibreria de codi obert fan que sigui una aposta segura de futur.

React i Drupal

Drupal 8 és un potent CMS que ofereix una gran customització de backend i aporta molta flexibilitat en la gestió de continguts. A Drauta som especialistes en disseny web i fem servir React en el desenvolupament d'aplicacions per millorar la velocitat de càrrega de les pàgines i el frontend.