Kommandoraden för webbdesign Ta tag i grunderna

Det finns bara några saker du behöver för att göra dig redo för alla de coola webbdesignen du kan göra med kommandoraden. Många generiska introduktioner till kommandoraden kommer att fokusera på saker som att skapa mappar, flytta filer runt, navigera på ditt system och så vidare. Jag finner att med en webbdesign fokus använder jag sällan någonsin dessa typer av kommandon.

När jag började lära mig kommandoraden så stötte jag också på många tutorials som ofta hoppade rakt in i instruktioner som "Type blahdee blah blah i din terminal" eller "Kör kommandot bloop beep boop." Detta lämnar vanligtvis någon helt ny till kommandoraden säger , "Håll dig en minut, vad är min terminal, var hittar jag den, hur öppnar jag den och hur använder jag den?"

I denna handledning kommer vi att se till att du inte har samma problem. Vi ska börja i början. Du kommer att lära dig alla väsentligheter för att arbeta med en terminal eller kommandotolk, inklusive hur man öppnar det, hur man kör kommandon, hur man repeterar kommandon, hur man riktar in din projektmapp när man kör kommandon och hur man hanterar det vanligaste felet meddelande du kommer att se.

Denna serie kommer att ge de specifika steg som behövs för både Mac och Windows-ledsen Linux-killar. Men jag gissar att bara genom att vara en Linux-användare har du förmodligen redan en viss förtrogenhet med kommandoraden. Förutom att det är ett "nix-system" är de flesta Mac-kommandon identiska på Linux så att du borde vara bra att följa med i alla fall.

En anteckning om GUI Apps

Jag vet vad du kanske tänker, och ja det är möjligt att använda GUI-appar för att hantera några av dessa typer av processer. Jag gör det ofta själv. Dock är GUIs utformade för alla av nödvändighet a en storlek passar alla lösning, så om du tycker att du vill göra något som en app inte innehåller, är du fast.

När du har följt handledningarna i denna serie har du kunskapen att kunna rulla dina egna kommandoradsstyrda projekt, när som helst och på något sätt behöver du dem.

Vad är kommandoraden?

I ett nötskal ger kommandoraden dig ett sätt att hoppa över att arbeta med ett visuellt gränssnitt så att du kan få dina krokar djupare i hur sakerna bearbetas och har större kontroll.

För att ge dig lite bakgrund, när datorer först kom fram på scenen var det enda sättet du kunde interagera med dem via skrivna kommandon behandlade av kommandoradsgränssnitt (CLI). Så småningom kom grafiska användargränssnitt (GUI) fram som gav upphov till den visuella "point & click" -interaktionen som vi brukar använda i operativsystem och programvara idag.

I världen av webbdesign har saker utvecklats i andra riktningen. Till att börja med var nästan alla våra verktyg GUI-baserade program. Bara i relativt senaste tider har CLI-baserade lösningar för webbdesign problem blivit tillräckligt tillgängliga för att utbetalningen gör det bra och värt att lära sig använda dem.

Det första att förstå om kommandoraden är att för att kunna använda det behöver du ett specialiserat program för att skriva in dina kommandon i. 

Det finns flera olika alternativ, men i denna serie använder vi bara standardprogrammen som skickas med Mac och Windows. På Mac används det program som används för att arbeta med kommandoraden "Terminal" och i Windows kallas det "Command Prompt".

Så här öppnar du en terminal / kommandotolk

Att hitta och köra terminalen / kommandotolken är inte direkt uppenbar om du aldrig har använt det förut. Så här gör du på Mac och Windows.

På Mac

På Mac är det enklaste sättet att öppna en terminal bara att gå till din Launchpad och söka efter Terminal där.

Terminalen på Mac ser ut så här:

När du har kört, stift den suggen till din brygga. Lita på mig, du kommer att vilja ha det där.

På Windows

I Windows-utgåvan görs kommandoraden via Command Prompt

På Windows 8: Gå till startskärmen Apps, och under Windows-system välja Command Prompt.

Tryck alternativt Windows nyckel plus R för att öppna ett körfönster. I fältet märkt Öppna typ cmd och klicka på ok knappen för att starta kommandotolken.

Kommandotolken på Windows ser ut så här:

Snabbanmälan: För korthet, istället för att säga "terminal / kommandorad" i hela serien använder jag bara ordet "terminal" hädanefter, om inte vi hänvisar till specifika instruktioner från Windows.

Running och Repeating Commands

För att köra ett kommando, vänta tills du ser en fråga. På Mac kan du känna igen prompten av $ underteckna det slutar med, och i Windows slutar det med a > skylt:

Fråga på Mac TerminalFråga på Windows Command Prompt

När du ser en prompning kan du skriva in ditt kommando och tryck sedan på enter för att köra det:

En super praktisk sak att veta är att om du vill repetera ett kommando kan du trycka uppåt och / eller nedåtpil på tangentbordet för att bläddra igenom tidigare inkomna kommandon.

Du kommer att finna att det ofta finns kommandon som du vill springa mer än en gång, och att kunna bara peka uppåt och tryck sedan på stiga på är mycket snabbare än retyping kommandon.

Öppnar en terminal i en specifik mapp

För de flesta av webbdesignerna som du utför med kommandoraden behöver du din terminal för att peka på mappen som hyser ditt projekt. 

Din terminal visar namnet på den mapp du arbetar för närvarande i:

Det går att navigera runt din dator med hjälp av CD kommando, kort för "byta katalog". Du kommer dock troligen att hitta det mycket enklare om du bara kan högerklicka inuti din projektmapp och öppna en terminal därifrån redan pekad på rätt plats.

Jag gör det personligen hela tiden, även om du använder kommandot "cd" förmodligen skulle bli snabbare, eftersom min designer hjärna föredrar att arbeta så här. Så här kan du göra det på varje operativsystem.

På Mac

Jag använder en app som heter XtraFinder (gratis, och har en massa riktigt hjälpsamma funktioner) som låter dig lägga till en Ny terminal här alternativet till snabbmenyn i Finder.

På Windows

Håll ner Flytta och högerklicka i din projektmapp. I snabbmenyn bör du se en alternativläsning Öppna kommandofönster här.

På Windows är det alltid hur jag öppnar en kommandotolk, eftersom jag tycker att det är det enklaste sättet.

EACCES Du har inte tillåtelse? sudo.

En av de saker du kan hitta dig själv att köra in ofta på Mac är en sort eller ett annat av ett felmeddelande som innehåller bokstäverna EACCES.

Det kommer ofta att åtföljas av något som "Vänligen försök att köra kommandot igen som root / Administrator."

Om eller när du ser detta betyder det bara att du försöker slutföra en uppgift som kräver förhöjda behörigheter. Detta system är på plats för att försäkra dig om att ingen kan göra betydande ändringar på din maskin utan tillstånd.

Det enklaste sättet att verifiera att du verkligen är auktoriserad är att lägga till ordet sudo till början av ditt kommando, vilket är kort för "super användare göra".

Du kommer då att bli ombedd att ange ditt lösenord innan du kan fortsätta.

När du lägger till sudo till ett kommando du fungerar som "super användare" av systemet istället för en vanlig gammal användare. Med dessa förhöjda privilegier bör du hitta det kommando du försöker köra fungerar bra.

Alternativ till sudo

Du bör vara medveten om att det i allmänhet finns andra sätt än sudo för att komma runt fel på åtkomstnivå, till exempel ändra hur behörigheter är inställda på din maskin. De steg som vanligtvis krävs för dessa typer av processer ligger dock lite över den grundläggande nivå vi täcker här. 

Du kommer att vara bra att använda sudo i sammanhanget kommer vi att täcka i denna serie. Med det sagt, när du är mer bekväm med kommandoraden kanske du vill söka efter de andra alternativen.

Här är en process för bokmärke för senare fastställande av NPM-behörigheter, vars relevans kommer att bli tydlig i en senare handledning.

Hur sudo Användning kommer att anges i denna serie

Var du än behöver använda sudo I ett kommando skriver jag kommandot ut så här:

[sudo] kommandot här

Det betyder inte att du bokstavligen ska skriva ut [Sudo] med torget parentes ingår, men snarare att du kanske eller inte behöver använda sudo, d.v.s..

sudo kommandot här

eller

kommandot här

Om du är osäker kan du alltid prova kommandot utan sudo och försök igen med det, om du ser en EACCES fel.

I nästa handledning

I nästa handledning hoppar vi direkt in i tekniker som du kan använda för att arbeta i dina befintliga arbetsflöden för webbdesign, genom att gå igenom hur man använder kommandoraden för tredjeparts pakethantering.

Du lär dig hur du kommer igång med två av de mest populära pakethanteringssystemen på webben idag, och hur du använder dem för att hitta, installera och uppdatera paket för användning i dina projekt.

vi ses där!