Vi har byggt en komplett guide för att hjälpa dig att lära dig JavaScript, oavsett om du precis börjat som webbutvecklare eller vill utforska mer avancerade ämnen.
Eller hoppa direkt och titta på våra JavaScript-kurser:
Att lära sig något nytt är läskigt. För mig är det största problemet med att ta upp en ny skicklighet att jag inte vet vad jag inte vet. Med tanke på det är det ofta användbart att hitta en plan för att lära sig vad du är intresserad av. Det är vad detta inlägg är: din plan, din färdplan, din handlingsplan för att lära dig JavaScript! Du behöver inte oroa dig för att hitta de bästa resurserna, sortera ut de dåliga och räkna ut vad du ska lära dig nästa. Det är allt här. Följ bara det, steg för steg.
Och om du vid något tillfälle känner dig fast kan du få hjälp från en av JavaScript-experterna på Envato Studio.
JavaScript är språket i webbläsaren.
Innan du faktiskt börjar lära JavaScript, ta en minut för att förstå vad det är och gör.
JavaScript är inte jQuery, Flash eller Java. Det är ett programmeringsspråk som är separat från alla dessa.
JavaScript är språket i webbläsaren (inte exklusivt idag). Det primära syftet är att lägga till interaktivitet på en annars statisk sida. I webbläsaren kommer det inte att ersätta PHP eller Ruby för dig. Det kommer inte ens att ersätta din HTML eller CSS; du kommer använda den i samband med dem. Det är också inte så hemskt att lära sig som du kanske har tänkt eller hört.
Ytterligare en anmärkning: du har hört talas om jQuery, vilket är förmodligen det mest använda JavaScript-biblioteket. Eller kanske har du hört talas om ett av de andra populära JavaScript-ramarna, som Mootools, YUI, Dojo och andra. Var passar dessa in i bilden? Tänk på dem en samling JavaScript-hjälpprogram. du skriver fortfarande JavaScript när du använder dem, men det är kraftigt abstraherat JavaScript. Det sparar dig massor av arbete.
Du har kanske hört någon säga att du ska börja med jQuery (eller ett annat bibliotek) och lära dig JavaScript efter. Jag är respektfull men ändå starkt oense. Få ett bra handtag på JavaScript först och använd sedan biblioteken. Du förstår vad du gör mycket bättre; och följaktligen skriver du mycket bättre JavaScript.
Codecademy är en relativt ny webbplats som räknar sig som "det enklaste sättet att lära sig hur man kodar.? Du kommer att döma det! För närvarande finns det bara två kurs:? Komma igång med programmering? och? JavaScript snabbstartsguide.? Detta är ett fantastiskt sätt att doppa tårna i JavaScript-poolen. Mycket lik Test Rubys övningar följer du korta lektioner, skriv kod i webbläsaren och tittar på resultaten. Medan du tjänar poäng och låser upp prestationsmärken.
Om du redan är bekant med ett annat programmeringsspråk kan du förmodligen börja med JavaScript-snabbguiden? Om det här är första gången du tar upp programmering (utöver HTML och CSS), hittar du "Komma igång med programmering? kursen oerhört hjälpsamma. Codecademy är gratis, men anmälan krävs.
De som lägger till har en fantastisk uppsättning screencasts speciellt anpassade för nybörjare. Om du vill lära dig JavaScript rätt (och enkelt) sätt, definitivt arbeta tillsammans med dessa lektioner. Visuell träning är alltid ett plus!
"Nivå på dina färdigheter med vår efterfrågan, pragmatisk träningslösning. Ingen registrering krävs. Ingen fångst. Ingen skojar."
När du arbetar genom kurserna vid Codecademy vill du få en mer ingående introduktion till JavaScript - en introduktion som introducerar dig till alla typer, operatörer, kontrollstrukturer och mer.
En handfull bra introduktioner, om jag kan:
När du börjar arbeta med JavaScript i webbläsaren vill du installera Firebug och bli bekant med den. Firebug är ett plugin för Firefox som hjälper dig att bygga och felsöka dina webbsidor: Tänk på det som kirurgens kniv för webbutvecklare. Använd inte Firefox? Gilla Safari eller Chrome bättre? Inga problem: kolla in de inbyggda utvecklingsverktygen, som är mycket lik Firebug.
Du kan öppna utvecklingsverktygspanelen genom att trycka på
Alternativ + Kommando + I
på Mac, ellerKontroll + Skift + I
på datorn.
Du lär dig mycket genom att öppna ditt valfria verktyg och bara klicka runt på en av dina favoritwebbplatser. Här är några resurser som får dig till snabbhet:
Så nu är du bekant med grunderna. Det finns dock mycket mer att lära. Medan jag kunde rekommendera en lista med böcker som skulle gå i konkurs, håller jag den till fyra av de bästa böckerna som du hittar någonstans:
Dessa två är allmänna, djupgående JavaScript-resurser som tar vad du vet från introduktionerna till en mycket djupare nivå. Visst, de kommer att vara överlappande från introduktionerna, men inte mycket: bara tillräckligt för att hålla dig bekväm.
(Obs! När alla dessa böcker finns på Amazon har jag länkat till förlagens webbplatser, så du kan kolla in de tillgängliga kapitalkapslarna).
Medan dessa böcker är bra för att förstå JavaScript-språket och hur man använder det i webbläsaren, finns det mycket mer att lära. Och medan de böckerna går in i några mönster och praktikar, här är två böcker som ägnas åt de ämnen som jag tycker du kommer att hitta användbara.
När du arbetat med resurserna ovan borde du ha följt med kodproverna: dra ihop dem och tweak dem för att se vad som händer. Men nu är det dags att verkligen slå ut på egen hand. Det är dags att faktiskt bygga något.
Så vad kan du bygga? Det finns mycket du kan göra. Här är några idéer.
alt
tagg eller loop genom bilderna om användaren inte har klickat på en i en minut.div
med lite text i den och flera knappar ovanför. En knapp kan justera bredden; en, höjden; och en, bakgrundsfärgen. Nyckeln är att inte få förändringarna att hända omedelbart, men under en sekund. Kom ihåg att Google är din vän, speciellt om du inte har gjort någon animering i JavaScript hittills.Jag är säker på att du kan tänka på andra projekt som kommer att bli bra. Självklart trycker du dig själv ur din komfortzon; det är det enda sättet att lära sig.
Se även till JavaScript-kategorin här på Webuts + för en omfattande lista med handledning, på alla nivåer.
Om du har kommit så långt kommer du säkert att inse att det finns flera saker som är svåra att åstadkomma i en webbläsare (eller alls) i JavaScript. De största brottslingarna är förmodligen saker som överdriven DOM-manipulation, AJAX och animering. Här kommer ett bibliotek.
Som jag nämnde tidigare är poängen med ett JavaScript-bibliotek att socker ner de smärtsamma sakerna. Därför nu makt Var dags att titta på en. Det finns massor att välja mellan, och jag låter dig bestämma vilka experter som ska experimenteras med. Oavsett om det är jQuery eller Mootools, YUI eller Dojo, kommer deras respektive webbplatser att ge dig allt du behöver för att komma igång. Om du känner behovet, prova.
Medan det verkligen finns ett otaligt antal bibliotek tillgängliga, borde du försöka hålla fast vid ett populärt val - åtminstone först.
Släpp vad du gör, och prenumerera / följ dessa utvecklare. Detta är ett krav.
Det finns massor av otroliga JavaScript genier där ute, som alltid gör coola saker som du inte vill missa. Lyckligtvis har vår sömnförbundsredaktör Siddharth avrundat en lista med? 33 utvecklare du måste prenumerera på som en JavaScript Junkie. Släpp vad du gör, och prenumerera / följ dessa utvecklare. Detta är ett krav.
Men du kan göra mer. Denna rättvisa webbplats skickar ofta om JavaScript, så gå inte bort. Titta även på JavaScript Show, en podcast om det senaste och bästa i JavaScript-världen. Du kanske också vill anmäla dig till javascript-nyhetsbrevet.
Envato Market har hundratals populära JavaScript-objekt, från reglage till nyheter, och från kalendrar till kundvagnar.
Så ta en titt på vad som finns där ute. Även om du inte köper någonting kan du se vad andra människor har skapat för att inspirera dig med en känsla av vad som är möjligt med JavaScript.
Ett urval av JavaScript-objekt på Envato MarketTack för att du läser! Förhoppningsvis kan den här planen hjälpa dig att bli en JavaScript-fanatiker. Om du redan är bekant med JavaScript kan du rekommendera andra resurser i kommentarerna?