Velkommen til VS Code og utviklerverktøy! Dette er leksjon 1 av 8. Du kan starte uten konto — fremgangen lagres mens du jobber, og du kan ta en pause når som helst.
Verktøyet du sitter ved hver dag
Hva VS Code er, hva panelene heter — og hvorfor det betyr noe.
Før koden din når nettleseren, tilbringer den tiden hos deg — i editoren. Mesteparten av en utviklers dag går ikke i å skrive ny kode, men i å lese, endre og forstå det som allerede finnes. Denne leksjonen gir deg navnene på alt du ser i VS Code, og et ærlig svar på hvorfor det er verdt å lære.
Editor, ikke et flycockpit
Er VS Code en editor eller et IDE? En editor redigerer tekst. Et IDE («integrert utviklingsmiljø») prøver å ha alt innebygd: kjøring, feilsøk, profiler, databaser — og veier ofte like mye. Sannheten om VS Code ligger i midten: det starter som en rask editor, og du bygger IDE-en selv ved å legge til det du trenger — og bare det. Det er hele grepet denne leksjonen bygger videre på: verktøyet skal passe deg, ikke omvendt.
Obs
Ingen kjøreknapp i dette kurset
Skolens arbeidsområde kan kjøre web- og JavaScript-kode i nettleseren — ikke et skrivebordsprogram som VS Code. Derfor finner du ingen «Prøv koden»-felt i dette kurset: praktiseringen skjer i din egen editor, og leksjonene forteller deg med ord hva du skal se. Sluttestens spørsmål kan du likevel svare på herfra.
Fire områder du bør kunne navngi
VS Code-vinduet består av fire faste områder. Veiledninger, kollegaer og feilmeldinger viser til dem hele tiden, så lær navnene først — det er forkortelsen for alt annet:
- Sidefeltet til venstre: filutforsker, søk, kildekodekontroll og utvidelser — ett ikon per verktøy.
- Redigeringsområdet i midten: filene dine, i faner. Kan deles i flere kolonner om du vil ha to filer ved siden av hverandre.
- Panelet nederst: terminal, problemer og utdata — utskriften fra verktøyene dine bor her.
- Statuslinjen helt nederst: hvilken git-gren du står i, antall feil og advarsler, språk og innrykk.
+----------+---------------------------+| | Redigeringsområde || Sidefelt | faner, koden din || +---------------------------+| | Panelet: terminal, || | problemer, utdata |+----------+---------------------------+| Statuslinje: gren, feil, språk |+--------------------------------------+Og så det femte, som ikke har noe fast hjørne: kommandopaletten. Den flyter opp over alt og kan kjøre nesten enhver kommando i VS Code — du møter den ordentlig i neste leksjon. Åpne den nå med Ctrl/Cmd+Shift+P og skriv et ord, for eksempel «terminal». Det er også en trygg måte å kjenne igjen de fire områdene på: hver kommando er oppkalt etter der den hører hjemme.
Hvorfor dette lønner seg
Det ærlige regnestykket: nettleseren viser ferdig arbeid, mens editoren er der arbeidet skjer. Lesing, søk, små endringer, git, terminal og feilsøk — alt huser her. Hver gang du lærer et hjørne av verktøyet bedre, betales det tilbake hver eneste dag du jobber. Det er avkastning på en liten investering, og den kommer tidligere enn du tror.
Tips
Navnene er nøklene til alt annet
Når en veiledning sier «åpne panelet» eller «se på statuslinjen», vet du hva som menes — uten å gjette deg frem. De fire navnene er også alt du trenger for å følge resten av kurset.
Du kan nå
- navngi de fire områdene i VS Code-vinduet: sidefelt, redigeringsområde, panel og statuslinje
- åpne kommandopaletten med Ctrl/Cmd+Shift+P og finne en kommando ved å søke
- forklare hvorfor mestring av editoren lønner seg — det er der tiden faktisk går