Den praktiske guiden for å bli profesjonell webutvikler

Denne artikkelen er ment å tjene som en praktisk guide til å bli en profesjonell webutvikler. Jeg har brukt over 20 år på å skrive kode for nettet. Jeg jobber med og hjelper utviklere daglig. I denne artikkelen vil jeg fortelle deg hva du bør lære, når du skal lære det, og hvor du kan lære det av (vanligvis gratis ). Deretter gir jeg deg råd om hvordan du får erfaring i den virkelige verden, og viktigst av alt, hvordan du får betalt for å skrive kode.

Forfatterens merknad: På grunn av populær etterspørsel er denne artikkelen nå tilgjengelig som en utvidet eBok som inneholder et spesielt vedlegg som setter alle lenkene fra denne artikkelen i en lettlest liste. Du kan få e-bokversjonen her.

Jeg får ingen direkte kompensasjon for å nevne noen av nettstedene som er oppført her. Jeg vil bare gi deg de beste ressursene som er mulig for å hjelpe deg med å komme dit du skal.

To ting å huske på ...

1. Det er greit å hoppe videre.

Denne guiden vil hjelpe deg uansett hvor du er på reisen mot å bli en profesjonell utvikler. Etter å ha lest denne introduksjonen, er det bare å bla til overskriften som best beskriver situasjonen din og begynne å lese derfra. Hvis du akkurat har begynt, eller bare tenker å komme i gang, så følg kongens råd fra Alice in Wonderland ...

“Begynn i begynnelsen og fortsett til du kommer til slutten; så stopp. ”

2. Få raskt en smak av alt først, og spesialiser deg deretter.

Penger er ikke det viktigste. Du må ❤ ELSKE ❤ det du gjør! Men du vet ikke hva du elsker før du prøver det.

Denne guiden handler om å hjelpe deg med å bli kjent med så mange områder av webutvikling som mulig, så raskt som mulig, og deretter hjelpe deg med å spesialisere deg i den du elsker. Først vil du ikke mestre noe, du vil bare lære det grunnleggende og gå videre til neste ting. Når du har funnet din lidenskap, skal jeg vise deg hvordan du kan grave dypere.

Jeg har bestemt meg for å lære å kode. Jeg liker nettet. Jeg er ikke sikker på hvor jeg skal begynne.

Gratulerer! Dette er et stort første skritt og starten på noe veldig spennende. Det kan også være helt overveldende. Ikke bekymre deg, jeg er her for å hjelpe.

Ditt første mål bør være å komme raskt i gang med det grunnleggende innen alle områder av webutvikling (ofte kalt "full stack"). Du vil gå veldig bredt i læringen, men ikke veldig dyp. Dette handler bare om å hjelpe deg med å finne det området du liker best og bygge opp noen generelle ferdigheter over hele linja, slik at du kan sette pris på og håndtere et bredt spekter av utfordringer uavhengig av hvor du ender med å spesialisere deg.

Lær grunnleggende HTML

Hypertext Markup Language (HTML) er det som styrer innholdet og utformingen av det du ser i nettleseren din. Ved å starte der, vil du gi deg et brukergrensesnitt som du kan bruke til å samhandle med, og se resultatene av koden din. Når du takler mer avanserte språk, vil dette bli stadig viktigere. Du vil ikke kode i mørket.

Her er HTML-en du trenger å lære om først (klikk på lenkene for å få en gratis opplæring):

  • Starter
  • Merker, attributter og elementer
  • Sidetitler
  • Avsnitt
  • Overskrifter
  • Lister
  • Lenker
  • Bilder
  • Tabeller
  • Skjemaer
  • Sette alt sammen

Jeg kjenner noen grunnleggende HTML

Rått! Det er et viktig første skritt. Nå trenger du litt grunnleggende JavaScript.

Lær grunnleggende JavaScript

JavaScript er språket på nettet, alle store nettlesere (Chrome, Firefox, Safari, IE og mange flere) har innebygd JavaScript-støtte. Hvert nettsted eller nettapplikasjon du noen gang har brukt, har sannsynligvis mye og mye JavaScript-kode bak det. For ikke å nevne, JavaScript blir nå også populært på andre plattformer, inkludert servere, stasjonære maskiner og enheter.

For øyeblikket trenger du bare det grunnleggende, disse lenkene vil hjelpe:

  • Å få ting til å skje
  • Variabler og data
  • Gjør matematikk
  • Logikk
  • Betinget
  • Looping
  • Funksjoner
  • Objekter
  • Arrays
  • DOM
  • Arrangementer og tilbakeringinger
  • AJAX
  • JSON
  • omfang

Jeg kjenner noen grunnleggende JavaScript og HTML

Fantastisk! La oss få litt CSS under beltet.

Lær CSS

CSS står for Cascading Style Sheets. Den brukes til å tilpasse utseendet på HTML-elementene på siden din. Følg denne gratis opplæringen fra Mozilla, for å få det grunnleggende, og konsulter ofte CSS-Tricks for å løse de vanskeligste CSS-problemene (bruk søkefunksjonen øverst til høyre).

Gå til "Back End"

På dette tidspunktet har du blitt utsatt for det som kalles "front-end web-utvikling". Det vil si at du kjenner de viktigste språkene som kjører i en nettleser. Det er på tide å flytte til "bakenden". Som er kode som kjører på en server. Ikke bekymre deg, du trenger ikke en server for å lære dette, din egen datamaskin vil gjøre det bra.

Det er mange backend-språk, men siden du allerede er kjent med JavaScript, vil jeg anbefale deg å lære å bruke Node JS. Node JS lar deg utføre JavaScript-kode på en server (i stedet for i en nettleser).

I tillegg til Node JS, bør du lære om Express og Mongo DB.

Uttrykke

Express er et bibliotek som gjør det lettere for Node JS å fungere som en webserver (dvs. lytte etter "forespørsler" fra websidene dine, og sende "svar" tilbake til websidene dine).

Mongo DB

Mongo DB er en database. Den lar deg lagre og hente informasjon.

Du kan lære om Node JS, Express og Mongo DB, fra denne utmerkede, gratis opplæringen og oppfølgeren.

Jeg må velge mellom å være en “Front End”, “Back End” eller “Full Stack” -utvikler.

Hvis du har blitt utsatt for begge ender, er det på tide å ta et valg. Hvis ikke, vennligst følg rådene i forrige avsnitt for å fylle eventuelle hull i din kunnskap.

Nå har du skrevet to typer kode. Ett slag har å gjøre med brukerinteraksjon. Den andre typen har med datainteraksjon å gjøre. Hvilken type foretrekker du?

Brukerinteraksjon? Gratulerer, du er en frontend-utvikler!

Datainteraksjon? Gratulerer, du er en back-end-utvikler!

Både? Gratulerer, du er en full stack-utvikler!

Hatet alt? Gratulerer, det å bli nettutvikler er ikke noe for deg, vær glad du skjønte dette nå i stedet for å kaste bort mer tid og penger. Ikke klar til å gi opp ennå? Kanskje du ikke har funnet et språk du elsker ennå? Prøv noen av de andre språkene som er dekket i "Jeg vil være en backend-utvikler".

Jeg vil være en Full Stack Developer

Kul. Du må lese og gjøre alt under Jeg vil være en Front End Developer og jeg vil være en Back End Developer nedenfor .

Jeg vil være en Front-End-utvikler, og jeg kjenner noen grunnleggende JavaScript, HTML og CSS

For å være effektiv som en front-end utvikler, må du mestre HTML, CSS og JavaScript på klientsiden. Du må også bli dyktig i noen viktige rammer. Dette vil gi deg ferdighetene som arbeidsgivere og kunder forventer av front-end-utviklere.

Nå bør du vite litt grunnleggende HTML. Hvis ikke, gå tilbake til Learn Basic HTML.

Lær mellomliggende og avansert HTML

Følg denne mellomliggende HTML-opplæringen og deretter denne avanserte HTML-opplæringen for å få deg dyktig opp.

Lær avansert JavaScript på klientsiden

For å utjevne JavaScript-en din anbefaler jeg sterkt bokserien, You Don't Know JS av Kyle Simpson. Forfatteren har gjort hele serien tilgjengelig på nettet for gratis på disse lenkene:

  1. “Opp og går”
  2. “Omfang og stengninger”
  3. “Dette og objekt prototyper”,
  4. “Typer og grammatikk”
  5. “Asynkronisering og ytelse”
  6. “ES6 & Beyond”

Sammen med disse bøkene, bør MDN JavaScript-referansen bli din beste venn.

Å kjenne "front-end trifecta" HTML, CSS og JavaScript er bra. Men for å begynne å tjene penger, må du bli kjent med noen rammer.

Lær jQuery

jQuery er det mest populære JavaScript-biblioteket gjennom tidene. Selv om noen nyere rammer gjør jQuery mindre relevant, er sjansen stor for at jQuery vil være en del av stillingsbeskrivelsen (og intervjuet) i mange år fremover.

Jeg anbefaler å følge jQuery-banen på FreeCodeCamp for å begynne å lære jQuery raskt og effektivt. Etter det, gå til jQuerys offisielle læringsside for å få mer instruksjon.

Du vil også ønske å holde jQuery API-dokumentene nyttige.

Lær et populært JS Framework

Rammeverk gjør det lettere å jobbe med et bestemt språk eller en bestemt teknologi ved å løse og løse noen av de største problemene med den teknologien. JavaScript har sett en stor velsignelse i utviklingen og populariseringen av rammer.

Det virker som om hver uke er det et nytt JavaScript-rammeverk som blir spioneringen som neste defacto-standard. Du må sjekke jobbtavlene eller gjøre noen googling for å finne ut hvilken som er den mest populære for ditt marked. Et godt sted å sjekke er verktøyet for ansettelse av Hacker News.

Dette ser ut til å være etterspurt i skrivende stund:

Reager JS

React ble opprettet av Facebook for å jobbe med Flux-arkitekturen. Det er et JavaScript-bibliotek for å bygge grensesnitt. Den har steget til førsteplassen nylig og overhalet Angular. Så start med Reager. Det er et bra gratis kurs som introduserer React her.

Vinkel 1 og 2

Angular JS ble opprettet av Google og startet virkelig så snart den ble introdusert. Mange selskaper investerte mye i rammeverket, og som du kan se fra grafen ovenfor, er det fortsatt veldig populært. Dessverre følte Google behovet for å omskrive Angular helt når de bygde versjon 2. Så Angular 1 og Angular 2 er nesten som to helt forskjellige rammer. Hvis du vil kalle deg en ekspert på Angular, akkurat nå, må du lære begge deler for å være virkelig omsettelig. Det er sannsynligvis fremdeles et tidsvindu der bare det å vite Angular 1 er nok. Men det vinduet lukkes. Flertallet av Angular-arbeidet vil være i å overføre Angular 1-kodebaser til Angular 2. Code School har et morsomt gratis kurs for Angular 1. For Angular 2, sjekk ut denne gratis videoserien for å lære det grunnleggende.

Ember JS

Det er fortsatt ganske mange jobber for personer med Ember JS-erfaring, men som du ser fra grafen, begynner det å bli flatline. Den har ikke støtte fra en juggernaut som Google eller Facebook bak den, og du vil ha hendene fulle med React og Angular. Likevel, hvis du er nysgjerrig, kan du følge med den offisielle Ember JS-guiden.

Når du har valgt det rammeverket du liker best, og er rimelig kjent med det, kan det være verdt å utforske et tilhørende CSS-rammeverk. De to dominerende aktørene i CSS akkurat nå er Bootstrap og Material Design.

Støvelhempe

Bootstrap ble laget av Twitter og er ganske moden og populær. Det finnes versjoner av Bootstrap for Angular, Angular 2 og React.

Materiale

Materiale er en designretningslinje som er lagt ut av Google som får grep. Det er også Angular og React-versjoner av det. Siden Angular også blir lagt ut av Google, vil du finne at det passer naturlig der.

Her er noen lenker for å komme i gang.

  • Reager Bootstrap
  • Vinkelstøvel
  • Angular 2 Bootstrap
  • Material UI (React)
  • Vinkelmateriale
  • Vinkel 2 Materiale

Gratulerer! Du har nå nøkkelferdighetene som trengs for å være Front End Developer!

Jeg vil være en back-end-utvikler

Utmerket! Det første trinnet er å velge språk. På baksiden er det mange språk som fungerer, alle har sine sterke og svake sider. Ta en titt på følgende grafikk, den rangerer programmeringsspråk når det gjelder popularitet. Disse har alle vært blant topp 10 i et tiår. De i grønt er webspråk som har blitt mer populære gjennom årene.

Språkene i grønt er der du skal fokusere. Hvis du ikke allerede vet noen av disse, kan du starte på toppen og jobbe deg nedover. Stopp når du finner en du liker, og gå dypt!

Hvis du allerede er kjent med et bestemt grønt språk, og du liker det, så fokuser på det.

Java

Java er et ekstremt populært språk og kan kjøre (nesten) hvor som helst. Den ble utviklet av Sun Microsystems (nå eid av Oracle ). Java er språket som brukes til å bygge Android-apper. Den kan også brukes til å bygge desktop-applikasjoner, og selvfølgelig kan den brukes til å bygge webapplikasjoner (enten som en frittstående backend, eller kombinert med JSP). Det er modent, stabilt, og det er massevis av ressurser for å lære Java. Det er også et av de mest lært objektorienterte programmeringsspråkene på høyskoler og universiteter over hele verden. Her er et gratis Java-kurs for nybegynnere, det er ganske bra.

C #

C # er et språk opprettet av Microsoft for å konkurrere direkte med Java. Inntil nylig ble det ikke støttet godt på ikke-Microsoft-systemer, men det endres raskt. I likhet med Java er den objektorientert, og kan brukes til å bygge ikke bare webapplikasjoner (enten som en frittstående backend eller kombinert med ASP.Net), men også for desktop-apper. Hvis du er en Windows-bruker og vil ha et litt mer inneholdt økosystem for å programmere innenfor, kan C # være veien å gå. Ta en titt på dette gratis kurset fra Microsoft Virtual Academy.

Python

Selv om det ikke har et stort navneselskap som Java eller C #, er Python et flott språk for å få ting gjort raskt. Det er relativt enkelt å lære, og det blir mer og mer populært for hvert år. Hvis du ikke elsker de andre, er dette et godt språk å synke tennene i. Det beste stedet å komme i gang er akkurat her.

JavaScript

Hvis du har fulgt med siden begynnelsen, har vi allerede dekket JavaScript. Med fremkomsten av Node JS og populariteten til npm (Node Package Manager), vil JavaScript på serveren bare bli mer populært i årene som kommer. Vel verdt å lære.

Hvis du ikke gjorde det tidligere, er det god tid å lære om Node JS, Express og Mongo DB, fra denne utmerkede, gratis veiledningen og oppfølgeren.

Rubin

Ruby er en merkelig fugl. Folk som elsker det, virkelig, virkelig, elsker det. Det er i topp 10, men det ser ut til å avta veksten. Språket i seg selv er en blanding mellom funksjonell programmering og tvingende programmering. Jeg anbefaler å prøve det ut, kanskje du blir en av de dumme fansen. Det vil være mye Ruby-arbeid i årene som kommer. Men det kan være lurt å dobbeltsjekke oppføringene i ditt område for å sikre at minst noen få selskaper har blitt bitt av Ruby bug.

Det beste stedet å lære Ruby er RubyMonk

Hva med PHP?

Det er mye PHP på markedet, men i det minste ifølge dette datasettet ser det ut til å bli mindre populært. Jeg gjorde det gult fordi jeg tror det akkurat nå er et levedyktig valg å bygge en karriere på. Av hensyn til fullstendig avsløring er jeg heller ikke en fan av PHP, så kanskje noen personlige skjevheter har sneket seg inn her også, men jeg kan ikke forestille meg at de neste 5–10 årene vil PHP være mer verdifull enn JavaScript , selv om det rangerer høyere for øyeblikket, og det vil sannsynligvis fortsatt være jobber der ute for PHP-utviklere.

Jeg har lært mye, men jeg har ingen erfaring fra den virkelige verden.

Det er ekstremt vanskelig å få jobb uten erfaring.

Det første trinnet er å fullføre ett eller to personlige prosjekter, for å få komfortable bygnings ting fra ende til annen.

Når du begynner å bygge personlige prosjekter, er det nyttig å ha en måte å administrere og publisere koden på. For det trenger du GitHub.

GitHub

GitHub er et online kildekodedepot bygd på Git-plattformen. Den lar deg lagre, administrere og publisere koden din. Hvis du er utvikler i dag, MÅ du ha en GitHub-konto. Du kan lære mer om GitHub og hvordan du bruker GitHub fra denne "Hello World" -guiden, og fra denne interaktive veiledningen om bruk av Git-plattformen.

Personlige prosjekter

Nå som du er konfigurert med GitHub, er det et par personlige prosjektideer.

  • Bygg en enkel blogg (her er en opplæring ved bruk av React and Node)
  • Bygg en enkel kalender (her er en veiledning med C # og .Net)

Free Code Camp har også en rekke prosjekter å prøve, inkludert noen bare front-end. Her er to av favorittene mine:

  • Bygg en "pomodoro" -klokke (bare frontend)
  • Administrer en Book Trading Club (full stack-prosjekt)

Ekte opplevelse

Deretter trenger du reell erfaring . Ekte erfaring betyr å gjøre arbeid for noen andre. Personlige prosjekter er nyttige, men de er ikke nok til å gjøre deg konkurransedyktig i arbeidsmarkedet. Det er noen muligheter for å få reell erfaring.

1. Bidra til et open source-prosjekt

Takket være populariteten til GitHub er det millioner av åpen kildekode-prosjekter der ute med åpne problemer (bugs) som bare venter på å bli løst av noen som deg. Å sette på CVen din at du har bidratt til noen populære og kjente open source-prosjekter, er en fin måte å etablere og øke din troverdighet. Den beste ressursen for å finne ut hvilke prosjekter du skal bidra til er Code Triage. Code Triage lar deg velge favorittprosjektet ditt og vil sende deg et annet åpent problem direkte til innboksen din hver dag.

2. Arbeid for en venn eller et familiemedlem

Finn en venn eller et familiemedlem som har en virksomhet og bygg dem en webapp eller et nettsted, eller forbedr den eksisterende. Bare vær sikker på at du velger veldig nøye, du må velge prosjektet i riktig størrelse og riktig familiemedlem slik at du unngår ubehagelige situasjoner på veien. Ideelt sett bør det være et prosjekt du kan fullføre på under 90 dager, og en person du har et veldig ærlig forhold til. Du bør ikke være redd for å innrømme om / når ting ikke går som planlagt, og du bør ikke være redd eller bekymret for å måtte si "nei" eller fortelle dem å "trekke seg tilbake" på visse ønsker eller forventninger. Du bør også være sikker på at hvis noen av dere ender med å kausjonere av en eller annen grunn, vil det ikke skade forholdet ditt permanent.

3. Arbeid for veldedighet / ideelle organisasjoner

En veldig givende måte å få reell erfaring på er å gjøre noe arbeid for ideelle organisasjoner og / eller veldedige organisasjoner. Du kan nærme deg en lokal veldedighet eller ideell organisasjon som du føler sterkt om og tilby å hjelpe. Du kan også bruke nettstedet Catch a Fire for å finne et prosjekt du kan hjelpe med. Til slutt, hvis du følger programmet på Free Code Camp og tjener alle sertifikatene, vil du få tilgang til ideelle prosjekter der du kan utnytte ferdighetene dine.

4. Underholdsarbeid

Min erfaring er at hvis du tar denne ruten og deretter får jobb eller går frilans, vil du helt sikkert se tilbake på den som livsopphold. Nettsteder som Upwork, Fiverr og PeoplePerHour gir deg muligheten til å vinne forretninger, men du må holde prisene veldig lave og godta at du bare gjør dette for opplevelsen.

Jeg har virkelig erfaring, vennligst hjelp meg med å finne jobb.

Regel nr. 1 - Ikke kall deg selv en “webutvikler”

Sjekk ut dette…

Hva pokker er forskjellen mellom en “webutvikler” og en “frontend” -utvikler !? Vel, omtrent 7000 $ / år tilsynelatende. Seriøst, når tiden kommer, kan en enkel endring i det du kaller deg gjøre en stor forskjell.

Ha et sterkt CV

Til tross for alle historiene du leser om folk som gjør ville og sprø ting for å få en arbeidsgivers oppmerksomhet, må du fortsatt ha et godt CV. Denne artikkelen fra Tech Republic vil hjelpe deg med det.

Bygg et porteføljens nettsted

Viktigere enn å ha et godt CV er å ha en sterk porteføljeside. Ta alle de virkelige prosjektene du har gjort, og legg dem på en personlig hjemmeside som viser dem. Denne SitePoint-artikkelen gir noen gode råd om å bygge et porteføljeside. Den ene andre ting jeg vil understreke er at du bør sørge for å synliggjøre hvordan hver av dine prosjekter løst en virksomhet problem for din klient (eller arbeidsgiver). Gjør det, og porteføljesiden din vil stå hode og skuldre over resten.

Forbered deg på kodingsintervjuer

Min forrige artikkel, How to Win the Coding Interview, vil hjelpe deg med det.

Beef opp dine generelle intervju ferdigheter

Du bør være forberedt på mer enn bare kodingsdelen. Dette Life Hacker-stykket er en god veikart for mye verdifull og viktig informasjon.

Bare få foten inn døren

Ikke bekymre deg for å få jobb hos din drømme arbeidsgiver med din drømmelønn med en gang. Bare bekymre deg for å få betalt for å skrive kode en stund. Når du har litt mer erfaring i beltet, kan du begynne å vurdere ditt neste trekk.

Jeg vil bli frilanser.

Å være din egen sjef er en utrolig ting, men det kommer også med massevis av ekstra press og kompleksitet. Den beste kilden til informasjon om frilans som jeg noensinne har sett er DoubleYourFreelancing.com av Brennan Dunn. Han har en serie artikler som vil lede deg gjennom å bli frilanser bedre enn noe jeg noen gang kunne skrive her. Så sjekk dem ut.

Et annet alternativ for frilans, hvis du mener du er veldig god, er å bli med på Toptal. De godtar bare 3% av søkerne, og prosessen deres er notorisk vanskelig, men hvis du kommer inn, har du tilgang til mange godt betalte frilansmuligheter der du kan jobbe eksternt.

Jeg begynte på denne stien, men nå føler jeg meg fast.

Jeg hører deg. Det er ikke lett, og noen som fortalte deg at det skulle være enkelt, har enten aldri gjort det, eller prøver å få penger ut av deg. Hvis du føler deg fast, er det her du kan gjøre:

Gjenoppdag den opprinnelige hensikten

Spør deg selv, og skriv ned hvorfor du startet på denne banen i utgangspunktet. Er svaret ditt fremdeles sant? Hvis ja, hvorfor stoppe nå? La oss gå!

Bli ekte

Nå som du vet mer om hva som egentlig er involvert, og hva som virkelig er mulig, har du en bedre ide om best case scenario, worst case scenario og det mest sannsynlige scenarioet for å fortsette. Skriv det hele ned, se på det, og innsett at det "mest sannsynlige scenariet" er det som sannsynligvis vil skje, og at det sannsynligvis er nærmere "best case" enn "worst case". Du trenger ikke å være redd. Gå fremover. Du kan gjøre det!

Les dette!

Ikke slutte - hver ekspert var en gang nybegynner

Hvis du er som meg, har du på et eller annet tidspunkt i arbeidet med å lære programmering kastet hendene dine og sagt: “Jeg trenger… medium.freecodecamp.com

God koding!

Vennligst ❤ og del

Jeg vil hjelpe flest mulig. Du kan hjelpe meg ved å trykke på det lille grønne ❤ og også ved å dele denne artikkelen på sosiale medier.

Til slutt, ikke glem å ta tak i den utvidede e-bokversjonen av denne artikkelen med alle koblingene i ett lett å følge vedlegg. Klikk nedenfor for å få det.

Gratis guide for å bli webutvikler

Denne fantastiske gratis guiden går trinn for trinn gjennom læringsprosessen for å bli en profesjonell webutvikler freebies.devmastery.com