Veebiarendajaks õppimine on tänapäeval kättesaadav kõigile – ja seda täiesti tasuta! Õpi veebiarendajaks näiteks internetist ja Youtubest, kust leiad kõik vajalikud õppematerjalid. Eelduseks on vaid piisava huvi olemasolu ning oma aja investeerimine õppimisse. Alguses on lihtne vaimustuda, sest esimesed teemad (HTML, CSS) on pigem lihtsad ning siis tundub, et kõik läheb ludinal, kuid kui tulevad raskemad teemad, siis on lihtne loobuda.
Minu arvates on edu võti see, kui sõlmid endaga kokkuleppe tegeleda veebiarenduse õpingutega järjepidevalt, nt 30 min või 60 min iga päev või üle päeva. Kasuks tuleb, kui omad selget eesmärki, miks see sinu jaoks vajalik on (kas lihtsalt hobikorras, karjäärimuutuseks, lisaraha teenimiseks vm põhusel). Abiks on erinevad e-kursused, mis aitavad fookust hoida (sest teemadesse võib muidu “ära uppuda”) ning kasuks tuleb erinevate “projektide” tegemine, kus saad õpitut läbi harjutada ning midagi päriselt valmis “ehitada”.
Kui õpid muude toimetuste ja nt põhitöö kõrvalt, siis võid õppeajaks arvestada minimaalselt 6 kuud, aga tõenäolisemalt 1-2 aastat jõudmaks tasemeni, kus tunned end teemades juba enesekindlamalt (kuid samas oled tasemelt ikkagi pigem “juunior”). Juuniorist edasi arenemine võib toimuda päris kiiresti, aga see sõltub paljuski, kas töötad siis juba igapäevaselt veebiarendajana või mitte ning kui palju panustad jätkuvalt oma õpingutesse.
Frontend arendaja, backend arendaja või fullstack arendaja – millise suuna valid?
Frontend arendaja tegeleb veebisaitide ja veebiäppide ning nende välimuse, kasutusmugavuse ja kasutajaliidestega. Tüüpilised tehnoloogiad, mida frontend arendaja kasutab, on: HTML, CSS, Sass, JavaScript, TypeScript, JS raamistik (nt React) jne.
Backend arendaja tegeleb serverite ja andmebaasidega. Tüüpilised tehnoloogiad, mida backend arendaja kasutab, on: NodeJS, Python, C#, PHP; erinevad SQL päringukeeled andmebaaside jaoks.
Fullstack arendaja kombineerib teadmised ja oskused mõlemast eelnevast ning oskab luua terviklahendusi algusest lõpuni.
Millist koodikirjutamise tarkvara kasutada?
Variante on väga palju erinevaid, aga minu lemmik on VS Code: https://code.visualstudio.com/
Kuidas saada frontend arendajaks ehk mille õppimisest täpsemalt alustada?
Kuidas internet ja veebisaidid toimivad
Tee endale selgeks baasteadmine, kuidas internet ja veebisaidid toimivad.
HTML ja CSS
- HTML lehe struktuur ja komponendid
- CSS abil kujundamine (ära ürita kõike 100% selgeks või pähe õppida; saa aru, kuidas toimib ja mida CSS võimaldab teha – edasine tuleb juba töö käigus)
- Elementide paigutus ja joondus (Flexbox, CSS Grid)
- Üleminekud ja animatsioonid
- Ekraanisuurusega kohaldumine (responsive design) / media queries
Kujundus/disain
- Veebiarenduses tuleb kindlasti kasuks, kui tead ühtteist ka kujundusest ja disainist: värvikoodid, kontrastiprintsiip, fontid, raster- ja vektorgraafika, ikoonid jne.
- Programmidest võiksid teha tutvust Adobe Photoshopi ja Illustratoriga
Sass ja Bootstrap
- Soovituslik on järgmise sammuna kohe juurde õppida ka Sass-i ning Bootstrapi, sest nende omandamine ei võta kaua aega ning need on väga laialt levinud.
NB! Sulle võib huvi pakkuda eestikeelne e-kursus:
Kuidas luua oma esimest veebilehte (HTML, CSS, Bootstrap, JS, PHP)?
(e-õpe, 16h, eesti keeles)
JavaScript
Erinevalt HTML-ist ja CSS-ist on JavaScript programmeerimiskeel. Selle abil saad ehitada funktsionaalseid veebirakendusi. JavaScripti ABC omandamine ei ole ülikeeruline, aga JS süvitsi õppimine on kindlasti juba suurem väljakutse ning ajamahukam ettevõtmine. Soovitan läbida mõne põhjaliku JS e-kursuse ning teha erinevaid projekte omandamaks baasteadmised:
- ABC: muutujad, massiivid, tingimuslaused, funktsioonid, silmused
- DOM: document object model elementide valimine ja muutmine JS abil
- Massiivide meetodid: foreach, map, filter, reduce jne
- JSON: JavaScript Object Notation andmevahetusvorming
- HTTP päringud: GET, POST, PUT, DELETE
- Fetch API
Versioonikontroll ja koodihaldus
Täiendavad tööriistad
- Node Package Manager: NPM
- Veebilehitseja arendaja tööriistad: console, network jne (tõenäoliselt puutusid nendega juba lähemalt kokku ka siis, kui asusid JS-i õppima), nt Chrome DevTools
Veebimajutus ja frontend deployment
Loomulikult peaksid oskama oma veebisaite ja -rakendusi ka veebis kättesaadavaks teha ning majutada. Selleks tutvu lähemalt nt:
- CPanel hosting: Bluehost, Hostgator, InMotion
- Static hosting: GitHub Pages, Heroku, Netlify
Domeen ja SSL sertifikaat
- Domeen: namecheap, Google Domains, Enom
- SSL sertifikaat: Let’s Encrypt (tasuta)
Õpi veebiarendajaks checklist: mida pead oskama, et olla juunior frontend arendaja?
- Oskad seadistada oma arendaja töökeskkonna ning tead, milliseid tööriistu selleks kasutada
- Omad arusaama, kuidas toimib internet ja mis toimub taustal, kui kasutaja külastab veebisaiti X
- Oskad lugeda ning ise kirjutada HTML, CSS ja JavaScripti
- Tead, mis on Sass ja Bootstrap ning oskad neid vajadusel kasutada, suudad luua responsive veebilehti
- Oskad DOM-i muuta ja lisada JS abil funktsionaalsust
- Oskad ühenduda API-dega kasutades Fetchi
- Oskad kasutada Git-i ja GitHub-i
- Oskad veebiserverisse paigaldada ning hallata lihtsamat veebisaiti või -rakendust
Kuidas juunior frontend arendajast edasi areneda ja mida juurde õppida?
Siinkohal on kindlasti kasulik edasi arenemiseks saada päris vajadustega projekte ja probleeme, mida aitad lahendada. Töö käigus tekivad küsimused ning neile vastuste otsimisega omandad järjest juurde uusi teadmisi ja oskusi.
Olles eelneva omandanud, siis edasi võiksid õppida:
- Täienda oma JS teadmisi ja oskusi
- Õpi juurde JS raamistik, nt React + Redux (state management)
- Õpi juurde Static Site Generator (nt Gatsby)
- Õpi juurde Node.js (või Python/PHP/C#)
- Õpi juurde TypeScript
- Õpi juurde testimise kohta (unit tests, integration tests, end-to-end/UAT tests)
- Õpi juurde CMS (nt WordPress) või headless CMS (nt Strapi)
Õpi veebiarendajaks: backend ja fullstack arendaja?
Backend arendaja tunneb väga hästi serverite, andmete, päringute ja andmebaasidega seonduvat. Kui frontendi poolel õppisid selgeks JavaScripti, siis on lihtsam backendi jaoks juurde õppida Node.js (aga variandid on ka Python, C#, PHP, Java jt). Node.js-iga kasutatakse tüüpiliselt Express raamistikku – seega jälle üks uus asi, mida endale selgeks teha 🙂
Andmebaasidest on levinud variandid PostgresSQL, MongoDB, MySQL või MS SQL.
Lisaks õpid paigalduse, serverite ja DevOps maailmas levinud lahendusi, nt: Heroku, AWS, Azure, Docker, Kubernetes, NGINX, Apache, Jenkins jms.
Fullstack arendajana tead ja oskad:
- Kuidas luua frontend ja backend (ehk fullstack) lahendusi ning neid paigaldada ja hallata
- Tunned lisaks frondile hästi ka serveripoole keelt või keeli ja tehnoloogiaid
- Oskad luua ja hallata andmebaase
- Mõistad ja oskad luua RESTful API-sid
- Kasutad oskuslikult terminali
Õpi veebiarendajaks: kuidas seda kõike selgeks saada, tööd leida ja veebiarendusega raha teenida?
- Koosta plaan, kuidas õpid (nt 30 min iga päev) ja pane paika mõned verstapostid (nt mida soovid esimese 3 kuuga selgeks saada)
- Õppimise kõrvalt pane kokku online portfoolio – sinna saad lisada projektid ja tehtud tööd (tihti kasutatakse selleks githubi kontot)
- Täienda oma LinkedIn profiili (või kui sul seda pole, siis loo konto ja tekita)
- Hakka tööle kandideerima või tööampse tegema (nt upwork.com vm keskkonnas). Päris palju tööampsude pakkumisi liigub ka vastavates Facebooki gruppides, millega saad liituda.
- Jätka pidevalt juurde õppimist! 🙂