Kako je React postao jedan od najpopularnijih 'frameworkova'
WebCamp Zagreb

Kako je React postao jedan od najpopularnijih ‘frameworkova’

Naučiti raditi u novom 'frameworku' može biti izazovno, a kako bismo taj izazov svladali, nekad je potrebno dubinski istražiti kako 'framework' zapravo radi. To se najbolje može napraviti na način da ga rastavimo i raspišemo vlastite metode koje imitiraju funkcionalnosti frameworka, a ovaj smo vikend na WebCampu imali priliku vidjeti kako to izgleda s Reactom.

WebCamp Zagreb

React je danas jedan od najpopularnijih frameworkova, a developeri koji znaju raditi s njim sigurno će biti sve traženiji – vrijeme uloženo u njegovo učenje i proučavanje zasigurno će se isplatiti. 

Building a Poor Man’s React predavanje je koje je održano na kraju ovogodišnje konferencije WebCamp u Zagrebu i na kojem je Krešimir Antolić demistificirao React i pokazao kako funkcionira. Napravio je jednostavan library koji radi na sličan način kao i React i koji svatko može pogledati na GitHubu.

React se koristi kako bi se napravilo sučelje za korisnike na webu, no kada developeri prvi put vide skriptu napisanu u ovom frameworku, prvo pomisle da je to neka čudna mješavina XML-a i JavaScripta. Krešimir je iskreno rekao kako su te skripte “gadne”, ali da ujedno imaju smisla – React je postao nešto što mu se sviđa, a posebice je istaknuo jaku zajednicu koja se oko njega okuplja

Što je Krešimir napravio?

Gornja slika najbolje objašnjava React – developer ‘corniju’ daje podatke, a ‘output’ je čaroban.

Glavni princip rada u Reactu je da se developer brine o podatcima, a React će se pobrinuti za DOMKao prvi primjer, napravio je metodu kojem se može napraviti HTML element. Da bi to uspio, koristio je JavaScript metodu “document.createElement” te je postigao da se pozivanjem njegove metode može dodati klasa novom elementu i tekst koji se dodaje pomoću JavaScript metode “innerHTML”.

React traži da developeri koriste komponente koje rade odvojeno jedna od druge i često se unutar jedne komponente stvaraju potkomponente. Da bi to omogućio u njegovom libraryju, morao je omogućiti da se, osim elementa s tekstom, može stvoriti i element s podelementima. To je napravio tako da je naučio library da razlikuje kada treba koristiti “.innerHTML”, a kada treba dodati podelement, odnosno kada treba koristiti JavaScript metodu “.appendChild”. Sada se pomoću ovog libraryja mogu praviti komponente koje imaju potkomponente.

React radi tako da se sva logika aplikacije sprema u komponente, a da bi se to moglo postići pomoću njegovog libraryja, napravio je metodu s imenom “setState”. Kao drugi primjer, napravio je element s dva podelementa koji su slike cornija te je omogućio da se klikom na jednog od njih promijeni varijabla koja predstavlja stanje svake potkomponente.

Kada se promijeni stanje jedne komponente, potrebno ju je rerenderirati, ali to se nikako ne smije napraviti s cijelim DOM-om. Zato je predstavio virtualni DOM i virtualne elemente.

Prilikom promjene stanja, izgradit će novi virtualni DOM i usporediti ga sa starim i tako će library znati što treba izmijeniti. Isto tako radi i React i to je razlog za brzinu njegovu frameworka.

Dobar framework čine njegova promišljenost, ali i dobra zajednica

Popularnost, dobar community i promišljenost frameworka samo su neki od razloga zašto developeri sve više koriste React i zašto je njegovo poznavanje sve više i više traženo na tržištu rada, a taj trend sigurno neće u dogledno vrijeme prestati. Naučiti raditi s Reactom može koristiti svakom developeru, a zbog predavača poput Krešimira možemo naučiti i kako React radi.

Ako vas zanima React, zavirite u službenu dokumentaciju, a svakako pogledajte i Krešimirov GitHub.

Sukladno članku 94. Zakona o elektroničkim medijima, komentiranje članaka na Netokraciji dopušteno je samo korisnicima koji ostave svoje ime i prezime te mail adresu i prihvate pravila ponašanja.

Pravila ponašanja

Na Netokraciji za vas stvaramo kvalitetan, autorski potpisan sadržaj i zaista se veselimo vašim kvalitetnim, kontruktivnim komentarima. Poštujmo stoga jedni druge prilikom komentiranja, kao i Zakon, držeći se sljedećih pravila ponašanja:

  • Ne budite 💩: Nema vrijeđanja, diskriminiranja, ni psovanja (osim ako nije osobni izričaj, ali onda neka psovka bude općenita, a ne usmjerena prema nekome). Također, upoznajte se sa stavkom 2. članka 94. Zakona o elektroničkim medijima prije no što ostavite komentar.
  • Samo kvalitetna rasprava, manje trolanja: Ne morate se ni sa kim slagati, ali budite konstruktivni i doprinesite raspravi! Svako trolanje, flameanje, koliko god "plesalo" na granici, leti van.
  • Imenom i prezimenom, nismo Anonymous 👤: Autor sadržaja stoji iza svog sadržaja, stoga stojite i vi iza svog komentara. Koristimo ime i prezime te pravu email adresu.

Kako koristimo podatke koje ostavljate? Bacite oko na našu izjavu o privatnosti.

Sve ostale komentare ćemo s guštom spaliti, jer ne zaslužuju svoje mjesto na internetu.

Odgovori

Tvoja e-mail adresa neće biti objavljena.

Popularno

Kolumna

Modrić, papige i printeri znaju da nas roboti neće zamijeniti

Poplava GPT-4 gurua i Microsoft vs Google utrke stvara dojam friške revolucije, no umjetna inteligencija već desetljećima skriva iste kosture u ormaru. Dobrih ideja i rješenja ima mnogo. Lovaca u mutnom vjerojatno i više. Pitanje je samo - tko će biti glasniji?

Analiza

Sve više mama-influencerica skriva lica svoje djece s interneta. I to je ispravna odluka.

Djeca influencera i djeca influenceri koja su odrasla na internetu danas na pragu zrelosti osvještavaju da im se zapravo nije sviđalo djetinjstvo pred kamerama i u suradnjama s brendovima. Ujedno je i sve više i daleko ozbiljnijih situacija gdje iskorištavanje djece na internetu graniči s kaznenim djelima.

Analiza

TABU: Juniorke u IT-ju imaju 4 %, a seniorke čak 18 % manju plaću od svojih muških kolega

Kako su plaćene žene u IT industriji, za iste godine iskustva, u odnosu na svoje muške kolege? Otvorilo se to pitanje prije pola godine s najnovijim izvještajem platforme TABU, danas mu se vraćamo da vidimo ima li promjena.

Što ste propustili

Tvrtke i poslovanje

Hrvatski inspektori dio su EU projekta kontrole razvoja AI-ja vrijednog 3,5 milijardi eura

Impresionirani učinkovitošću hrvatskih inspektora, koji su već u prvih 310 posjeta identificirali 168 slučajeva doprinosa razvoju AI-ja, EU je potvrdila uključenost hrvatskog kadra u programu nadzora.

Kolumna

Evo zašto je poznavanje hrane i vina ključno za uspjeh hrvatskog IT-ja

Osnivači startupa teško da će zadobiti povjerenje investitora ako ne poznaju vina ili naručuju dobro pečene bifteke.

Novost

Otpušteni programeri iz “big techa” završit će u Hrvatskoj: Apis IT planira ih zaposliti 1800

Hrvatska želi “uvesti” i zaposliti otpuštene programere i ostale tehnološke stručnjake iz Googlea, Facebooka, Microsofta i Twittera kao digitalne nomade za potrebe novog projekta daljnje digitalizacije javne uprave na kojemu radi Apis IT.

Digitalni marketing

Svaki bi brend trebao napustiti generičnu “stock” glazbu i razviti svoj – audio identitet!

Iako postoje mnoge "royalty free" glazbene platforme koje nude kvalitetnu glazbu, većina video oglasa napravljena je s glazbom koja zvuči generičko i jeftino. Razlog tome djelomično je loš ukus, manjak hrabrosti ili kreativne vizije menadžmenta, a djelomično manjak vremena posvećen kuriranju kvalitetne glazbe koja zvuči drugačije, ali je konzistentna s brendom.

Gaming

Uskoro kreće 4. sezona Student Esports Tournamenta! Hoće li TVZ ostati nepokoreni prvak?

Idući tjedan počinje nova sezona SET-a, domaćeg esport turnira koji je uspio okupiti 16 tehničkih fakulteta iz svih dijelova Hrvatske, a uz to je postao i nacionalni kvalifikacijski turnir za Amazonov i Intelov University Esports Masters (AUEM)!

Izvještaj

Domaću kreativnu industriju čekaju teški pregovori s Googleom

Iako donosi više od 830 milijuna eura u hrvatski BDP, kreativna industrija još nema u potpunosti odgovarajuću zaštitu i druge uvjete za neometan rad na digitalnom tržištu.