React er et JavaScript-bibliotek for utvikling av dynamiske brukergrensesnitt. I motsetning til alternative (og populære) MVC-rammeverk søker ikke React å løse hele stacken, men heller å tilby en solid abstraksjon for utvikling av V-en, viewet.

I motsetning til omtrent alt annet av lignende verktøy søker React å gi deg en mulighet til å programmere brukergrensesnitt uten å forholde deg til DOM-en. Den gjør dette ved å fokusere på komponenter og trær av slike komponenter. Du beskriver hvordan komponenttreet (ja, hele) ser ut gitt en gjeldende tilstand, React sørger for å finne den mest effektive måten å endre DOM-en på for å reflektere dette.

Reacts modell viser seg i praksis å være konseptuelt mye lettere å forholde seg til en tilstandstunge DOM-sentriske løsninger, samtidig som den legger til rette for svært god ytelse. Se Finn Småjobbers søk (trykk på fylker og kategorier) for et eksempel på bruk av React signert Kodemaker (ved Christian Johansen).

React utvikles og brukes av Facebook og Instagram.

Våre anbefalinger

React: Rethinking best-practices
Anbefalt av Magnar og Christian

Pete Hunt, en av hodene bak JavaScript UI-rammeverket til Facebook og Instagram, React, forteller om tankene bak. Foredraget fra JSConf.eu 2013 utfordrer en del etablerte sannheter og presenterer en måte å tenke på web-frontend-programmering på som sammenfaller med klassisk UI-programmering og som virkelig fokuserer på separation of concerns.

On the Spectrum of Abstraction
Anbefalt av Magnar

Rich Hickey har noen fantastiske talks. Han snakker om generelle prinsipper, og gir deg ofte noen nye konsepter og ord du kan bruke til å tenke med rundt programmering.

Det er ikke ofte jeg ser talks av andre enn Hickey som har denne typen øye-åpnende innhold, men dette er en. Det er litt knot og kluss i starten, men det tar seg veldig opp. Han introduserer noen spissede begreper (power vs usefulness / properties) og bruker de til å snakke om abstraksjonnivåer på en veldig interessant måte. Mye godt tankemateriale her. Anbefales!

Literate interactive coding: Devcards
Anbefalt av Magnar

Tester du UI-komponentene dine ved å klikke omkring i applikasjonen og gjenskape situasjoner manuelt? Unødvendig. Tidssløseri. Frustrerende. Bruce Hauman viser vei med Devcards.

Building User Interfaces With Facebook's React
Anbefalt av Magnar

Steven Luscher har en herlig stil når han i dette foredraget viser fram hvorfor React er bra greier. Underholdende og informativt!

Våre foredrag

Magnar og Christian parprogrammerer nettspill med Clojure og ClojureScript på JavaZone. Det blir funksjonell programmering, testdrevet utvikling og to tomsinger fra Østfold.

En introduksjon til React.js, med sammenligning av populære MC*-rammeverk, samt et eksempel på bruk i form av live-koding av minesveiper med ClojureScript og Om (en React-wrapper).

Våre sideprosjekter

Resultatservice på nett
Av Stig

Ringerike o-lag med sine sammarbeidsparter arrangerete NM Ultralang i august 2015. Det var viktig for oss å bruke denne anledningen til å bygge egen arrangør-kompetanse ved å gjennomføre ett så viktig løp. Vi ønsket derfor selv å ta ansvar for tidtakertjenesten med tilhørende resultatservice. Det var OK for Norges orienteringsforbund - så lenge vi klarer å stable på beina en resultattjenste som er på høyde med det publikum forventer i denne type arrangement. Da blir det fort mer interessant. Utvikling av ny programvare som bare må virke ved første storskala forsøk kan jo ikke kategoriseres som noe annet enn spennende. I de fleste systemutviklingsprosjekt, er det mulig med en myk ‘igangkjøring’ der eventuelle problemstillinger kan håndteres og rettes ‘i fart’. En resultattjeneste for ett løp som bare gjennomføres den 22/8-2015 - har ikke rom til å feile. Enten så fungerer det som det skal - eller så blir det fiasko. Det gikk bra - veldig bra.

Vår fri programvare

Våre blogginnlegg

Minesweeper - a brief journey from JavaScript/React to Elm

Jeg tar utgangspunkt i en minesveiper implementasjon fra Christian Johansen i JavaScript/React og hviser hvordan man kan implementere det samme spillet i Elm. Bloggposten sammenligner flere implementasjonsdetajer og reflekterer kort om statisk vs. dynamisk typing.

Printe med React
Av Odin

Hvordan gjøre media queries fra en React-applikasjon med inline CSS.

Validering i React
Av Odin

Hvordan lage robuste React-komponenter