A brief summary of the monterey project

[adriatic]

Note: This project was started by two people from the Aurelia community at the time Aurelia decided to add the CLI tool to its tool collection. Jeroen Vinke was my partner in this project - and he was also the author of the CLI tool, so the idea to upgrade CLI to Visual CLI was pretty natural to both of us.

The visuals that follow are shared in their original form when VS Code did not exist in its today's form. Based on my brief interaction with Aldo Bucchi (aldonline) it is expected that we will implement all new features (Interactive Generator (with prompts and selection menus) and CLI)using VS Code extensions.

---

Introduction

Here is a sketch of the visual version of the CLI command, used to create initial skeleton of the Redwood app yarn create redwood-app ./redwood-app in terms of 5 years old Aurelia terminology (note that nothing shown here is in any way Aurelia specific.

image 1

[adriatic]

Classic CLI - Interactive CLI comparison

Here is a state of the art interactive use of CLI in the context of Gatsby, application development framework

image 1

The interaction area is divided into sections (containing the configurable application attributes), the green lines depict the selections already made, and the last, undecided section expects the user to press on the space bar to select the choice presented on the current line. The worst consequence of using the line editor is the inability to go back and redefine some previous choice.

It is indeed surprising to see such an ancient tool (ed - text editor, developed by Ken Thompson in 1969), being still used in such state of the art tools like Gatsby (and many others). One could suspect that this is the consequence of both, "easy to do" and lack of the standard screen editor. The good news is that VS Code solves the lack of a standard screen editor, in a platform-independent way.

The following screenshot describes one step of the Visual Wizard used in the situation described by npm install command issued in the terminal windows:

image 2

While this screenshot looks rather complicated, it was meant to be used at the time when jspm was introduced, and its coexistence with npm was a difficult problem to address. I am showing this to help illustrate the process this screenshot is designed to support:

Monterey is described as a multi-step wizard, where each step is focused on the definition, as well as maintenance of a logically connected set of the application's attribute. As mentioned before, this wizard is implemented as a VS Code extension, using only VS Code GUI elements. The key two properties of this wizard are:

• it supports symmetric, bidirectional traversing through the wizard
• it is designed to be used not only as the tool to create an initial application skeleton. but rather as the editor for any Monterey "capable" application. In other words, Monterey creates and uses metadata in any subsequent modification of an existing RW app. A good example would be to change an initially created JavaScript skeleton to become a Typescript app (this is probably the most complex scenario where Aldo Bucchi (aldonline) could shine 😺