Visual Studio Code: Et Utviklingsmiljø med Utvidelsesmuligheter
Visual Studio Code, ofte forkortet til VS Code, er en svært populær kildekoderedigerer blant utviklere. For å optimalisere effektiviteten i dine programvareutviklingsprosjekter, kan du dra nytte av de fremragende VS Code-utvidelsene som presenteres i denne artikkelen.
VS Code tilbyr en utmerket brukeropplevelse allerede fra start, når du begynner å redigere kode for programvare eller nettsider. Likevel, som utvikler, kan du alltid ha behov for ytterligere funksjonalitet i denne nesten fullverdige kodeeditoren, som nærmer seg et integrert utviklingsmiljø (IDE).
VS Code Marketplace er din destinasjon for alle typer utvidelser til VS IDE. Fortsett å lese for å oppdage de beste VS IDE-utvidelsene som kan være til nytte for dine webapp- eller Windows-apputviklingsprosjekter.
Populariteten til Visual Studio Code
Ifølge statistikk fra WakaTime har utviklere brukt VS Code-editoren i over 21 millioner timer. Det rangerte som den foretrukne koderedigereren i 2021, når man sammenligner antall timer brukt til koding i andre verktøy som IntelliJ (over 3 millioner timer) og PhpStorm (over 2 millioner timer).
Her er noen av årsakene til at flertallet av utviklere velger VS Code fremfor andre kildekoderedigerere:
#1. Den er helt gratis, åpen kildekode, og støtter flere plattformer. Dette innebærer at den fungerer sømløst på Linux, Windows og macOS.
#2. Redigeringsverktøyet har en integrert feilsøkingsfunksjon. Dette reduserer behovet for unødvendige klikk. I tillegg kan du enkelt holde oversikt over både kode og feilsøking i ett enkelt vindu, uten å måtte veksle mellom applikasjoner.
#3. VS Code leveres med IntelliSense, en funksjon for prediktiv koding, som standard.
#4. Med de riktige hurtigtastene, VS Code-utvidelsene og innstillingene, kan du enkelt transformere VS Code til en komplett arbeidsstasjon.
Hva er Visual Studio IDE-utvidelser?
VS Code er en velorganisert kildekoderedigerer som støtter sentrale aspekter av programvare- og apputvikling, slik som versjonskontroll, feilsøking og oppgaveutførelse. Den gir utviklere en effektiv plattform for en problemfri kode-bygg-feilsøkingsprosess for de fleste programmeringsspråk. Likevel kan et IDE, som Visual Studio, være nødvendig for mer komplekse arbeidsflyter.
For å bøte på manglene, har utviklere laget VS Code-utvidelser. Disse utvidelsene er ganske enkelt tillegg som installeres i VS Code, og som introduserer nye funksjoner. VS IDE-utvidelser forbedrer hovedsakelig produktiviteten og bidrar til enklere og mer feilfri koding.
Hvorfor er IDE-utvidelser nyttige?
Først og fremst kan VS Code-utvidelser brukes for å forbedre brukervennligheten for diverse programvare- og apputviklingsprosjekter. Hvis prosjektet ditt krever en spesifikk funksjonalitet som ikke er inkludert i VS Code, kan du søke etter en egnet utvidelse i markedsplassen.
Videre hjelper utvidelser med å øke produktiviteten til utviklingsteamet. Ved å bruke utvidelser for kodekomplettering kan du forebygge unødvendige feil under kodeutviklingen.
Det finnes også avanserte installasjonsprogrammer for utvidelsespakker som forenkler import av repos for DevOps-prosjekter fra pakkevertstjenester. Kort fortalt gir utvidelser deg mulighet til å transformere VS Code til et fullverdig IDE.
La oss nå utforske noen av de mest nyttige VS Code-utvidelsene.
Innstillingssynkronisering
Sjekk ut Innstillingssynkronisering VS IDE-utvidelsen fra Visual Studio-markedsplassen hvis du har behov for å synkronisere utdrag, innstillinger, temaer, snarveier, filikoner og arbeidsområder på tvers av ulike maskiner i løpet av utviklingsprosjektet. Utvidelsen bruker GitHub Gists.
Noen av de mest nyttige funksjonene inkluderer:
- Mulighet for bruk av eksisterende GitHub-konto Gist og tokens.
- Automatisk nedlasting av de siste endringene i innstillingene.
- Automatisk opplasting av innstillinger når en fil endres.
Denne utvidelsen har allerede blitt installert over 3 millioner ganger. I tillegg er den kostnadsfri for alle typer utviklingsarbeid. Hvis du ønsker å støtte utviklerne av dette verktøyet, finnes det muligheter for det.
Live Server
Dersom du jobber med utvikling av nettsteder i VS Code og ønsker å visualisere fremgangen i arbeidet ditt, kan du bruke Live Server. Dette verktøyet setter opp en lokal og midlertidig server for nettstedet du utvikler. Du kan visualisere både dynamiske og statiske nettsider ved hjelp av denne utvidelsen.
Fremtredende funksjoner inkluderer:
- En live og oppdaterbar nettleserbasert webserver for visualisering av nettstedet.
- Brukere kan enkelt stoppe eller starte serveren med et enkelt klikk fra statuslinjen.
- Kompatibilitet med Chrome Debugging Attaching.
Verktøyet er fritt tilgjengelig og har passert 23 millioner installasjoner.
Visual Studio Code Remote – SSH
Remote – SSH-tillegget for VS Code gjør det mulig å bruke en hvilken som helst ekstern PC med en SSH-server som ditt IDE. Dette kan forbedre feilsøking og utvikling betraktelig i ulike situasjoner. Viktige funksjoner inkluderer:
- Utvikle apper og programvare på en kraftig ekstern arbeidsstasjon ved å få tilgang til den fra din lokale maskin.
- Bytt enkelt mellom forskjellige utviklingsmiljøer uten å påvirke ytelsen til den lokale datamaskinen.
- Samarbeid om et eksisterende IDE fra flere eksterne maskiner.
En stor fordel er at du slipper å distribuere kildekoden på den lokale arbeidsstasjonen. Tillegget kjører kommandoer og andre VS IDE-utvidelser direkte på den eksterne datamaskinen.
Prettier – Kodeformaterer
Hvis du ønsker å implementere en enhetlig stilguide for alle utviklingsprosjekter i teamet, bør du prøve Prettier-tillegget for VS Code. Her er noen av funksjonene som er verdt å nevne:
- En meningsfull utvidelse for kodeformatering.
- Integrerer med en rekke koderedigerere.
- Fjerner behovet for stildiskusjoner.
- Sparer tid og krefter.
Som utvikler kan du noen ganger måtte håndtere en kodebase med ujevnheter. Denne utvidelsen i VS Code gjør det enkelt å rydde opp og formatere eksisterende kodebaser.
npm
Hvis du arbeider med JavaScript-prosjekter, er npm et viktig verktøy for pakkehåndtering. Nå kan du dra nytte av npm-støtte direkte i VS Code, akkurat som i andre IDE-er.
Noen av de innebygde kommandoene er:
- Henter frem det sist brukte npm-skriptet etter installasjon av utvidelsen.
- Kjør et npm-skript.
- Avslutter alle aktive skript.
- Kjør npm-installasjon.
Dette er en Microsoft-utviklet VS Code-utvidelse som har blitt installert over 5 millioner ganger.
Prosjektbehandling
Hvis du er prosjektleder innen programvareutvikling og har ansvaret for flere DevOps-prosjekter i VS Code, er det verdt å vurdere Prosjektbehandling. Dette verktøyet gir deg tilgang til alle prosjektene dine fra ett enkelt sted, uavhengig av hvor de er plassert.
Det er mulig å definere prosjekter for å organisere dem på enklere måte. Her er noen av hovedfunksjonene:
- Lagre mapper eller arbeidsområder som prosjekter.
- Merk prosjektene dine for bedre organisasjon.
- Åpne alle prosjekter i samme eller nye vindu.
- Enkel identifisering av omdøpte eller slettede prosjekter.
Denne utvidelsen har også blitt installert over 2 millioner ganger.
SonarLint
SonarLint er en åpen kildekode Visual Studio-utvidelse som hjelper deg med å rette kodefeil før de oppstår. Tillegget fremhever potensielle sikkerhetssårbarheter og feil i koden din i sanntid i VS Code. Grensesnittet er intuitivt og fungerer på samme måte som en stavekontroll i et tekstbehandlingsprogram.
Verktøyet gir også klare instruksjoner for å rette opp feil. På denne måten kan du utbedre koden før den overføres til produksjon. I tillegg støtter VS Code-utvidelsen analyser for forskjellige programmeringsspråk, inkludert C++, C, Java, HTML, PHP, JavaScript, TypeScript og Python.
Stylelint
Leter du etter et automatisk verktøy som kan identifisere kodefeil, stilistiske problemer og andre tvilsomme konstruksjoner i VS Code? Da kan du prøve Stylelint, en linter-utvidelse som er enkel å installere for VS Code. Den hjelper også utviklingsteamet ditt med å overholde forhåndsgodkjente stildirektiver, for å sikre at programvare- eller appkoden er ren og konsekvent.
Noen bemerkelsesverdige funksjoner:
- Plugin-støtte for egendefinerte regelsett.
- Mer enn 170 innebygde regler for moderne CSS-funksjoner og syntakser.
- Automatisk retting av kodefeil når den gjenkjenner et mønster.
VS Marketplace viser 700 000 installasjoner for dette tillegget.
CSS-Peek
Ønsker du å slippe å bytte til .css-filen for å inspisere egenskaper som er knyttet til en id eller klasse? Da bør du prøve utvidelsen CSS-Peek for VS Code. Den gir deg muligheten til å se CSS-koden som en hover-visning direkte i HTML-filen.
Utvidelsen konverterer også ID-er og klassenavn til hyperlenker. Ved å klikke på disse hyperlenkene får du øyeblikkelig tilgang til ID-definisjonen og klassen i CSS-koden.
Dette tillegget har passert 3 millioner installasjoner og er gratis å installere i VS Code.
Polacode
Polacode er et tillegg for VS Code som gir deg mulighet til raskt å lage pene skjermbilder av programvare- eller appkoden din. Deretter kan du dele dette resultatet med samarbeidspartnere, venner eller kunder. En viktig fordel er at den beholder alle de eksisterende VS Code-temaene og kodefontene. Tillegget setter bare koden inn i en pen, profesjonell layout.
Utvidelsen tilbyr en dra-funksjon for å endre størrelsen på beholderen eller kodebiten. Du trenger bare å holde og dra i det nedre høyre hjørnet. Andre kommandoer som kan brukes til å justere utseendet på bildet inkluderer polacode.shadow, polacode.target, og polacode.backgroundColor.
GitLens — VS Code-utvidelse
GitLens, en gratis VS Code-utvidelse, gir utviklere en bedre forståelse av koden. Du kan raskt se hvorfor, når og hvem som har gjort endringer i en spesifikk kodeblokk eller linje.
I tillegg kan du gå gjennom kodehistorikk for å få innsikt i hvorfor og hvordan en bestemt kodebit har utviklet seg. Dette gir prosjektledere muligheten til å utforske utviklingen og historikken til en kodebase på en enkel måte.
Utvidelsen er også tilgjengelig som GitLens+. Den tilbyr to abonnementsalternativer. Du kan enten logge på med en gratis konto og dele data med utviklerne av GitLens+, eller åpne en betalt konto. Gratis konto kan brukes for offentlige repoer, mens en betalt konto gir tilgang til private repoer.
Importkostnad
Importkostnad er et VS Code-tillegg som visualiserer størrelsen på importerte tredjepartsbiblioteker. Det viser størrelsen på importkostnaden så snart du importerer biblioteket i VS Code-editoren.
Du vil se størrelsen på biblioteket i linjen mens du skriver koden. En nettpakke brukes for å beregne størrelsen på den importerte bibliotekfilen. Noen viktige funksjoner er:
- Visning av bibliotekstørrelse ved import av fullt innhold.
- Visning av størrelse for standardimport.
- Kompatibilitet med Typescript og JavaScript.
Tillegget har blitt installert over 1 million ganger.
Path Intellisense
I forbindelse med et programvare- eller apputviklingsprosjekt er det vanlig å jobbe med flere filer samtidig. Når du skriver kode, må du ofte skrive inn filnavn basert på hukommelsen. Ettersom filnavn ofte inneholder bindestreker, kan det være vanskelig å huske dem nøyaktig. Her kommer Path Intellisense til unnsetning.
Dette er en utvidelse som automatisk fullfører filnavn i en kodebase. Verktøyet foreslår umiddelbart filen du leter etter når det gjenkjenner de første bokstavene. Det kan også bidra til å vise skjulte filer.
JavaScript Debugger (nattlig)
Dette er en debug adapter protocol (DAP) basert JavaScript-feilsøker. Verktøyet gir deg mulighet til å feilsøke i Chrome, Node.js, WebView2, Edge, VS Code-tillegg og mange andre. Siden VS Code versjon 1.46 har JavaScript Debugger vært standardutvidelsen for feilsøking. Microsoft ruller også gradvis ut verktøyet for Visual Studio IDE.
Denne VS Code-utvidelsen er et åpen kildekode-verktøy fra Microsoft. Den kan brukes fritt til både kommersielle og ikke-kommersielle utviklingsformål. Verktøyet har blitt installert over 600 000 ganger.
Konklusjon
Denne artikkelen har presentert noen av de mest nyttige VS Code-utvidelsene som du bør vurdere hvis du foretrekker å jobbe med Microsoft Visual Studio Code. Det er et ledende verktøy i økosystemet av åpen kildekode-redigerere. Du kan installere de VS IDE-utvidelsene som best dekker behovene til dine spesifikke prosjekter.
Denne listen vil hjelpe deg med å spare tid som ellers ville gått med til å lete etter disse verktøyene. Nå kan du bruke mer tid på selve prosjektet, ettersom du allerede vet hvilke utvidelser som er nyttige.
Du kan også utforske noen av de beste IDE-ene som enhver programmerer bør være kjent med.