Product Update: Ext JS 8.0 is Coming Soon! Learn More

Sencha Visual Studio Code Plugin 1.0 Now Generally Available

December 14, 2016 1964 Views

Get a summary of this article:

Show

Sencha Visual Studio Code Plugin 1.0

We’re excited to announce that Sencha Visual Studio Code Plugin is now generally available to all Ext JS customers. The Visual Studio Code plugin is an extension available for Microsoft’s Visual Studio Code editor and is included in all Ext JS editions.

Download Now

Upcoming Webinar

If you’d like to learn more tips, we will be hosting a webinar, where you’ll see features of Visual Studio Code Plugin 1.0 GA and Cmd 6.5 EA.

Register today

Event Details:
Building Ext JS Apps with ECMAScript 2015 Using Sencha Visual Studio Code Plugin
Date: Wednesday, December 14, 2016
Time: 10:00am San Francisco PST | 1:00pm New York EST | 6:00pm London GMT

Features

IntelliSense Support

IntelliSense allows you to get code completion suggestions for the appropriate visibility scope. When editing an Ext JS JavaScript file, you can just start typing, and it will bring up the IntelliSense window. You can also bring up the IntelliSense window in Visual Studio Code by typing control+space combination. IntelliSense support is provided for all configs, methods, and properties of Ext JS and user classes.

Visual Studio Code Plugin 1.0 GA - IntelliSense Support

Code Navigation

The Visual Studio Code Plugin has knowledge of the Ext JS framework, which provides a powerful navigation tool. You can quickly move throughout the application without having to search a tree or directory structure. You can navigate to the source member of the Ext JS framework or custom class with the F12 key, or by clicking on the class while holding the CTRL key on a PC, or Command key on a Mac. You can also take a peek at the definition of a referenced class within your existing class.

Visual Studio Code Plugin 1.0 GA - Code Navigation

Code Generation

The Visual Studio Code Plugin helps you create a starter app, package, and workspace. It also helps you create new Classes, Views, View Models, View Controllers, Models, Controllers, and Stores using code snippets.

Visual Studio Code Plugin 1.0 GA - Code Generation

You can easily modify or add snippets with Visual Studio Code. Just open your Command Palette and select “Edit Ext JS Snippets”. This will bring up a user snippets file that you can modify.

Visual Studio Code Plugin 1.0 GA - Edit Ext JS Snippets

Integration with Sencha Cmd

Visual Studio Code Plugin lets you watch app source code for changes, and it rebuilds outputs on any change. When the Sencha Cmd based web server is started (that hosts the app), you can see compilation errors as they happen.

Documentation Lookup

Visual Studio Code Plugin also allows you to open Sencha API documentation using the F1 key, and it presents docs relevant to the code being edited. It supports documentation lookups for Ext JS class names, xtypes and other type aliases, methods and properties, config keys, events, and more.

Try It and Share Your Feedback

Download Visual Studio Code Plugin 1.0 today, read the docs, and share your feedback in the Sencha Visual Studio Code Plugin forum.

Recommended Articles

Why JavaScript UI Components Matter More in Complex Frontend Architecture

What This Article Covers Why UI components matter – In complex frontend architecture, reusable JavaScript UI components help manage scale, improve performance, and ensure consistency…

Custom vs Prebuilt JavaScript UI Components – Which Is Better for Enterprise

What This Article Covers Build vs. Buy decision – Whether to build custom JavaScript UI components, use open-source libraries, adopt commercial solutions, or follow a…

How a JavaScript UI Framework Reduces Frontend Complexity

Frontend development has become dramatically more sophisticated over the last decade. What once involved a few scripts and styled pages has evolved into the engineering…

10 Common UI Pain Points in Large-Scale JavaScript Applications

At a small scale, many frontend decisions appear harmless. A team may: create a custom component quickly skip accessibility for one release add a one-off…

Common Responsive Design Challenges in Enterprise Web Applications

Modern businesses run on software that must work everywhere – on a desktop monitor in a corporate office, on a tablet carried across a warehouse…

Why Enterprise UI Development Gets Complicated Faster Than Teams Expect

Enterprise UI development refers to designing and building user interfaces for business-critical software used by organizations, departments, regulated industries, and large operational teams. These applications…

View More