Read the Kapeta Blog Post from KubeCon + CloudNative 24

Bridging the Gap: A One-Click Solution for Effortless Code Access

Hey there, fellow developers! 👋

I’m thrilled to share with you an exciting feature we’ve recently added to the Kapeta app – a simple way to jump straight from the plan to the source code for that block in your IDE with just a click. This is not just a cool trick; it significantly optimizes our workflow, making our development process more efficient and integrated.

The Inspiration
As developers, we often find ourselves toggling between the app interface and our coding environment. This constant switching, although seemingly trivial, can disrupt our flow and productivity. That’s where our new feature comes in, bridging the gap between viewing and coding.

The Mechanics
The core of this new feature in the Kapeta app is a clever little library: @kapeta/electron-ide-opener. Originally part of the GitHub Desktop repository, this code was repackaged by us as a standalone library. Designed primarily for Electron apps, its versatility extends to any Node.js application. The library excels at detecting and opening files or folders in a variety of local IDEs, making it an ideal choice for our click-to-code functionality.

Integrating electron-ide-opener

First things first, you need to install the library:

					npm install --save @kapeta/electron-ide-opener


Then you can import and utilize the functionalities as shown:

					import { getAvailableEditors, findEditorOrDefault } from '@kapeta/electron-ide-opener';

const editors = await getAvailableEditors();
const vsCode = findEditorOrDefault('Visual Studio Code');
const defaultEditor = findEditorOrDefault(null);


Implementing in Kapeta
In the Kapeta app, we approached the implementation of this feature with user preferences in mind. We added a dedicated section in the app settings, allowing users to select their preferred IDE. This selection determines which editor launches when they click the “open in external editor” button in the plan view.

By leveraging electron-ide-opener, we can detect the available editors on the user’s machine. Once a user selects their preferred IDE in the settings, this choice is remembered. Then, whenever they click on the designated button in the plan view, it seamlessly opens the relevant source code file in their chosen IDE. This approach not only streamlines the workflow but also respects the individual preferences of our users, making their development experience more personalized and efficient.

Wrapping Up
This feature is a testament to the power of simple solutions to everyday problems. By leveraging electron-ide-opener, we’ve created a more connected and efficient development environment. I hope this inspires you to explore similar integrations in your projects, streamlining your workflow and enhancing productivity.

Happy coding! 🤓

Posted by

Harald Andertun

February 14, 2024

Related post

Related posts

KubeCon + CloudNative 24 was a disaster – for 20 minutes!

Being a startup doing the first public showing of a new product so far only known by our early beta...

Release announcement – We’re officially out of Beta!

We’re also proud to announce that we are out of Beta! This milestone marks a new chapter in our journey,...

NextGen IDPs – the future of software development is here

Unfortunately, neither PaaS nor traditional IDPs address the problem of reinventing software that has been developed countless times before. They...

Latest articles on the newest technologies, AI Code generation and much more