We’ve all been looking for the perfect text editor or IDE, the one that integrates every tool and let us work with any language. Unfortunately, it doesn’t exist. We have choices between 2 categories of editors :

Text editors , simple and fast, they’re easy to use and let us choose technologies we want to work with. They don’t integrate a lot of tools so we have to use terminals to have a complete tooling (compiler, static code analysis, binary running, development server, etc)

, simple and fast, they’re easy to use and let us choose technologies we want to work with. They don’t integrate a lot of tools so (compiler, static code analysis, binary running, development server, etc) IDE, extremely complete, they integrate some stacks very well, but take time to integrate cutting-edge tooling. They’re slow, and designed to be used on full-screen.

Atom as a base

I’m a big fan of Atom philosophy; Atom is the new Emacs, the hackable editor with a ready-to-use default configuration. Atom is extensible, we can, as a plugin, modify the User Interface, add new capabilities to the awesome command palette, and use provided API to interact with buffer and files. Completely Open Sourced, and maintained by GitHub and a big community, it integrates with a lot of languages, and provide a very powerful text editor.

But Atom is far from being as complete as a true IDE. It doesn’t pretend to, but it could. Nuclide is one of the great plugins for Atom, that try to transform it into a complete one.

Experience

I’m the developer of some Atom plugins (docker, git-commit, some others), and I’ve found repetitive the plugin creation. A lot of things can be abstracted into a generic User Interface, and be integrated with simple APIs. Every Atom plugins contributors have to implement the same set of commons features to provide the 5% real feature code. I wanted to provide those API, plugins have to be beautiful, and powerful, without taking so much time to integrate.

Vision

Molecule is an Atom based IDE built to make easier plugin integration and thus increasing the number of tools available in Atom. With a complete set of API, we aim to provide a unified user experience for any tools, and a beautiful UI that can be reused again and again. We identify common problems, and find a pattern to make a generic UI associated to a set of API.

First problem targeted

As a react developer, I’ve fallen into the ever growing tooling stack :

FlowType

ESLint

Webpack

Jest

Gulp

Chrome

Bash (or others shells)

NPM

TestCafé

Nightwatch

and many others (Redux devtools, Docker, react-native, etc..). And the biggest problem I had was launching all those tools every time and managing my windows to be able to see every important information like:

a tool has stopped working

an error has occurred while building

something has happened on a tool (new log ?)

what is the first error of this ever long stack trace ?

So we have built a generic UI with a set of API providing a way for running tools, seeing diagnostics (errors, warnings, infos, successes), seeing important notifications (a tool has stopped working, an error has occurred).

First pre-Alpha release

We have solved two commons problems :

Executing processes using a user configuration

Aggregating results and displaying them correctly

First of all, we had to provide a way to configure “executions”. We have called it “Plan Schema”. The Plan Schema helps Molecule to generate a configuration UI that will let users make “Plans”. A plan is a way of using a tool, a configuration leading to a precise execution. For example, we can imagine a Plan for executing gcc with some debug flags, and another for executing gcc with release configuration. Plans are grouped by tool.

In Molecule you have the tool dock on the bottom, and you can click on the tool name to open the Plan Configuration Panel. This allow you to create some plans. Then you only have to click on a plan to execute it, you’ll see it running with a beautiful animation, and you’ll know when it has stopped.

This way every tool are executed the same way, allowing users to be able to execute anything without frictions, and opening capabilities on our side to provide some awesome features like Remote Development.

The second problem has lead us to think every information can be classified in 4 categories : error, warning, info, success. If you take for example GCC you can have some compilation errors and warnings, and some compilation logs (infos) ; with Jest you can have some tests passed with success and some failed (errors). We have provided an API to let plugins take control of diagnostic creation. Each plugin is called on stdout / stderr event (for shell processes) or data messages (for node forks) and has to parse details to find out what happens. Diagnostics are composed of a message, a type (error, warning …) and a date, the message will be displayed on a specific panel handled by Molecule and because everything is diagnostic, it opens on our side capabilities to provide diagnostic search, beautiful UI to navigate through them, etc … The API brings capabilities to add diagnostics but also to parse JSON on another process (to keep things performant) or to convert stdout to HTML.

The API is made to be flexible, for example you can define a message as a string, a javascript object, and even a React Component and Molecule will take care of displaying correctly and with an awesome experience.

With those two patterns (Plans and Diagnostics) we open up a new world of easily integrated plugin that leads to a unified developer experience.

But every tool has a configuration file, or something to define a root for its execution. We call it “Package”. Package is like an application of a tool, a directory or a file defining that it’s a project for this particular tool. Molecule lets you define how we detect packages for a tool automatically.

The API

For now, plugins are directly included into the project, but in the coming month we will let users define externals plugins as Atom does. Each plugin we’ve made is coded in less than 300 lines of code, which is little compared to what you would have done without Molecule. in 50 lines you can have a UI for configuring execution, automatic detection of packages, execution, and basic diagnostic detection and display. You also have a place on the devtool bar and advanced features like Remote Development (Execution of your tool on another machine) and Diagnostic travelling.

We provide ease of creation. Painful tasks like async process-externalized JSON parsing and stdout to HTML conversion are provided. It’s made to let you define only what’s necessary. Instead of doing only 10% of really useful feature code, you do 100%.

Everything is done to be as most declarative as possible to let you integrate tools in hours.

Partially Integrated First Tools

We provide a first set of tools, targeting web development, to let you try Molecule. Those tools will be officially supported, that means we take care of their evolution, but they’re partially integrated. That means we have integrated only the necessary to let you understand what we want to do. This set is composed of 10 tools.

We need feedback

Molecule is in pre-alpha stage, it’s a beginning of a very long and exciting journey. It’s still buggy and incomplete. We focus on making developers life easier, and we want to know what you think about it. Try it out on http://molecule.sh and give us feedback. We’re interested by every idea, every issue and every single opinion you can have. We’ll do our best to fit your needs and to help you contributing to the project if you’re willing to.

More to come

We will integrate more and more tools, fix issues and we will focus other commons problems like Drag’n drop coding, project scaffolding and task management integration. We’re going to release every two weeks, so features are coming quickly to you. Molecule is available on GitHub for download, and we’ll release it to APM (Atom Package Manager) repositories when we think it’s daily usable.