Kako postati web developer?
HelloJunior Iz ugla programera

Kako postati web developer?

Ivan Kuzmanović

30.12.2020. · 11 min

Ako si sebi zadao cilj da u narednom periodu naučiš da kodiraš kako bi postao developer i priključio se uzbudljivom svetu izrade softvera i web aplikacija, znači da ti je zanimljiva pomisao da bleneš u dva monitora, stvaraš i oblikuješ kodove, dok ti se na stolu hladi pola litre kafe, a pored ti stoji nesložena Rubikova kocka koja vapi za tvojom pažnjom.

Tvoja i samo tvoja mapa

Pokušaću da ti približim malo sliku oko tog puta kojim si zacrtao da ideš, jer ne postoji samo jedan put. Imaćeš povremene "dileme" koje će se javljati dok koračaš stazom veb developera.

Pravac koji odabereš, definisaće te i oblikovati u developera koji će graditi karijeru u ovoj branši, pa je najvažniji korak napraviti dobar plan i usmeriti se ka zacrtanom cilju.

Koji su mi putevi na raspolaganju? Kakav je plan onda? Zar ne mogu da naučim neki programski jezik i to je to? Svakako! Tako površno razmišljanje o dev karijeri neće te dovesti daleko. Da naučiš neke jezike moraš, to stoji, ali moraš napraviti neki plan (roadmap) - ne možeš k’o muva bez glave da tumaraš, jer ne možeš sve da znaš i budeš stručnjak za svaki korak izrade softvera ili aplikacije, a može se desiti i da se izgubiš ili zalutaš negde i šta si uradio... Izgubio dragoceno vreme. Veruj mi na reč, ovo se događa, a tebi bi najbolje bilo da izbegneš takav scenario. Proces izrade je suviše kompleksan da bi jedan čovek radio i bio odgovoran za sve, a da ne pominjem najvredniji resurs koji se bespovratno troši - vreme. Zato postoje timovi koji se organizuju u tom procesu, a gde će tvoje mesto u timu biti, zavisi od tebe i puta koji ćeš izabrati za svoju dev karijeru.

Izraz ’’roadmap’’ predstavlja plan koji praviš za svoju karijeru – prosto i jednostavno. Google će ti izbaciti gomilu linkova različitih vodiča i planova za developera, gde ćeš moći da vidiš šta ti je sve potrebno da postaneš to što ciljaš, ali pokušaću rečima da "nacrtam" jednostavniju verziju toga, kako bi početniku bilo lakše da vidi o čemu se tu radi.

Uopšteno, fokusiraćemo se na web developera i plan ćemo podeliti u tri sekcije, gde će prva sekcija biti o suštinskim stvarima koje svaki developer mora znati, pa ćemo preći na drugu i treću sekciju gde ćemo videti glavne stavke u web developmentu – frontend i backend izradu. Možeš izabrati da se držiš samo jedne strane, frontend ili backend, ili da ideš na fullstack varijantu, gde ćeš znati ceo proces izrade od početka do kraja. Pokrivamo put od početnika, frontenda, do backenda i na kraju fullstack.

Prvi korak – početnički nivo (Essential skills)

Za početak, moraš biti dobro uigran sa text editorom u kom ćeš pisati kod. Većina programera koristi Visual Studio Code jer je besplatan i odličan editor. Postoji naravno i Brackets, Sublime Text, Atom i drugi koji su odlični, ali VSC je nekako najkompletniji, pa ga koriste i početnici, ali i iskusni programeri. Znatno će ti olakšati pisanje koda, jer možeš ga prilagoditi svojim potrebama instaliranjem različitih plugin-ova koji će ti olakšati proces izrade.

Pored text editora, moraš se upoznati sa command line interfejsom. Nauči osnovne linux bash komande, za kretnju po folderima, kreiranje, brisanje i prebacivanje podataka s jednog mesta na drugo, to ti je svakako osnova koju ćeš kasnije primenjivati u backend fazi.

Pored tog upoznavanja sa "okruženjem" u kom ćeš se usavršavati, na red dolaze jezici i alati koje moraš naučiti ako hoćeš da budeš developer. HTML, CSS i Javascript mora da se znaju. Sreća tvoja, nije ih teško naučiti, a osnove Javascripta možeš savladati putem besplatnih resursa što ti nudi Google (ili HelloWorld baza online kurseva). Kad to naučiš, usavršavaš se tako što praviš mini projekte koje ćeš osmisliti sam ili pronaći neke projekte koje ćeš samostalno "isplagijati". Dok se usavršavaš i "oštriš" veštine u kodiranju, ubaciš novu "krivu učenja" (learning curve) u vidu Git (version control) i otvaraš profil na Github platformi (ili Bitbucket) gde ćeš kačiti svoje projekte koji će drugi developeri (ili potencijalni poslodavci) moći da vide, da se upoznaju sa tvojim načinom kodiranja, eventualno da te posavetuju kako da se poboljšaš u određenoj sferi, pa i da zajedno radiš na projektima sa drugim developerima, što je najbolji vid učenja.

Sledeći korak je da naučiš kako da postaviš projekat online, da bude vidljiv svima (ne samo na Github-u). Basic deployment ti omogućava da se upoznaš sa različitim hosting varijantama, kao i domenima i tad postaješ frontend developer koji je sposoban da sam izradi statičku veb prezentaciju.

Ovde dolazi tvoja odluka šta dalje. Hoćeš li ostati na putu frontend developera ili ćeš da nastaviš sa učenjem, pa da se usmeriš i na backend izradu? Ako se odlučiš da ostaneš na frontend putu, preporuka je da naučiš da "crtaš" aplikacije u nekim od dizajn alata, kao što su na primer Adobe XD ili Figma. Ovde moraš malo da zabodeš nos u UI/UX dizajn (user interface/user experience), iako to nije glavni fokus developera. Moraš da znaš osnove dizajna kako bi mogao da osmisliš kako će neki sajt ili aplikacija da izgleda (frontend), ali i da možeš komunicirati sa dizajnerima koji osmišljavaju ceo izgled, a Figma recimo, ti omogućava da inspektuješ dizajn gde dobiješ deo koda koji ćeš koristiti u dev fazi.

Možda deluje zbunjujuće, ali frontend developer zalazi minimalno u dizajnerske vode i često je u komunikaciji sa dizajnerima prilikom izrade. Pored dizajn alata koje ćeš učiti da koristiš, nadograđuješ znanje CSS-a i Javascripta učenjem nekih od frejmvorka. Ako se odlučiš da kreneš putem backenda, onda ti ovi alati za dizajn i nisu potrebni.

Za CSS prvo učiš Sass (syntactically awesome style sheets) koji je preprocessor scripting language koji se interpretira i kompajlira u CSS (Cascading Style Sheets). Zvuči užasno, znam, ali veruj mi na reč, Sass je nešto najbolje što postoji za CSS i lako se uči. Neki od popularnih frejmvorka koji će ti olakšati i ubrzati proces izrade su Bootstrap, Foundation, Bulma, Materialize, Tailwind, i tako dalje, probaj ih sve (ili vidi na youtube kako se koji koristi), pa izaberi neki koji ti najviše odgovara i koji možeš lako usavršiti, ili ih nauči sve :D.

Drugi korak,  napredniji nivo (frontend)

Nakon toga se upuštaš u NPM (node package manager) za Javascript gde učiš kako da u svoje projekte ubacuješ određene pakete koji su izrađeni od strane drugih developera, koji će tvojoj aplikaciji dati ozbiljan boost u procesu izrade, ali sve to učiš dok granaš Javascript na advance deo. Ovim se stvara i podloga za backend deo.

Što se Javascript-a tiče, opredeljuješ se za neke od popularnih frejmvorka (ili biblioteka) i ovde postaješ polako advance frontend developer. Naravno, nakon što savladaš neki od frejmvorka i prethodno pomenute alate, ali nemoj misliti da je to lak posao i da ćeš za mesec dana biti ultra sjajan developer. Zapravo nema kraja tvom učenju i usavršavanju, nema veze na kom si nivou sa znanjem. Dakle, od popularnih jezika pomenuću tri koji se najviše upotrebljavaju: Angular(JS), React(JS) i Vue(JS).

Angular je Google-ov Javascript frejmvork za pravljenje mobilnih i desktop aplikacija. Baziran je na typescript jeziku (koga je izradio Microsoft) koji je open source, što znači da ga mogu modifikovati, praviti dodatne funkcionalnosti, redistribuirati drugi developeri u saradnji sa Googlovim Angular timom. React je frontend Javascript biblioteka za pravljenje korisničkog interfejsa. Izrađen i održavan je od strane Facebook developera i bazira izradu preko UI komponenti. Vue je javascript frejmvork za pravljenje korisničkog interfejsa napravljen od strane Evan You. Mnogi kažu da ga je najlakše naučiti, ali to ću ostaviti tebi da proceniš.

Svi ovi alati su Javascript i rade po sličnom principu izrade single-page aplikacija i ne možeš pogrešiti ako se opredeliš za bilo koji od ova tri.

Svakako ih moraš proučiti do određene mere, kako bi video koji ti od njih najviše leži, pa ti želim dobru zabavu u podizanju krive učenja na viši nivo. Na kraju, hteo si da postaneš ultra dobar developer.

Ušli smo u advance frontend dev, pa svoje "budženje" nastavljaš sa drugim skilovima, a ono što ti je potrebno da znaš je komunikacija sa serverom i bazama podataka, jer je i to u opisu posla frontend developera. Kad to savladaš, odlučuješ da li ćeš ostati u frontendu ili dalje da se usavršavaš, pa prelaziš na backend izradu.

Treći korak – backend

Ako si odlučio da zakoračiš u backend, postaćeš fullstack developer, pošto već znaš frontend deo. Zvuči sjajno fullstack, ali da bi došao do toga, treba ti još mnogo znojenja i provedenih sati ispred monitora. Sve u rok službe, što bi se reklo. Dakle, ovde krećeš putem usavršavanja gore pomenutog NPM i korišćenja drugih alata za pravljenje pozadinske infrastrukture nekog projekta ili aplikacije.

Ukratko backend izrada neke aplikacije je nešto što se ne vidi golim okom, jer se izrađuje serverska struktura. Uopšteno rečeno, komunikacija baze podataka sa frontend delom (korisnikom), u korelaciji sa logikom koja se implementira za tu komunikaciju i zaštitu podataka.

Ovde moraš odabrati odgovarajući jezik koji ćeš koristiti u izradi. U zavisnosti od tebe i tvojih afiniteta, imaš varijantu skripting jezika, funkcionalnih jezika i neke od drugih opcija. Za skripting jezike imaš na raspolaganju neke od popularnih jezika kao što su Python, Ruby, PHP, NodeJS, sa funkcionalne strane Elixir, Scala, Erlang, Haskell, Clojure i druge ili da se opredeliš za Java, Go, Rust i druge opcije. Većina ovih jezika dolazi sa svojim frejmvorcima koji ti olakšavaju proces izrade, pa moraš dobro odlučiti sa čime ćeš se naoružati za dalje.

Za početnike koji se opredeljuju ka fullstack putu, najbolje je odabrati neki od scripting jezika. To je samo moja preporuka, sve zavisi od tebe samog. Za ’’brzo i lako’’ učenje i usavršavanje odličan izbor je NodeJS ili PHP, a popularni su i Python i Java jezici. Opet kažem, ovaj odabir je na tebi samom i niko ne sme da ti soli pamet zašto si odabrao ovo, a ne ono, jer biraš ono što tebi odgovara, a za primenu ne brini, svaki jezik ima svoju ulogu u industriji.

Kad si odabrao svoj jezik u kome ćeš praviti serversku infrastrukturu, ostaje ti da vežbaš implementiranje i usavršavaš svoje skilove, a sve ćeš obavljati putem command line-a. Sećaš se, na početku sam pomenuo CLI, rekao sam ti da će postati ozbiljan igrač kasnije :D.

Ovde ćeš krenuti sa CRUD (Create, Read, Update, Delete)  operacijama i usavršiti komunikaciju frontend – backend što je suština fullstack developera. Izaberi neke od frejmvorka koji će ti dosta olakšati posao, pisaćeš određene test faze i scenarije. Naučićeš SQL i NoSQL baze podataka, koje su razlike, šta su prednosti, a šta mane pojedinačno. Savet je da se krene sa MongoDB koji je NoSQL, jer je lakši za početnike da se uhodaju u sam proces.

Od pomenutih frejmvorka, na raspolaganju ti je Laravel ili Symfony za PHP, Express.js za NodeJS, za ostale moraš da guglaš, pošto ih ima podosta, a čini mi se da sam te malo izmorio sa informacijama.

Nakon toga, upoznaj se sa REST (Representational state transfer), jer ćeš kreirati RESTful API. Uopšteno, to je sistem operacija između kompjuterskih sistema na internetu. Pokušaću da još malo pojednostavim - komunikacija između dva servisa kojim se šalju podaci (payload) u html, xml ili json formatu. Iskusniji bekendaši bi ti dali kompletniji odgovor, ali ako sam pogrešio ovde, ispravite me vi iskusniji :), a ti svakako pročitaj više o tome na internetu.

Posle toga, backendaš bi trebalo da se pozabavi sa sigurnosti na vebu, pa ćeš tako učiti o autentikaciji i autorizaciji. Učiš osnovnu (basic) autentikaciju, Token autentikaciju, JWT (JSON Web Token), OpenID (nije isto što i OpenID Connect). Sigurnosni protokoli kao što su HTTPS, CORS, SSL/TLS i ostali.

Opciono četvrti korak – ako hoćeš dalje da učiš (DevOps)

Ako te od ovoga ne zaboli glava i ako odlučiš dalje da nastaviš, možeš preći u devops svet. Ovo znači da polako prelaziš iz advance u expert znanje. Šta je devops?

Devops je najprostije rečeno, sve u jednom, ali ne radi sve u development fazi. Dakle, kombinuje razvoj softvera (Dev) i IT operacije (OPS). Cilj mu je da skrati proces razvoja sistema sa kontinuiranom isporukom softvera.

Ne bih da ulazim u detalje devops pozicije, jer svakako odskače od početničkog web developer puta, ali ako te interesuje dalji razvoj ovog roadmapa, ima dosta resursa na Guglu koji ti mogu pomoći u daljem nastavku razvoja.

Ovo ti je uopšteno neki plan za veb developera, nije jedini, možeš ga modifikovati, ima dosta toga što možeš dodati ili oduzeti, prilagoditi ih sebi, ali je važno da stvoriš sliku u glavi šta ti je potrebno da naučiš za poziciju veb developera. Možda bi precizniji opis bio fullstack developer, ali kao što sam već pomenuo, ima tu još dosta elemenata za "grananje" plana, pa neka ostane generalan naziv web developer. Imaš potpunu slobodu u odabiru svog putovanja ka "tituli" web developera.

Moram da ponovim, ne dozvoli da te obeshrabre pojedinci koji će ti pametovati da to što si odabrao nije dobro, da je beznačajno i glupo, da je jezik koji si uzeo da učiš bezveze (ovde dolaze i "pametni" razlozi zašto je bezveze). Tvoj plan je samo tvoj, tvoj izbor je samo tvoj, svi jezici su dobri, svi alati koje naučiš su sjajni, samo ti mogu pomoći u tvom poslu. Na kraju, ti si taj koji će graditi svoju karijeru i kodirati u tom jeziku, a ne pomenuti pametnjaković koji ti neumorno mudruje.


Pogledaj oglase za posao za poziciju Web Developer. Srećno!

Izvor fotografije: Freepik.com

(54 osobe su glasale, prosečna ocena: 5)
Običan i opušten lik, technology freak. Čovek koji kad ode u šoping po odeću (ili bilo šta drugo), vrati se sa nekim tech gedžetom ili komponentom za PC. Bavi se web programiranjem, trenutno kao frontend developer, sa ciljem da se lagano prebaci u fullstack kad se poklope sve kockice u glavi. U slobodno vreme kad ne ispija piva sa društvom, čita knjige, tech blogove, gleda filmove, serije, šeta uz reku i, naravno, gejming do kasno u noć.

Ostavi komentar

Odgovori

Greška

Popuni sva obavezna polja!
Copyright © 2021 ·
Made with in Subotica.
Sadržaj sajta je u vlasništvu kompanije HelloWorld. Zabranjeno je njegovo preuzimanje bez dozvole.
Uspešno
Neuspešno urađena operacija
Prijavi se u svoj nalog
Zaboravljena šifra?

Nisi registrovani korisnik? Napravi nalog ili se prijavi putem društvenih mreža.



Prijava putem društvenih mreža

Kontaktiraj nas

Potvrdi

Greška