Telerik blogs

Angular 2 and NativeScript integration are front and center in the latest AppBuilder release, helping you build beautiful cross-platform native mobile apps.

We're proud to debut our newest release of AppBuilder, version 3.5. We concentrated all our efforts on bringing Angular 2 and NativeScript front and center. This is our first step on a long journey for the product.

Angular 2

Angular 2 is the leading framework for creating rich Web apps. With its newest release, it's become a compelling choice for mobile app developers as well.

NativeScript

To create mobile apps, you can use Angular 2 together with the NativeScript framework. NativeScript is completely open-source, free, cross-platform on iOS and Android and supports all device hardware.

NativeScript has just released version 2.3 and we are integrating it as an experimental feature in this release. This means that we verified that builds work and produce apps correctly, but other AppBuilder features are not verified. We will release our full support for NativeScript 2.3 framework with our next full release.

AppBuilder

The Angular and NativeScript teams announced the official integration of Angular 2 with NativeScript on Sept 15th. The AppBuilder team worked around the clock and we are happy to announce that just a few days later, we are ready with our support as well!

What's In the Box

First Things First—a New Template to Kick-start Your Project

We've got a brand new Angular 2 template for you. To use it, create a new app, click Advanced, select NativeScript, select TypeScript and in the search field type Angular:

In our future releases we will streamline the experience and will put our Angular project type as the default one.

Code Completion Everywhere, Oh My!

All our clients—the Web Client, the Visual Studio Extension and the Universal Desktop Client (still in Beta) have learned about Angular and can complete both the UI code in .html files and the TypeScript code behind it:

It works in Visual Studio too.

TypeScript Support

As TypeScript is the foundation of Angular 2, we also improved support for it across the board. We updated our TypeScript compilers to the latest shipped versions (1.8) and started integrating TypeScript 2.0 (currently in RC stage) as well for a future release. TypeScript now works well in the debugger and when LiveSync'ing on the device.

Note that our Visual Studio extension uses the built-in TypeScript compiler provided by Microsoft. If you are not using Visual Studio 2015 Update 3, we strongly recommend installing the latest update to your VS version and getting the latest distribution of TypeScript.

While debugging, you can set and customize breakpoints:

You can inspect variable values inline the editor, use the Watch pane, navigate through the call stack and much more.

We strove to make debugging as seamless as possible to allow you to concentrate on getting your work done. That said, this is our first release, so expect some rough edges. We continue to improve our debugger integration, and will fix the outstanding issues.

TypeScript Integration, Package Management and More

Our Web client saw the biggest change this release. We swapped our old code editor control for the brand new Monaco editor. With it, you benefit by getting a better all-around editor, with excellent code completion and first-class TypeScript integration.

The best news is that we largely kept the UI intact—you can continue working as before, only faster and with fewer issues.

Another nifty feature—the Visual Studio extension automatically installs the dependencies specified in your project's package.json file. Just check the Bower/npm output pane.

Last but not least, we know that programming with JavaScript and TypeScript requires you to use and manage many external dependencies. We did this easier for you by redesigning our "Manage Packages" UI in the Web client. We added prominent search and filtering to make it easier for you to find the library you need right away.

Another limitation we addressed in this release is that we now allow using of scoped npm packages—for example, the various libraries published in the @angular npm namespace.

The Future

One of our most requested and used features is the Views service, which allows you to quickly scaffold your app in a visual and immediate way. We are working around the clock to update it to support Angular 2 projects too. We will ship this update soon. But for now, you need to roll up your sleeves and write some code!

Other than that, we continue polishing the user experience, and you can expect more enhancements to boost your productivity in your everyday tasks.

Try out the latest AppBuilder and Telerik Platform today.

Happy coding!


Todor-Totev
About the Author

Todor Totev

Todor is a Senior Product Manager responsible for the high productivity tooling Kinvey Studio, part of the Kinvey Platform. Todor started his career in software development more than 20 years ago, and used multiple technologies, languages, and frameworks. He switched to Product Management and worked on various high-productivity cloud-based solutions inside Progress. A passionate video gamer and avid book reader, he mostly enjoys the quiet family nights with his family.

Related Posts

Comments

Comments are disabled in preview mode.