Denne måske lidt kryptiske overskrift handler om at sammenligne to populære IDE’er til webudvikling: JetBrains Webstorm og Microsofts VS Code.
Disclaimer: Rent faktisk benytter jeg Intellij IDEA og ikke Webstorm, men det burde ikke ændre ved noget som helst da IDEA indeholder alt hvad WebStorm indeholder (plus en masse funktionalitet især rettet mod Java-udvikling). Dog: Muligvis kommer bug fixes rettet mod webudvikling med en vis forsinkelse til IDEA, men jeg er ikke sikker. Derudover skulle IDEA ikke være helt så hurtig som Webstorm hvilket giver mening da det er et mindre produkt.
Version
Versionerne af IDEA og VS Code der danner grundlag for sammenligningen er:
VS Code 1.73.1 og IDEA 2022.2.3
Pris
VS Code (ikke at forveksle med MS Visual Studio) er fuldstændig gratis.
Webstorm koster pr. november 2022 159 Euro det første år, IDEA koster 599 Euro. Man kan dog downloade fulde versioner af både Webstorm og IDEA til gratis prøve i en måned. Jeg er dog i tvivl om hvorvidt man kan starte med en gratis måned med IDEA og derefter endnu en hvor man bruger Webstorm – kunne være interessant at undersøge.
Genvejstaster
Webstorm/IDEA og VS Code har forskellige genvejstaster. Hvis man kommer fra VS Code og skal til at benytte Webstorm/IDEA kan det være en fordel at vide at der findes følgende keymap plugin der kan give de fleste af de genvejstaster man har været vant til:
https://plugins.jetbrains.com/plugin/12062-vscode-keymap/
Vær opmærksom på at pluginnet først virker efter at man har aktiveret det ved at vælge VS Code i dropdown her: Preferences > Keymap
I det følgende angives genvejstaster for Webstorm/IDEA som om dette plugin er aktiveret.
Dark mode
En ikke uvæsentlig del af at være glad og produktiv som udvikler er hvordan farverne spiller sammen i IDE’et. Jeg er stor tilhænger af dark-mode. Efter i mange år at have programmeret med “white-mode” i Visual Studio og Eclipse osv. kom dark-mode som en åbenbaring. Ikke kun gjorde det at jeg kunne koncentrere mig i længere tid, men det bragte også minderne frem om den monokrone sort/grønne computerskærm jeg lånte af min far som teenager.
Igen kan man nok få dark-mode til at tage sig ens ud, men default-looket er værd at dvæle ved. VS Code har en meget sort baggrund i selve editoren og IDEA en noget mere koksgrå baggrund. Det koksgrå fungerer fint på en stor kvalitetsskærm, men på min ellers ganske fine DELL laptop 1920*1080 skærm synes jeg straks det ser mere gnidret ud. Det er måske smag og behag, men jeg synes altså VS Codes default dark mode er den store vinder her.
Igen er der hjælp at hente her:
https://plugins.jetbrains.com/plugin/12255-visual-studio-code-dark-plus-theme
Og skønt nok så spiller det ud af boksen så snart man har klikket Apply.
Venstrepanelet
På mange måder er venstrepanelet visuelt forskelligt i de to IDE’er, men alligevel kan man gøre mange af de samme ting – forskellene handler umiddelbart mest om default settings.
Markering af åben fil
Jeg er stor tilhænger af at alle åbne filer bliver markeret på en tydelig måde i venstre-panelet. I VS Code hedder det sted man får vist alle projektfiler “EXPLORER” – I IDEA hedder det “Project”. Pr. default markerer VS Code i EXPLORER de filer der åbnes fra Command Palette > Search (ctrl + p). Filer åbnet fra Navigate > File (ctrl + p) i IDEA vises ikke pr. default, hvilket jeg finder uhensigtmæssigt. Fixet er dog simpelt:
Klik på tandhjuls-ikonet (eng: gear) øverst i IDEA’s Project View og vælg ”Always Select Opened File”
Formatering
Autoindent
Her er IDEA i forhold til mine oplevelser bare den helt store vinder. Automatisk indrykning således at man ikke behøver at tabbe eller space sig frem når man skriver en kodelinje spiller bare i IDEA. I VS Code not so much. I teorien gør det, men af en eller anden grund oplever jeg igen og igen at det ikke gør i VS Code.
Stay tuned
Dette indlæg er under udvikling så mere vil følge …