Webbutveckling kan ofta vara en fullständigt förvirrande affär. Idag, riktad mot nybörjare, skulle jag vilja presentera dig för tjugosju koncept eller tekniker, varje kartläggning till ett bokstav i alfabetet. Låter wonky? Det är förmodligen! Låt oss komma igång efter hoppet.
Publicerad handledningVarje par veckor besöker vi några av våra läsares favoritinlägg från hela webbplatsens historia. Denna handledning publicerades först i mars 2011.
AJAX står för asynkron JavaScript och XML och är den viktigaste drivkraften bakom alla dessa superlösa webbapplikationer du har använt de senaste åren.
AJAX, som en teknik, har varit ganska mycket allomfattande. Gmail? Kontrollera. Flickr? Kontrollera. eBay? Kontrollera. Du kan även hitta den i WordPress administrationspanel. Så vad gör det exakt och hur gör det det?
I centrum av allt är XMLHttpRequest som tillåter att samtal skickas och tas emot, efter en sida har gjorts fullständigt utan att röra resten av sidan. Detta innebär i huvudsak att en webbapplikation inte behöver gå igenom en fullständig siduppdatering för varje åtgärd. Detta ger i sin tur en mycket mjukare, mycket fördjupande skrivbord som användarupplevelse.
Relaterad läsning
En webbläsare är den diskreta strukturen där du ramar dina magnifika mästerverk, vare sig det är webbplatser eller applikationer. De är inte begränsade till att hämta webbplatser ändå - moderna webbläsare är ganska multitasking djur. Min installation, till exempel, tappar till IRC, FTPs i mina utvecklingsservrar och synkroniserar mina referenser över alla enheter jag använder.
Som du kanske har antydit, är webbläsare samtidigt orsaken till mycket jubel och raseri mot den moderna webbutvecklaren - de är ovärderliga verktyg och irriterande djur. Varje utvecklare som måste se till att hans arbete måste se ut perfekt i varje webbläsaren kommer att känna smärtan.
Relaterad läsning
CSS är en ledstång i framkantutvecklingstridenten. CSS, som står för Cascading Style Sheets, är det språk som du definierar hur en sida visas - dess presentation, om du vill.
Under webbutvecklingens skräckdagar vägrade utvecklarna ofta presentationskoden i sin källa. CSS, bland andra tekniker, lindrade detta kraftigt genom att tillhandahålla en metod för att splittra presentationen från innehållet.
Relaterad läsning
DOM, en förkortning av Document Object Model, är den accepterade konventionen för att interagera med HTML [eller XML] -dokument. DOM API ger ett sätt att kryssa och manipulera ett dokument programmatiskt.
DOM skapar en hierarki som matchar strukturen för det analyserade HTML-dokumentet. Barnen heter noder eller DOM-noder.
Om du hör någon som pratar om DOM är chansen att de pratar om DOM-skript. Detta är termen som används för att beskriva programmatiskt åtkomst till och manipulering av DOM via JavaScript. Detta är tekniken bakom de flesta moderna webbplatser och applikationer som du ser idag.
Relaterad läsning
Moderna webbapplikationer är djupt händelsedrivna affärer. Men vad är en händelse? De flesta saker du gör på en webbsida utgör en händelse. Den spökiga svävaren över en rolig men möjligen NSFW-länk, klicka på en knapp, tryck på fliken för att flytta till nästa textfält är alla giltiga händelser.
Händelsehantering hänvisar till processen där vi bifogar en specifik bit av kod som ska köras när en viss händelse avfyras. Återigen är detta ett av de grundläggande begreppen bakom modern webbutveckling som du behöver behärska.
Relaterad läsning
Någon hantverkare behöver sina verktyg för att fungera effektivt. Webbutvecklare är inte avvikande från denna regel. Ett av de mest robusta verktygen är Firebug.
Firebug är en Firefox-förlängning som galvaniserar ditt arbetsflöde. Det låter dig redigera och övervaka en sidas alla aspekter i flygningen. Jag kan inte förklara alla funktioner som den ger, så se till att klicka på länkarna nedan.
Relaterad läsning
Grids är de visuella ramarna på vilka sidor är strukturerad. Överfört från den en gång växande utskriftsindustrin är nätet en viktig del av det moderna webbutvecklingsarbetet.
Det finns ett antal CSS-ramar som tillgodoser exakt detta behov, eftersom en gridbaserad layout, för ett icke trivialt antal sidor och layouter, kan vara en övning i masochism.
Relaterad läsning
Om du läser detta idag har du förmodligen redan en vag idé om vad det här är. Om du blev lurad i den här länken, läs vidare. Förresten, välkommen till Nettuts! Vi skriver om webbutveckling, cookies och Justin Bieber.
HTML står för HyperText Markup Language, webben defacto markup-språk - det är till webbsidor som tegelstenar är hemma. HTML består av flera komponenter eller element - taggar, tagattribut och innehållet som bifogas taggarna.
Den senaste versionen av HTML-standarden, HTML5, ligger nu på oss med ett antal nya funktioner som effektiviserar arbetsflödet och fastställer några inkompatibiliteter.
Relaterad läsning
Ahh, Internet Explorer. Namnet framkallar både vördnad och ilska. En gång en hjälte som frambringade imponerande nya funktioner på marknaden, släppte den ena sidan industrin framåt, det slog också bollen genom att låta webbläsaren stagnera. Till dags dato är det också den främsta orsaken till alopeci i framändarna utvecklare. Efter ett årtionde av misshandel är den senaste versionen av Internet Explorer 9, återigen på rätt väg mot innovation.
Oavsett din inställning till Internet Explorer är det en inbyggd och oupplöslig del av webbutvecklingsprocessen.
Relaterad läsning
JavaScript är den slutliga medlemmen av den väsentliga webbutvecklingstrioen. JavaScript, som inte är Java, är webbsspråksspråket. Dess användning i miljarder webbsidor och, ännu viktigare, webbplatser stakes som hävdar. Du definierar beteende via JavaScript - hanterar händelser, manipulerar DOM och pratar med servern.
Tack vare det otroliga adoptionen av bibliotek, som jQuery, har medvetenhet och kunskap om JavaScript ökat varje år, år efter år. Jag tycker att det är lämpligt att säga att JavaScript är ett absolut måste för alla moderna webbutvecklare.
Relaterad läsning
SEO gäller endast tangentiellt för webbutveckling men även då är det viktigt för en webbutvecklare att ha grundläggande kunskaper om vad SEO är och vad det gör.
Nyckelordoptimering avser processen att välja rätt nyckelord för din webbplats och sedan optimera dem så att publiken kan hitta din webbplats. Medan du dabbling med alla principer om SEO, kom ihåg det här: Innehållet är kung. Om du har dåligt innehåll med utmärkt SEO kommer användarna att hitta dig men lämna snart efter. Om du har bra innehåll kommer användarna att hitta dig och stanna.
Relaterad läsning
Mindre är ett stylesheet språk med några ess upp sina ärmar. Deras webbplats säger att MINDRE utökar CSS med dynamiskt beteende som variabler, mixins, operationer och funktioner och jag är benägen att hålla med.
MINDRE är CSS på anabola steroider. Ja, det lät bättre i mitt huvud men du vet vad det betyder. Det ger konceptet ett dynamiskt språk till CSS vilket gör humongous stylesheets mycket enklare att hantera.
Relaterad läsning
Model View Controller mönstret, mer känt som MVC, är en av de mest använda i webbutvecklingsvärlden. Det är ett arkitektoniskt mönster som skiljer varje del av en webbapplikation till logiska bitar för bättre underhåll - modeller hanterar data, visningar hanterar presentationen medan regulatorn samordnar informationsflödet mellan de två.
Om du har använt en modern webbutvecklingsram har du använt MVC. Ruby on Rails, Code Igniter och Zend Framework använder alla detta mönster.
Relaterad läsning
Node.JS inledde en ny era av webbutveckling. Det gör det möjligt att köra JavaScript på en otroligt snabb VM [V8]. Konsekvenserna av ett sådant paradigmskifte kan inte vara omedelbart uppenbart, men en timme eller så med det kommer att göra det klart som dag.
Otroligt snabb samt förmågan att hantera tusentals samtidiga IO-händelser är de viktigaste samtalspunkterna tillsammans med den nästan universella JavaScript-utvecklarens användarbas.
Relaterad läsning
Objektorienterad programmering har i stor utsträckning antagits av programmeringsgemenskapen för den flexibilitet som den tar med sig till bordet. Med OOP kan du skriva några rader kod, göra det mer DRYer och därmed mycket lättare att underhålla.
Men vad exakt är ett föremål? Det är ganska svårt att förklara det i en enda semantiskt självständig mening så var noga med att slå på länkarna nedan!
Relaterad läsning
PHP är otvivelaktigt det mest populära serverns sidspråket - det står för miljoner, eventuellt miljarder, av webbsidor och applikationer.
Även inför ett antal nyare, utan tvekan bättre alternativ för att skriva webbapplikationer, har PHP inte bara överlevt utan blomstrat. WordPress, Joomla, Drupal, MediaWiki använder alla PHP bakom kulisserna. En av de främsta orsakerna är enkel implementering och den relativa lättnad som du kan hitta värdar som stöder PHP.
Relaterad läsning
En fråga, i vårt sammanhang, kan hänvisa till ett antal saker. Ett fråge språk används för att koppla samman med externa system för att få information. SQL är ett bra exempel som används för att få information från relationsdatabaser.
En frågesträng å andra sidan är bitar av information som skickas till webbapplikation som en del av webbadressen. Den här informationen kanske är allt från sidan som användaren försöker få åtkomst till auktorisations-ID för en transaktion. Query-strängar formateras som nyckelvärdespar.
Relaterad läsning
Regelbundna uttryck ger ett flexibelt sätt att matcha textsträngar med specifika mönster. Det är skrivet i ett specifikt språk som tolkas av en parser. Alla moderna språk levereras med regelbundet uttryckssupport.
Relaterad läsning
Källkontroll är en term som förekommer i hela utvecklingssamhället, oavsett vilken aspekt de är inriktade på - programmerare som arbetar med allt från blotta metall till molnberäkning använder källkontroll.
Men vad är det? Enkelt uttryckt tillåter källkontroll att ett team utvecklare arbetar på samma delmängd av filer med ändringar som gjorts av varje medlem som kan spåras och identifieras. Varje version av kodbasen kan jämföras, slås samman eller till och med återställas.
Relaterad läsning
Återigen, en av de gemensamma elementen bland nästan alla utvecklare. TDD står för testdriven utveckling och hänvisar till processen där kod och automatiserade tester för att testa den koden skrivs nära samtidigt. Detta tar bort mycket av tråkigheten i mjukvarutestning och därmed uppmuntrar utvecklare att testa oftare.
Relaterad läsning
Enhetstestning är en delmängd av TFF där små enheter i källkoden testas för att säkerställa att de är redo för produktion. Medan en enhet ofta refererar till en metod i OOP, hänvisar det i allmänhet till den minsta delen av en applikation som kan testas oberoende.
Relaterad läsning
Vim är en djupt polariserande textredigerare som den sköna höftnätredaktören Jeffrey Way använder. Vim är gratis, öppen källkod och mycket funktionen packad. På flipsidan är inlärningskurvan nästan oacceptabelt brant och utan de rätta resurserna kommer du att gå vilse under en lång tid. Klicka på länkarna nedan för att se om det är värt att växeln.
Relaterad läsning
Redaktörens anmärkning: Nettuts + -teamet kan inte bekräfta eller neka att Nettuts + -redigeraren är ... "höft".
WordPress började som ett minimalt bloggningssystem men i sitt nuvarande tillstånd är det imponerande. Det är utökat till den punkt som det används som allt från ett CMS till ett e-handelssystem till allt däremellan.
Det har också en nästan kult grupp av anhängare som består av både utvecklare och designers som svär på plattformen, vilket gör det till en pålitlig plattform för att basera din kommande webbplats.
Relaterad läsning
XSS står för cross-site scripting. Det är ett av ett antal möjliga säkerhetsrobotar du kan möta när du skapar en webbapplikation.
XSS avser åtgärden att ladda den sårbara webbplatsen eller applikationen med skadliga skript för att få förhöjda behörigheter eller känslig information, ofta båda.
Relaterad läsning
Yahoo användargränssnitt biblioteket är ett JavaScript-bibliotek som förenklar processen att skapa interaktiva webbapplikationer. Liksom de flesta moderna bibliotek ger det stöd för DOM-manipulation och AJAX ur lådan.
Medan inte så känt som jQuery, har YUI fortfarande en icke trivial användarbas. och är aktivt utvecklad.
Relaterad läsning
Z-Index är en CSS-egenskap som definierar hur ett element staplas på en sida - det definierar hur nära ett element är överst i visningsporten. Ett högre antal betyder att det kommer att visas ovanpå element med lägre nummer.
Medan den här egenskapen kan vara relativt specialiserad, kommer detta till spel nästan när du bygger widgets eller mer komplicerade webbdesigner.
Relaterad läsning
Och vi är klara. Jag hoppas att du hade så mycket att läsa detta som jag hade lagt på det här tillsammans. Tack så mycket för att läsa!