Ukoliko tek počinjete da se bavite Web programiranjem, verovatno ste čuli za frontend i backend programiranje. Šta se tačno misli pod tim? Ukoliko ste početnik na ovom polju, može vam biti teško da napravite razliku među njima, kao i da znate šta se radi u kome.

Iako su frontend i backend veoma različiti, zapravo su više poput dve strane jednog novčića. Funkcionalnost Web stranice se oslanja i na jednu i na drugu stranu, koje moraju međusobno komunicirati i delovati efektivno kao jedinstvena celina. Da li je jedno važnije od drugog? Odgovor je – ne. Oba igraju veoma važnu ulogu u Web programiranju.

Frontend development

Frontend na web stranici je ono što vidite i koristite na vašem browser-u. Može se nazvati i „Stranicom za klijente“, jer uključuje sve ono što posetilac sajta može da vidi, od teksta i boja, do dugmadi, slika i navigacionih menija.

Recimo, na primer, da želite da započnete novi biznis, koji se bavi prodajom određenih proizvoda. Potreban vam je profesionalan web sajt, kako biste predstavili svoju kompaniju potencijalnim klijentima, naveli informacije o firmi,  adresu na kojoj se nalazite, možda postavili i nekoliko fotografija. Sve što vam je potrebno, jeste znanje frontenda, da biste napravili web sajt.

Programski jezici koji se koriste u Frontend-u

HTML – osnovni markup jezik koji kreira i organizuje sadržaj koji će biti prikazan na internetu.

CSS – jezik koji prati HTML, određuje stil web sajta, izgled, boje, fontove I sl.

JavaScript – programski jezik koji se koristi kada želite da napravite interaktivne elemente, poput padajućih menija, kontakt formu itd.

Zajedno, ova tri nezaobilazna jezika stvaraju sve što je vizuelno predstavljeno kada posetite web sajt- bilo da je to online prodavnica, portal sa vestima, email, ili Google pretraživanje.

Pored ova tri osnovna jezika, koristićete  framework-e kao što su Bootstrap i Angular, biblioteke JavaScript-a poput JQuery i dodataka za CSS poput Sass i LESS. Veliki je broj sadržaja poput ovih, koji podržavaju HTML, CSS i JavaScript. Njihova svrha je da sam kod bude bolje organizovan i jednostavniji za uređivanje, pružajući nam širok izbor različitih alata i templates-a (šablona), koji su kompatibilni sa programskim jezicima.

Frontend development i Web dizajn

Važno je napomenuti da, iako se Frontend bavi vidljivom i interaktivnom stranom web sajta, to ne znači da se bavi web dizajnom.

Frontend programeri na osmišljavaju izgled i ne dizajniraju web sajt, to je posao dizajnera, ili, konkretnije UI dizajnera. Frontend programer preuzima ovaj dizajn i na osnovu njega kreira (kodira) websajt, koristeći gore pomenute programske jezike.

Dakle Web dizajner se bavi izgledom samog sajta, a Frontend programer se bavi time da tu zamisao pretvori u funkcionalan web sajt.

Iza kulisa

Vratimo se vašoj kompaniji, za koju ste napravili web sajt sa osnovnim informacijama. Posao se proširio i želeli biste da vaše proizvode prodajete online. Odlučujete se da nadogradite vaš web sajt i otvarate online prodavnicu, u kojoj ljudi mogu naručivati i kupovati proizvode. To znači da sada vaš web sajt mora imati podatke o svim proizvodima, kupovinama, profilima korisnika, kreditnim karticama itd. Kako možete organizovati sve ove podatke i informacije? Tu stupa na scenu backend programiranje.

Ono što ste do sada imali je primer statične web stranice – njen sadržaj se zapravo ne menja mnogo. Kod statičnih web sajtova, sve potrebne informacije koje određuju šta se nalazi na web stranici nalaze se u samom frontend kodu.

Statični web sajtovi su dobri za prikazivanje preduzeća, restorana, portfolija itd., ali ukoliko želite da pretvorite web sajt u interaktivan sa korisnicima, moraćete da imate detaljniji uvid u ono što se dešava iza kulisa web sajta.

Backend (pozadinska strana) deo je web sajta koji nije vidljiv posetiocima sajta. Odgovoran je za skladištenje, čuvanje i organizovanje podataka i osiguravanju da sve na strani korisnika funkcioniše. Backend komunicira sa frontend-om, tako što šalje i prima podatke koje se prikazuju na web sajtu. Kada popunjavate kontakt formu, upišete web adresu, ili kupujete online, vaš browser šalje zahtev backend-u , koji se vraća kao informacija u obliku frontend koda koji browser može da prikaže.

Vaš web sajt sada ima nove, backend komponente, kako bi postao dinamičan web sajt, čiji sadržaj se može menjati u zavisnosti od toga šta se nalazi u bazi podataka. U tome se razlikuje u odnosu na statičan web sajt, koji ne zahteva bazu podataka, jer njen sadržaj ostaje isti.

Postavljanje i upravljanje backend-om

Vašoj web stranici je sada potrebna baza podataka za upravljanje svim informacijama o proizvodima i kupcima. Baza podataka čuva sadržaj sa web sajta na način koji olakšava vraćanje, organizovanje, uređivanje i čuvanje podataka. Pokreće se na udaljenom računaru - serveru. Postoji mnogo različitih baza podataka koje su u širokoj upotrebi, kao što su MySQL, SQL Server, PostgresSQL i Oracle.

Vaš web sajt i dalje ima frontend kod, ali, takođe, mora biti napravljen tako da može da koristi programski jezik koje baza podataka može da prepozna. Uobičajeni programski jezici koji se koriste su Ruby, PHP, Java, .Net i Python. Ti programski jezici rade sa framework-om koji olakšava proces web programiranja - za Javu je to Spring, za PHP Laravel itd.

Kada sve te komponente udruženo pravilno rade, korisnici mogu na vašem web sajtu vršiti pretragu prema raznim kategorijama. Kada se u polje za pretragu (na frontend-u) ukuca određena reč, aplikacija pretražuje sve proizvode u bazi podataka (na backend- u) i vraća informaciju u obliku frontend koda koji prikazuje listu proizvoda sa zadatom reči iz pretrage.

Sada imate dinamičan web sajt koji koristi frontend i backend tehnologije. Koristite frontend programske jezike kako biste učinili da vaš sajt izgleda dobro i jednostavan za navigaciju. Iza kulisa, backend drži sve frontend komponente i omogućava da se, na primer, sačuva istorija kupovina korisnika i detalji proizvoda, kreira sigurne naloge korisnika itd.

Kao što vidite, obe strane imaju različite uloge, ali radeći udruženo određuju iskustvo korisnika i omogućavaju da web stranica funkcioniše.

                                                                                                              Izvor: reddit.com

Frontend ili Backend - koji bi trebalo da naučite?

Ukoliko želite da naučite web programiranje, a niste sigurni da li da se odlučite za frontend ili backend, važno je razmotriti svakodnevne zadatke svakoga ponaosob. Ako vam se dopada vizuelni dizajn, da pretvarate ideje dizajnera u delo, stvarajući vrhunsko zadovoljstvo korisnika, verovatno biste uživali radeći frontend programiranje.

Ako vam se, ipak, sviđa rad sa podacima, algoritmima i pronalaženju načina za optimizacijom složenih sistema, onda bi vam se dopalo backend programiranje.

Međutim, razdvajanje frontend-a i backend-a ne mora da bude uvek tako isključivo. Pojedini programeri su iskusni u oba, i frontend i backend programiranju. Ovi programeri su poznati kao Full stack developeri.

Izvor: careerfoundry.com