Useful VSCode extensions for Ruby development

Mateo mojica
3 min readJul 14, 2023
Photo by Clément Hélardot on Unsplash

VSCode is one of the most used code editors and one I use in my everyday activities as a developer, for this reason, I wanted to make an article about it to document how I use it and which extensions I use the most.

Let’s start with defining what it is. Visual Studio Code is a lightweight but powerful source code editor which runs on your desktop and is available for Windows, macOS, and Linux. It has built-in support for JavaScript, TypeScript, and Node.js and a rich ecosystem of extensions for other languages and runtimes (such as C++, C#, Java, Python, PHP, Go, .NET).

To download VSCode go to their website and follow the instructions for the operating system that you are running.

The biggest strength of VSCode is its extensions. VS Code extensions let you add languages, debuggers, and tools to your installation to support your development workflow. VS Code’s rich extensibility model lets extension authors plug directly into the VS Code UI and contribute functionality through the same APIs used by VS Code. To install an extension go to the marketplace tab on your editor and this will show you the most popular extensions and a search bar to look for the extension you need. Choose your extension and click install, and you are ready to go, if it is a highlight or syntactic extension nothing new will show up on your editor, but if it is an extension that provides extended functionality you will notice a new tab in your sidebar.

Photo by Thomas Bormans on Unsplash

With this said, let’s look at some of the extensions I use in my daily activities:

  • Apollo GraphQL: Editor support for GraphQL client and server development that seamlessly integrates with the Apollo platform
  • ESLint: Integrates ESLint with VSCode
  • Git lens: Shows valuable information about the history of the repository, like when was the last time the file was changed, related PRs, and more.
  • Go to spec: It gives you a command that you can run from the command palette and takes you to the related spec from the file you are on.
  • Prettier: Code formatter that parses your code and rewrites it according to its rules
  • Rails run specs: This extension provides basic commands for running spec files in the built-in VSCode terminal.
  • Ruby: This extension provides enhanced Ruby language and debugging support.
  • Ruby Solargraph: A Ruby language server featuring code completion, intellisense, and inline documentation.
  • Angular2 inline: Language support for AngularJS.
  • Vscode styled-components: Syntax highlighting for styled components.
  • Auto close tag: Automatically add HTML/XML close tag.
  • Babel Javascript: Syntax highlighting for today’s JavaScript.
  • Color highlight: Highlight web colors in your editor.
  • Ejs language support: Syntax highlighting for EJS, Javascript, and HTML tags.
  • ES7 + React/redux/react-native snippets: It has a bunch of snippets to boost your productivity while coding.
  • File icons and material icon theme: File-specific icons in VSCode for improved visual grepping.
  • Live server: Launch a development local Server with live reload feature for static & dynamic pages.
  • Thunder client: Rest API Client for VS Code similar to postman.
  • Toggle column selection: This allows you to select and change several lines simultaneously.
  • Yaml: YAML Language Support with built-in Kubernetes syntax support
  • Live share: This enables you to collaboratively edit and debug with others in real-time.

That is all I wanted to share and hope you found it helpful. If you liked this article give it a clap and follow me to get notified every time I upload a new article.

References

--

--