Visual Studio Code #179

arcticicestudio · 2019-02-23T13:46:42Z

This issue documents the migration from Atom to Visual Studio Code.
I've used Atom since it came out some years ago and it has always been a great editor and IDE for web development as well as main editor for documents, but VS Code evolved a lot during the last year.

Compared to Atom there are many features and improvements that I've really liked to see for Atom. Even though it can be extended and modified a lot there are limitations due to Atom's core in aspects like performance, stability and overall development features like auto-completion and language-awareness.

VS Code feels more "language-native" when it comes to e.g. intelligent auto-completion, the integration of linters and language specific tools. It comes with support for a lot of languages out-of-the-box™ like JavaScript/TypeScript, CSS/HTML and also native languages like Go or Rust.

The change was not easy for me since I've customized and developed Atom to fit all of development needs, but after some testing time I've to admit that the UX of VS Code feels better now.

Before actually switching I made sure that all my beloved Atom packages are also available as VS Code extension (same code base) or an equivalent alternative.

Therefore this initial setup will include

core and extension settings
custom keybindings
locale configurations
a list of all installed extensions
CSS stylesheets to customize some that'll be loaded by the “Custom CSS and JS Loader“ extension
workspace files

The following extensions will be used:

This commit includes the migration from Atom (1) to Visual Studio Code (2). I've used Atom since it came out some years ago and it has always been a great editor and IDE for web development as well as main editor for documents, but VS Code evolved a lot during the last year. Compared to Atom there are many features and improvements that I've really liked to see for Atom. Even though it can be extended and modified a lot there are limitations due to Atom's core in aspects like performance, stability and overall development features like auto completion and language-awareness. VS Code feels more "language-native" when it comes to e.g. intelligent auto-completion, the integration of linters and language specific tools. It comes with support for a lot of languages out-of-the-box like JavaScript/TypeScript, CSS/HTML and also native languages like Go or Rust. The change was not easy for me since I've customized and developed Atom to fit all of development needs, but after some testing time I've to admit that the UX of VS Code feels better now. Before actually switching I made sure that all my beloved Atom packages are also available as VS Code extension (same code base) or an equivalent alternative. Therefore this initial setup includes - core and extension settings - custom keybindings - locale configurations - a list of all installed extensions - CSS stylesheets to customize some that'll be loaded by the "Custom CSS and JS Loader" (3) extension - workspace files The following extensions are used: - Nord (4) - file-icons (5) - Prettier (6) - ESLint (7) - Markdown Preview Enhanced (8) - Babel JavaScript (9) - vscode-styled-components (10) - Path Intellisense (11) - Go (12) - Docker (13) - YAML (14) - EditorConfig (15) - Projects+ (16) - Polacode (17) - Custom CSS and JS Loader (18) - Rust (rls) (19) - GraphQL (20) References: (1) https://atom.io (2) https://code.visualstudio.com (3) https://marketplace.visualstudio.com/items?itemName=be5invis.vscode-custom-css (4) https://marketplace.visualstudio.com/items?itemName=arcticicestudio.nord-visual-studio-code (5) https://marketplace.visualstudio.com/items?itemName=file-icons.file-icons (6) https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode (7) https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint (8) https://marketplace.visualstudio.com/items?itemName=shd101wyy.markdown-preview-enhanced (9) https://marketplace.visualstudio.com/items?itemName=mgmcdermott.vscode-language-babel (10) https://marketplace.visualstudio.com/items?itemName=jpoissonnier.vscode-styled-components (11) https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense (12) https://marketplace.visualstudio.com/items?itemName=ms-vscode.Go (13) https://marketplace.visualstudio.com/items?itemName=PeterJausovec.vscode-docker (14) https://marketplace.visualstudio.com/items?itemName=redhat.vscode-yaml (15) https://marketplace.visualstudio.com/items?itemName=EditorConfig.EditorConfig (16) https://marketplace.visualstudio.com/items?itemName=fabiospampinato.vscode-projects-plus (17) https://marketplace.visualstudio.com/items?itemName=pnp.polacode (18) https://marketplace.visualstudio.com/items?itemName=be5invis.vscode-custom-css (19) https://marketplace.visualstudio.com/items?itemName=rust-lang.rust (20) https://marketplace.visualstudio.com/items?itemName=Prisma.vscode-graphql Resolves GH-179

GH-179

This commit includes the migration from Atom (1) to Visual Studio Code (2). I've used Atom since it came out some years ago and it has always been a great editor and IDE for web development as well as main editor for documents, but VS Code evolved a lot during the last year. Compared to Atom there are many features and improvements that I've really liked to see for Atom. Even though it can be extended and modified a lot there are limitations due to Atom's core in aspects like performance, stability and overall development features like auto completion and language-awareness. VS Code feels more "language-native" when it comes to e.g. intelligent auto-completion, the integration of linters and language specific tools. It comes with support for a lot of languages out-of-the-box like JavaScript/TypeScript, CSS/HTML and also native languages like Go or Rust. The change was not easy for me since I've customized and developed Atom to fit all of development needs, but after some testing time I've to admit that the UX of VS Code feels better now. Before actually switching I made sure that all my beloved Atom packages are also available as VS Code extension (same code base) or an equivalent alternative. Therefore this initial setup includes - core and extension settings - custom keybindings - locale configurations - a list of all installed extensions - CSS stylesheets to customize some that'll be loaded by the "Custom CSS and JS Loader" (3) extension - workspace files The following extensions are used: - Nord (4) - file-icons (5) - Prettier (6) - ESLint (7) - Markdown Preview Enhanced (8) - Babel JavaScript (9) - vscode-styled-components (10) - Path Intellisense (11) - Go (12) - Docker (13) - YAML (14) - EditorConfig (15) - Projects+ (16) - Polacode (17) - Custom CSS and JS Loader (18) - Rust (rls) (19) - GraphQL (20) References: (1) https://atom.io (2) https://code.visualstudio.com (3) https://marketplace.visualstudio.com/items?itemName=be5invis.vscode-custom-css (4) https://marketplace.visualstudio.com/items?itemName=arcticicestudio.nord-visual-studio-code (5) https://marketplace.visualstudio.com/items?itemName=file-icons.file-icons (6) https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode (7) https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint (8) https://marketplace.visualstudio.com/items?itemName=shd101wyy.markdown-preview-enhanced (9) https://marketplace.visualstudio.com/items?itemName=mgmcdermott.vscode-language-babel (10) https://marketplace.visualstudio.com/items?itemName=jpoissonnier.vscode-styled-components (11) https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense (12) https://marketplace.visualstudio.com/items?itemName=ms-vscode.Go (13) https://marketplace.visualstudio.com/items?itemName=PeterJausovec.vscode-docker (14) https://marketplace.visualstudio.com/items?itemName=redhat.vscode-yaml (15) https://marketplace.visualstudio.com/items?itemName=EditorConfig.EditorConfig (16) https://marketplace.visualstudio.com/items?itemName=fabiospampinato.vscode-projects-plus (17) https://marketplace.visualstudio.com/items?itemName=pnp.polacode (18) https://marketplace.visualstudio.com/items?itemName=be5invis.vscode-custom-css (19) https://marketplace.visualstudio.com/items?itemName=rust-lang.rust (20) https://marketplace.visualstudio.com/items?itemName=Prisma.vscode-graphql Resolves GH-179

GH-179

This commit includes the migration from Atom (1) to Visual Studio Code (2). I've used Atom since it came out some years ago and it has always been a great editor and IDE for web development as well as main editor for documents, but VS Code evolved a lot during the last year. Compared to Atom there are many features and improvements that I've really liked to see for Atom. Even though it can be extended and modified a lot there are limitations due to Atom's core in aspects like performance, stability and overall development features like auto completion and language-awareness. VS Code feels more "language-native" when it comes to e.g. intelligent auto-completion, the integration of linters and language specific tools. It comes with support for a lot of languages out-of-the-box like JavaScript/TypeScript, CSS/HTML and also native languages like Go or Rust. The change was not easy for me since I've customized and developed Atom to fit all of development needs, but after some testing time I've to admit that the UX of VS Code feels better now. Before actually switching I made sure that all my beloved Atom packages are also available as VS Code extension (same code base) or an equivalent alternative. Therefore this initial setup includes - core and extension settings - custom keybindings - locale configurations - a list of all installed extensions - CSS stylesheets to customize some that'll be loaded by the "Custom CSS and JS Loader" (3) extension - workspace files The following extensions are used: - Nord (4) - file-icons (5) - Prettier (6) - ESLint (7) - Markdown Preview Enhanced (8) - Babel JavaScript (9) - vscode-styled-components (10) - Path Intellisense (11) - Go (12) - Docker (13) - YAML (14) - EditorConfig (15) - Projects+ (16) - Polacode (17) - Custom CSS and JS Loader (18) - Rust (rls) (19) - GraphQL (20) References: (1) https://atom.io (2) https://code.visualstudio.com (3) https://marketplace.visualstudio.com/items?itemName=be5invis.vscode-custom-css (4) https://marketplace.visualstudio.com/items?itemName=arcticicestudio.nord-visual-studio-code (5) https://marketplace.visualstudio.com/items?itemName=file-icons.file-icons (6) https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode (7) https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint (8) https://marketplace.visualstudio.com/items?itemName=shd101wyy.markdown-preview-enhanced (9) https://marketplace.visualstudio.com/items?itemName=mgmcdermott.vscode-language-babel (10) https://marketplace.visualstudio.com/items?itemName=jpoissonnier.vscode-styled-components (11) https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense (12) https://marketplace.visualstudio.com/items?itemName=ms-vscode.Go (13) https://marketplace.visualstudio.com/items?itemName=PeterJausovec.vscode-docker (14) https://marketplace.visualstudio.com/items?itemName=redhat.vscode-yaml (15) https://marketplace.visualstudio.com/items?itemName=EditorConfig.EditorConfig (16) https://marketplace.visualstudio.com/items?itemName=fabiospampinato.vscode-projects-plus (17) https://marketplace.visualstudio.com/items?itemName=pnp.polacode (18) https://marketplace.visualstudio.com/items?itemName=be5invis.vscode-custom-css (19) https://marketplace.visualstudio.com/items?itemName=rust-lang.rust (20) https://marketplace.visualstudio.com/items?itemName=Prisma.vscode-graphql Resolves GH-179

In GH-179 the Custom CSS and JS Loader (1) extension was introduced to use custom CSS stylesheets including styles to hide VS Code's menu buttons from the editor. To hide the button of sidebar panels headers another selector has been added. References: (1) https://marketplace.visualstudio.com/items?itemName=be5invis.vscode-custom-css Resolves GH-200

There were `.desktop` files for applications that are not used anymore for some time now as well as applications that don't require a user-level launcher file anymore. >> Desktop Launchers - `atom.desktop` - Atom [1] was not used anymore since at least February 23 2019 and was replaced by Visual Studio Code [2] in GH-179. - `evolution.desktop` - The usage of Evolution [3] was only temporary and for test purposes regarding the compatibility with different protocols that could be used through opt-in extensions, but it was never the plan to replace the fantasic Thunderbird [4] as main mail application. - `gpick.desktop` - The main reason for a user-level launcher was the missing `MimeType` entry for `application/x-gpick-palette` which has already been patched in the upstream [5]. Anyway, Gpick is also not used anymore since most design related applications include tools to pick colors, like e.g. Firefox's Eyedropper [6] or of course GIMP [7]. - `gtkhash.desktop` - GTKHash [8] is also not used anymore, the user-level launcher was introduced back then to add more keywords for supported hash algorithms. - `jetbrains-ide.desktop` - The user-level launcher was introduced because the used icon name `intellij-idea-ultimate-edition` was not provided by the used icon the ("Numix Circle") so it was changed to the available `idea` icon. Anyway, a symlink was added a long time ago in the icon theme upstream and therefore the custom launcher is not required anymore. - `org.gnome.gedit.desktop` - The user-level launcher was introduced to add more _MIME_ types that should be handled by Gedit [9], this was then resolved shortly afterwards using the correct way through XDG MIME type handling [10]. - `shotwell-viewer.desktop` - The user-level launcher was introduced in order to hide the `shotwell-viewer` application, that is not intended to be called as standalone application, using the `NoDisplay` attribute. Anyway, the launcher is now hidden by default in the upstream [11] and therefore doesn't require a custom launcher anymore. >> XDG Autostart - `dropbox.desktop` - Dropbox [12] was only used for testing purposes and has been replaced by the fantastic and advanced Syncthing [13] and Seafile [14] projects. >> XDG Configurations The `$XDG_CONFIG_HOME/gtk-*/bookmarks` file was never really useful since it only support absolute file/directory paths using the `file://` protocol but doesn't resolve environment variables. It also takes less than a minute to manually create the bookmarks using either Nautilus UI or any other GTK application that support the `GtkPlacesSidebar` API [15]. This also allows to dynamically add or remove bookmarks based on the current requirements. Therefore the file has been removed at all. [1]: https://atom.io [2]: https://code.visualstudio.com [3]: https://wiki.gnome.org/Apps/Evolution [4]: https://www.thunderbird.net [5]: https://github.com/thezbyg/gpick/blob/6adcd1337416e11959a7bc64829ac63459086416/share/applications/gpick.desktop#L10 [6]: https://developer.mozilla.org/en-US/docs/Tools/Eyedropper [7]: https://www.gimp.org [8]: https://github.com/tristanheaven/gtkhash [9]: https://wiki.gnome.org/Apps/Gedit [10]: https://wiki.archlinux.org/index.php/XDG_MIME_Applications [11]: https://gitlab.gnome.org/GNOME/shotwell/-/blob/ca03ce2f8e70670d43be00e9f381f9cd22afbceb/data/org.gnome.Shotwell-Viewer.desktop.in#L9 [12]: https://www.dropbox.com [13]: https://syncthing.net [14]: https://www.seafile.com [15]: https://developer.gnome.org/gtk3/stable/GtkPlacesSidebar.html GH-246

There were `.desktop` files for applications that are not used anymore for some time now as well as applications that don't require a user-level launcher file anymore. >> Desktop Launchers - `atom.desktop` - Atom [1] was not used anymore since at least February 23 2019 and was replaced by Visual Studio Code [2] in GH-179. - `evolution.desktop` - The usage of Evolution [3] was only temporary and for test purposes regarding the compatibility with different protocols that could be used through opt-in extensions, but it was never the plan to replace the fantasic Thunderbird [4] as main mail application. - `gpick.desktop` - The main reason for a user-level launcher was the missing `MimeType` entry for `application/x-gpick-palette` which has already been patched in the upstream [5]. Anyway, Gpick is also not used anymore since most design related applications include tools to pick colors, like e.g. Firefox's Eyedropper [6] or of course GIMP [7]. - `gtkhash.desktop` - GTKHash [8] is also not used anymore, the user-level launcher was introduced back then to add more keywords for supported hash algorithms. - `jetbrains-ide.desktop` - The user-level launcher was introduced because the used icon name `intellij-idea-ultimate-edition` was not provided by the used icon the ("Numix Circle") so it was changed to the available `idea` icon. Anyway, a symlink was added a long time ago in the icon theme upstream and therefore the custom launcher is not required anymore. - `org.gnome.gedit.desktop` - The user-level launcher was introduced to add more _MIME_ types that should be handled by Gedit [9], this was then resolved shortly afterwards using the correct way through XDG MIME type handling [10]. - `shotwell-viewer.desktop` - The user-level launcher was introduced in order to hide the `shotwell-viewer` application, that is not intended to be called as standalone application, using the `NoDisplay` attribute. Anyway, the launcher is now hidden by default in the upstream [11] and therefore doesn't require a custom launcher anymore. >> XDG Autostart - `dropbox.desktop` - Dropbox [12] was only used for testing purposes and has been replaced by the fantastic and advanced Syncthing [13] and Seafile [14] projects. >> XDG Configurations The `$XDG_CONFIG_HOME/gtk-*/bookmarks` file was never really useful since it only support absolute file/directory paths using the `file://` protocol but doesn't resolve environment variables. It also takes less than a minute to manually create the bookmarks using either Nautilus UI or any other GTK application that support the `GtkPlacesSidebar` API [15]. This also allows to dynamically add or remove bookmarks based on the current requirements. Therefore the file has been removed at all. [1]: https://atom.io [2]: https://code.visualstudio.com [3]: https://wiki.gnome.org/Apps/Evolution [4]: https://www.thunderbird.net [5]: https://github.com/thezbyg/gpick/blob/6adcd1337416e11959a7bc64829ac63459086416/share/applications/gpick.desktop#L10 [6]: https://developer.mozilla.org/en-US/docs/Tools/Eyedropper [7]: https://www.gimp.org [8]: https://github.com/tristanheaven/gtkhash [9]: https://wiki.gnome.org/Apps/Gedit [10]: https://wiki.archlinux.org/index.php/XDG_MIME_Applications [11]: https://gitlab.gnome.org/GNOME/shotwell/-/blob/ca03ce2f8e70670d43be00e9f381f9cd22afbceb/data/org.gnome.Shotwell-Viewer.desktop.in#L9 [12]: https://www.dropbox.com [13]: https://syncthing.net [14]: https://www.seafile.com [15]: https://developer.gnome.org/gtk3/stable/GtkPlacesSidebar.html Closes GH-246 Co-authored-by: Sven Greb <development@svengreb.de>

Atom [1] is not used anymore since at least February 23 2019 and was replaced by Visual Studio Code [2] in GH-179. Therefore the `atom` snowblock_ has been removed while the data is still available through the Git repository history/logs. [1]: https://atom.io [2]: https://code.visualstudio.com [3]: https://git-scm.com/book/en/v2/Git-Basics-Viewing-the-Commit-History GH-251 Related to GH-248 Co-authored-by: Sven Greb <development@svengreb.de>

Atom [1] is not used anymore since at least February 23 2019 and was replaced by Visual Studio Code [2] in GH-179. Therefore the `atom` snowblock_ has been removed while the data is still available through the Git repository history/logs. [1]: https://atom.io [2]: https://code.visualstudio.com [3]: https://git-scm.com/book/en/v2/Git-Basics-Viewing-the-Commit-History Closes GH-251 Related to GH-248 Co-authored-by: Sven Greb <development@svengreb.de>

arcticicestudio added type-feature snowblock-visual-studio-code labels Feb 23, 2019

arcticicestudio added this to the 0.1.0 milestone Feb 23, 2019

arcticicestudio self-assigned this Feb 23, 2019

arcticicestudio closed this as completed in 8cebb08 Feb 23, 2019

arcticicestudio removed their assignment Feb 23, 2019

arcticicestudio added a commit that referenced this issue Feb 23, 2019

Show action buttons for debug sidebar view again

9ce02cd

GH-179

arcticicestudio added a commit that referenced this issue Feb 23, 2019

Hide menu bar

411cfaf

GH-179

arcticicestudio mentioned this issue Jun 8, 2019

Hide VS Code action buttons of sidebar panel headers #200

Closed

arcticicestudio mentioned this issue Apr 14, 2020

XDG application desktop launcher & configuration cleanup #246

Closed

arcticicestudio mentioned this issue Apr 15, 2020

“Atom“ snowblock decommission #251

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Visual Studio Code #179

Visual Studio Code #179

arcticicestudio commented Feb 23, 2019 •

edited

Loading

Visual Studio Code #179

Visual Studio Code #179

Comments

arcticicestudio commented Feb 23, 2019 • edited Loading

arcticicestudio commented Feb 23, 2019 •

edited

Loading