Slika koju je napisala Aphinya Dechalert. Pod naslovom

Kako izaći iz noobvillea i kao programer prijeći upute za početnike?

vodič za usavršavanje sa staze za samo učenje

Web programeri danas imaju tendenciju da se samouče i uđu u polje s dovoljno znanja da bi se započeli, ali nisu dovoljno opasni da detroniziraju one sa diplomama informatike.

Mnogi se programeri samouki zaglave u prostoru poznatom kao noobville, ne zato što su loši u šifriranju, već zato što jednostavno trebaju neke upute. Sjećam se da sam jednom prilikom, prije 7 godina, bio u noobvilleu i poželio sam vodiča koji je odredio ono što trebam za nadogradnju.

Bilo je puno pokušaja i pogrešaka, industrijskih otkrića i bavljenja novom tehnologijom dok su izašli. Nakon što sam vidio kako moji juniori prolaze kroz iste borbe, odlučio sam napisati vodič kakav bih volio da imaju kad budem vodio njihov tim.

Dakle, bez daljnjih pokusaja, predstavljam vodič za poboljsanje Vaših web dev sposobnosti.

Tehničko trojstvo

Često volim nazvati temeljni snop s prednjim krajem tehničkim trojstvom. Sastoji se od HTML-a, CSS-a i JavaScript-a.

Krenimo s CSS-om

Nema ničega fantastičnog što stvarno trebate naučiti na HTML-u, ali CSS se s vremenom može malo komplicirati.

Sve započinje s klasom ovdje i tamošnjom klasom. Sljedeće što znate, poškropili ste desetak duplikata koji su razbacani po vašoj prijavi. Ljudi pričaju o mirisu koda, ali to je uglavnom usmjereno na JavaScript i druge "odgovarajuće" programske jezike. CSS se stavlja na stranu jer se čini laganim.

Ali nije - pogotovo kad dođe do određene veličine.

Kako postati bolji:

Pogledajte modularnu CSS arhitekturu. Postoji i koncept koji već neko vrijeme postoji pod nazivom Objektno orijentirani CSS. Da. To je stvar, a dugoročno vam može pomoći spasiti bazu kodova od ludila.

Proprocesori poput SCSS-a čine dobre alate za apstraktiranje vašeg CSS-a u format koji je mnogo ljudski čitljiviji. Može se tvrditi da je to samo sintaksa šećera, ali ponekad, nakon dugog dana osjećaja slanosti prema šifri špageta druge osobe, voljeli biste imati samo malo slatkoće.

Što Googleu:

OOCSS, BEM, SMACSS, SCSS

Također moramo razgovarati o JavaScript-u

Mnogi ljudi skupljaju trojstvo misleći da to ne moraju naučiti kako treba. Djeluje, zašto se zabrljati s tim?

Ali to je kako jedan čovjek uplovi pravo u ledeni berg i potone brod u najekantnijem stilu. Aplikacije se ruše i izgaraju zbog nedostatka znanja. React i Angular neće vas moći spasiti jer su samo alati.

Jedna je stvar upotreba JavaScripta. Drugi je jezik koji govori JavaScript.

Kako postati bolji:

Saznajte kako rade prototipovi. To je osnovna značajka JavaScripta koje početnici često previdje jer postoji zabluda da nije potrebna.

Pogledajte u paradigmi programiranja JavaScripta i arhitektonskih struktura. Kohezija koda i različite misli o ovoj temi mogu vas prosvijetliti o neučinkovitosti vaših obrazaca i postavki kodiranja.

Što Googleu:

JavaScript prototipovi, kohezija JavaScript koda, jedna odgovornost, redovni izrazi JavaScript, OOP JavaScript, FP JavaScript, proceduralni JavaScript, skripti JavaScript algoritma

Popis paradigmi

Dvije najpopularnije programske paradigme su OOP (objektno orijentirano) i FP (funkcionalno programiranje). Međutim, to nisu jedine dvije teorije i metoda strukturiranja koda koje postoje.

Pomno slijedi proceduralno, deklarativno i imperativno programiranje.

Da biste proširili svoj um, trebate se upoznati sa umjetnošću programiranja paradigmi. Pružit će vam mogućnost da se povučete i pogledate kôd kao niz dijelova koji se mogu koristiti na određeni način.

Jednom kada shvatite paradigme programiranja, više nećete gledati kôd kao kôd. Postoji određeni osjećaj prosvjetljenja koji dolazi sa sviješću o takvom znanju.

Vaš će se odnos s kodom promijeniti i postat će više od samo zataškavanja, ako postoje izjave unutar funkcija kako bi stvari funkcionirale.

Kako postati bolji:

Započnite s OOP-om jer se JavaScript temelji na prototipima što je objektno orijentirana paradigma programiranja. Nakon što ste se obrukali na to, počnite gledati FP jer on ide prilično dobro kod prototipova.

U stvari, ovladajte konceptom prototipova jer je to temeljni temelj stvaranja čistog koda u JavaScript-u. Obje metodologije razmišljanja također se mogu prenijeti u okvire i knjižnice poput Angular, React i Vue.

Nakon što vam obore obje teorije, nastavite put i istražite proceduralno, deklarativno i imperativno programiranje. Nisu toliko popularni, ali mogu vam dati uvid u različite načine razmišljanja koji su stvoreni kako bi riješili niz određenih problema. Jedna se metodologija u nekim situacijama više uklapa u odnosu na druge. Naučiti prepoznati te scenarije zahtijeva znanje i razumijevanje rješenja koja su stvorena za njihovo rješavanje.

Što Googleu:

OOP Kutne funkcije, prototipi u djelovanju, OOP i FP obrasci, SOLID principi s OOP i FP

Konvencije

Konvencije koda je kako programeri ostaju na istoj stranici. To je i vrijeme i testirano na ljudima način da svoj kôd bude strukturiran, uniformiran i čitljiv.

Kad počinjemo, često imamo svoje ideje kako imenovati klasama, datotekama, karticama ili razmakom uvlačenje našeg koda. Ponekad nemamo ni jasnu strukturu kako imenujemo stvari, izbacujući ono što se tada činilo logičnim - samo da se osvrnemo i pitamo se što misliš.

Ne znati konvenciju koda je poput gledanja djeteta kako nosi tanjur za večeru - dijete ne zna ništa bolje i smatra da je to najveća stvar na svijetu, ostavljajući veliki nered nekom drugom da pospremi.

Jedna je stvar biti jedina osoba koja radi na bazi podataka. Stvari postanu zamršene kada postanete dio tima.

Kako postati bolji:

Jedan od najjednostavnijih načina da se preuzme glavna konvencija oblikovanja je uporaba i IDE koji podržava automatsko oblikovanje. U Visual Studio Code nalazi se proširenje Esben Petersen koje se naziva Prettier - Oblikovatelj koda koje automatski oblikuje kôd na standardizirani način kada pritisnete Spremi.

Ljepota ljepše je što nema veze kako formatirate svoj kôd, jer će ga na kraju riješiti. Ako se već ne udovoljavate konvencijama kad su u pitanju udubljenja, položaji u zagradama i umetnuti kôd, izlaz koji Prettier generira mogao bi postati šok za vaš sustav - ali to je dobra vrsta šoka koji bi vas trebao početi poticati pravi smjer kada je u pitanju pisanje koda koji je pravilno oblikovan.

Ali ljepši se ne bavi svime što se tiče konvencija. Trebat ćete naučiti konvencije o imenovanju, kada koristiti __ i u kojem kontekstu. Strukture mapa za vašu vrstu projekta i vrstu grupiranja datoteka za vašu odabranu biblioteku ili okvir.

Što Googleu:

Konvencija JavaScript koda, imenovanje konvencija u JavaScript, Ugaona / React / Vue konvencija imenovanja, Kutna / React / Vue / sve što koristite uz vrh konvencija JavaScript mape, kako instalirati proširenja VS koda

Principi vizualnog digitalnog dizajna

Kao web programer, put do stvaranja vizualno zapanjujućih digitalnih dizajna može doći već popločen šaljivim prozora i dizajnerskim PDF-ovima. Međutim, život kao vrag nije uvijek tako jednostavan i poznavanje principa vizualnog dizajna može vam pomoći da razaznate njegov odnos i strukturu vašeg koda.

Kad ste u stanju razumjeti principe digitalnog dizajna, moći ćete unaprijed razmišljati o tome kako biste trebali arhitekturu koda uskladiti. Poznavanje principa digitalnog dizajna čini vas svestranijim programerom koji može predvidjeti iznimke u dizajnu i podići zastavu. Također poboljšava vaš odnos s stvaranjem tekućeg koda koji može zadovoljiti mnoštvo zahtjeva za veličinom zaslona.

Kako postati bolji:

Google je izašao s Material Designom kao smjernicom za stvaranje intuitivnih proizvoda. Klasičnih šest načela dizajna još je uvijek relevantno za digitalni prikaz, tako da bi moglo biti isplatno provjeriti i ovo.

Dizajn je umjetnički oblik i ako niste dovoljno sigurni da biste stvorili svoja sučelja dobrog izgleda, u redu je pogledati dizajne drugih ljudi i kopirati ih. Radite na ponovnom stvaranju vizualnih klonova s ​​omiljenih web stranica i mobilnih sučelja. To će vam pomoći da shvatite korištene obrasce, način na koji oni komuniciraju i provode se.

Što Googleu:

principi vizualnog dizajna, dizajn materijala, nagrade, Smashing magazin, dizajn fluida, adaptivni dizajn, mobilni prvi dizajn

Morate naučiti Gita

Nema bijega od gitaka čak i ako želite. To je najveće i najpopularnije dijete u bloku kada je u pitanju kontrola verzija, dijeljenje koda i pregled promjena.

Ako ne znate kako koristiti git, vi ste u nepovoljnom položaju, posebno kada je riječ o radu s timom. Većinu vremena znanje gita jedan je od glavnih pokazatelja potpunog početnika u odnosu na mlađeg programera.

Kako postati bolji:

Ne brini. Git je jednostavan. Najmanje što vam treba je kako stvoriti podružnicu, pozornicu, gurnuti se i prebaciti natrag. Spajanje git granja može se obaviti putem poteznih zahtjeva, ali ako to trebate učiniti u konzoli, nekoliko upita u Google trebalo bi vam dati naredbu koja vam je potrebna.

Možete vježbati stvaranjem GitHub računa, ako ga još nemate. Igrajte se s naredbama i naučite kako ga povezati s računom putem konzole. Teoretski možete koristiti klijent GitHub koji će vam pružiti vizualnu verziju, ali to pobija svrhu učenja gitta. Učenje naredbi terminala također može biti korisno i ubrzati radni tijek za neke slučajeve.

Što Googleu:

git, naredbe tijeka rada git, uči git

Ispitivanje jedinice 101

Jedinstveno testiranje zahtijeva potpuno drugačiju metodu razmišljanja kada je u pitanju način stvaranja koda. Sve započinje s očekivanim rezultatom na umu i osigurava unošenje i rješavanje iznimki.

Uobičajeni način na koji ljudi uče kodirati je na ad hoc način s eksperimentalnim funkcijama tu i tamo, baveći se mutacijama koda kako dolaze. Test vođen pristup počinje od kraja i djeluje unatrag prema početku. Osigurava vam da arhitektirate svoj kôd prije nego što skočite na to da zakucate čavle u drvo.

Naučite umjetnost testnog dizajna i arhitekture kako biste osigurali da budete snažni proizvod koji detektira ulaze i izlaze. Smanjuje ljudske nedostatke u grešci i hvata bube prije nego što se provuku kroz pukotine i postave svoju dosadnu glavu na najnezavidnija mjesta.

Prisiljava vas da razbijete svoj kôd na dijelove i pomognete vam da provjerite radi li određena jedinica koda kako se očekuje. Ako se nešto promijeni u bazi vašeg koda, testovi bi trebali uhvatiti bilo kakve prekide koje uzrokuju promjene - na taj način smanjite vrijeme potrebno za praćenje pogreške i njezino podrijetlo.

Kako postati bolji:

Dostupno je više jedinica okvira za testiranje i biblioteka poput Jasmine, Mocha i Jest. Postoji velika vjerojatnost da ćete za izradu JavaScript stranice vašeg koda koristiti nekakav okvir, poput kutnog ili biblioteke poput React. Morat ćete potražiti koji se testni okvir ili knjižnica upotrebljava s njim.

Što Googleu:

principi jedinice testiranja, što nije testiranje jedinice (radi otklanjanja uobičajenih zabluda), Jasmine, Mocha, Jest, razlike između jedinica testiranja okvira i knjižnica, obrasci testiranja jedinica

Potpuno slaganje s čvorom i bazom podataka

Ako se bavite samo webom, onda to čini i web developerom na prvom mjestu. No, znanje o tome kako se stvaraju API-ji i kako stvari utječu na bazu podataka može vam pomoći u razlikovanju od čistog razvojnog sučelja.

Iako nije preduvjet da postanete fantastični web programer, to može povećati vaše vještine i ojačati vaše razumijevanje s perspektivom od kraja do kraja. I ne samo to, vaše vještine čine povoljnijim za potencijalne poslodavce.

Većina tradicionalnih tvrtki bavi se relacijskim bazama podataka na mySQL-u, tako da je dobro imati neko znanje i razumjeti kako funkcioniraju tablice i odnosi. Mnogi se startapovi odlučuju za baze podataka bez tablice kao što je MongoDB zbog dugoročnih troškova, fleksibilnosti koju donosi za potencijalni rast i jednostavnosti implementacije.

Node.js vam daje mogućnost stvaranja podupiračkog sučelja između vaše baze podataka i prevode ga u potrošni API za vaš prednji kraj.

Kako postati bolji:

Napravite skup CRUD API-ja koji se spaja na bazu podataka ako se do sada nikad niste susreli s Node.js. Stvaranje, čitanje, ažuriranje i brisanje sveti je gral gotovo svih mogućih radnji koje se mogu dogoditi. Sve se na kraju vraća u bazu podataka i ako ste u mogućnosti stvoriti skup API-ja koji u interakciji s njom postavite za mnogo potrebnih pomoćnih poslova.

Kako se Node.js nalazi u JavaScript-u, život vam je puno lakši nego što bi bio prije desetak godina gdje ćete za stvaranje takvih stvari trebati naučiti neki drugi jezik poput Jave ili C ++.

Što Googleu:

Node.js CRUD, čvorna veza na bazu podataka, obrasci API čvora, MongoDB, mySQL dizajn i arhitektura

Mogućnosti infrastrukture

AWS, Google Cloud, Azure i Heroku svi su potencijalni prostori koje možete istražiti kada je riječ o infrastrukturi. Jedna je stvar biti u mogućnosti kreirati aplikaciju od kraja do kraja - druga je stvar to staviti negdje i učiniti ju javno dostupnom.

Kada je riječ o AWS-u, korištenje S3 za statički hosting koštat će vas samo centi. Također je vrijedno napomenuti da je AWS najveći igrač u oblačnim rješenjima i nudi više od 90 usluga koje pokrivaju sve što možete zamisliti.

Gloogle Cloud i Azure slijede isti koncept, nudeći jednake usluge s konkurentnim cijenama.

Heroku je više poput kutije u koju možete staviti sve što želite - što može biti svestrano rješenje ako želite svoju aplikaciju staviti na web.

Kako postati bolji:

Odaberite jednu od gore navedenih usluga, otvorite besplatni račun i uvedite aplikaciju koju ste stvorili na web. Istražite kako različite usluge djeluju zajedno i kako podijeliti svoju aplikaciju za kompletan paket na dijelove kako bi odgovarali.

Pomoću Heroku-a upoznat ćete se s alatima Docker i naredbenog retka. Korištenje AWS-a pomoći će vam da se naviknete na njihovo osnovno odijelo za web rješenja. Isto vrijedi i za Google Cloud i Azure.

Infrastruktura je jedna od onih stvari koje su vam samo potrebne da vam se operu ruke kako biste vidjeli kako se sve to uklapa.

Što Googleu:

AWS / Azure / Google Cloud web stack / implementacija, Heroku i Docker, Docker implementacije, kontinuirani cjevovod za isporuku za AWS / Azure / Google Cloud / Heroku

Završne riječi

Ponekad je teško usaditi vještinu kad ne znate što biste trebali učiti. Nadam se da je ovaj vodič pomogao proširiti vašu svijest o rasponu tema potrebnih za nadogradnju s newbie / junior razine.

Pravi staž u programskom svijetu ne određuje se brojem tjedana, mjeseci ili godina koje osoba ima pod svojim pojasom. Određuje ih njihova dubina i širina znanja, koliko fleksibilan i fluidan njihov um može primijeniti i prilagoditi to znanje problemima i njihovim sposobnostima da kreativno izrađuju kod na najučinkovitiji, ljudski čitljiviji i sažetiji način.

Ostanimo u vezi i pridružimo se mojem tjednom fantastičnom popisu biltena putem web stranice. Hvala vam na čitanju.❤

Aphinya