Recently, we are just rolling out the new Monaca Cloud IDE. Even though it is not the default Cloud IDE yet, you can switch between the new and current Cloud IDE.
The new Monaca Cloud IDE provides developers with some special features that allow them to easily develop applications and improve the user development experience. So, the important question is, what are these new amazing features? The most important ones are the following:
The integrated terminal is the most important change in the Cloud IDE. It expands your ability to create, manage and develop transpilable projects such as React, VueJS, Angular, and more. Not only does it transpile but the Previewer is also launched from the embedded terminal. In other words, projects with hot-loading support is also available in the Cloud IDE. For more information about the Integrated Terminal and its usage, please refer to Integrated Terminal.
Taking into the account the importance of developer experiences, we have been adding and changing various features and user interfaces in the IDE.
One of those features is the new flexible layout. In the current IDE, all panels are fixed on a specific layout. Unlike the current IDE, all panels can be dragged and placed on any positions. Each panel can also be maximized/minimized with ease. As a result, you can arrange the layout as you prefer. This new layout is made by Golden layout which a multi-screen layout manager for webapps.
Therefore, the current version is more modern, making the programming experience even easier for developers. Just take a look at the previous Golden Layout picture, don’t you think that the new interface is better?
In addition to the flexible layout, the ability to preview your app in various devices’ layout at the same time is also added. Rather than having only one Preview window at a time, the new IDE allows you to have multiple Preview windows at the same time.
For this reason, developers who usually work on developing multiplatform and responsive applications will get hooked on this feature, but especially if you have never tried another cloud IDE which provides the user a real-time previewer for mobile apps.
A majority of time for app development is spent on writing code. Therefore, using the right code editor would speedup the development time and efficiency. For this reason, we are replacing Ace editor (used in the current IDE) with Monaco which fits very well with Monaca for various reasons such as:
Basic syntax colorization
Rich intelliSense & validation
With this replacement, the following shortcut keys are changed. For a complete list of the shortcut keys for both old and new IDE, please refer to Editor Shortcuts.
Last but not least, the new IDE will unveil an entirely new look for Monaca Backend! The new Monaca Backend will be on a separated window with a complete new look! All backend components such as User, Collection, Push notification and Mail template are much more easier to manage. The navigation between them are also becoming more user-friendly.
Some menu items are changed such as:
Editor Configurationmenu item has been moved under
Sharemenu item has been moved under
Run on Devicemenu item has been moved under