# data[].attributes.attachment_link.title
Build Truly Native Mobile Apps with Angular | NativeScript

# data[].attributes.attachment_link.readable_text
Every once in a while it's worth taking a step back and looking at the development world from a beginner's perspective. Here at Progress, we use Angular a lot. Angular is a fundamental building block in both our web framework Kendo UI, as well as our mobile framework NativeScript. As such, we get a lot of questions about what Angular is and how to use it. When did Angular start? Whom maintains Angular? Why would you use Angular? When shouldn't you use Angular?

In this article, we'll answer these questions and more. We'll look at what Angular is, how it got started, and when using Angular is a good idea. After that we'll take a brief look at the very basics of how an Angular app works with a few simple examples. But let's start at the beginning, and look at how the Angular framework got its start.

How did Angular start?

Angular started as a side project. Back in 2009, Miško Hevery and Adam Abrons released a project called <angular /> that would help developers, as well as designers, build web applications using simple HTML tags. The name "Angular" comes from the angle brackets, or < >, that surround all HTML tags-<div>, <span>, and so forth.

Miško described the idea behind the framework in an interview done in 2013:

"We wanted to see if we could make it easier for Web designers, not necessarily Web developers, but Web designers, to sprinkle a little bit of extra HTML into their code so that they could turn a static form to something they could actually send in an email. The idea would be that you could [for example] have a mom-and-pop shop that sells pizza or something, maybe you could [have] a simple ordering system just by adding a bunch of these tags and they could send an email to the server."

Because the domain angular.com was taken - which it still is today, by the way -e ventually the maintainers renamed the library to GetAngular, and put out a small little site that talked about the framework's features.

The Angular homepage as of December 2009 retrieved via the Internet Archive

Soon after Miško started working for Google, and in 2010 he was working on a project called Google Feedback. Miško convinced his manager, Brad Green, to rewrite the project with his Angular side project, and the amount of time and code the team was able to save helped convince Google of the power Angular offered.

Brad Green and Miško Hevery showing just how much time and code they were able to save my using Angular. The screenshot is from the ng-conf 2014 keynote, which is well worth watching if you really want to dive deep into how Angular got started.

Shortly after the success of the Google Feedback rewrite the same team open sourced the library, and then eventually released a 1.0 version of Angular in May of 2011. Within a few years Angular usage skyrocketed, and today Google boasts that over one-and-a-half million developers use Angular.

What does Angular do?

Angular is a JavaScript framework that helps developers build applications. The library provides a number of features that make it trivial to implement the complex requirements of modern applications, such as data binding, routing, and animations.

Angular also provides a series of conventions for how you approach application development, which can be beneficial for large teams that need to work together on a single code base. Angular is one of the only JavaScript libraries to provide a comprehensive style guide with a number of opinionated guidelines on how you could write your code with the framework.

The Angular style guide provides guidelines on how to structure and build your apps.

When should you use Angular?

Technically you can use Angular to build just about anything, but Angular works best in non-trivial applications that involve data. If you look over the various Angular apps listed on madewithangular.com, you'll see a fairly consistent theme - apps that collect data from forms and do something with it.

This doesn't mean you need to have forms in your app to use Angular. Developers have built a surprising number of games with Angular, as well as crazier things like virtual reality applications. However, most Angular tutorials and guides you'll find will walk you through setting up some sort of form-based app. Angular's documentation, for example, has you build an app where you create heroes through a form and see them in a list.

The final result of the Tour of Heroes demo tutorial app from Angular's documentation

Angular works well in form-based apps, and it is also well suited for large and complex applications. Angular is neither the simplest JavaScript framework nor the smallest; therefore, if you're building something small you'll likely find simpler libraries like jQuery to be a better fit. Similarly, Angular is well suited for applications developed by medium-to-large teams. If you're working on an app by yourself, you may find Angular's boilerplate code and development conventions to be overkill for your own needs.

Angular also works well for applications that need to run in multiple development environments. If you have an app that must run on the web as well as a Windows or Mac desktop application, you can follow one of many online tutorials for running your Angular app with the popular Electron project. If you have an app that must run on the web as well as iOS or Android, you can leverage technologies like NativeScript to render your app in a truly native mobile environment. In some cases you can even share code across these platforms, saving valuable development time.

An example of a native iOS app written with Angular. You can try this app on your own device, or read about using NativeScript with Angular to see how to build something like this yourself.

Who maintains Angular?

The Angular Core Team includes a vast array of people that span the world and the Angular community. That being said, most of the day-to-day development of Angular is done by Google employees. Angular's about page lists roughly 20 Googlers on the Angular Core Team, and all of the top contributors to the Angular project work at Google.

That being said, although Google controls Angular, the library itself is still very much a community effort. Well over two thousand individuals have contributed to one of the many open-source Angular repositories, countless community-written tutorials and guides are available, and numerous companies offer training and tooling for developers to leverage.

Having a single company control a project is not necessarily a bad thing, as it mitigates cross-company arguments when non-trivial changes need to be made.

What version of Angular should I use?

At the time of this writing there are two popular versions of Angular. Version 1 is available at https://angularjs.org/, and is an updated version of the same Angular library Miško and team released back in 2011. The other popular version is now referred to as simply "Angular", and is available at https://angular.io/. The modern Angular is a completely redesigned version of the library designed for newer browsers, workflows, and development platforms.

In almost all cases, you should stick with the most recent version of Angular for new development. Although the Angular team has committed to maintaining Angular 1 for the foreseeable future, there is no reason to believe they'll continue to maintain the older version indefinitely. Furthermore, Angular 1 does not allow usage of the library outside of a web browser, therefore you're unable to take advantage of libraries like NativeScript for creating native mobile apps.

What does an Angular app look like?

Now that you have a little background on where Angular came from and what it does, let's dive into some code, starting with a little hello world example. All Angular apps start in HTML, and all start with an HTML page that looks something like this.

In a real app the <script> tags in the <head> can get a bit complex, but at a high-level Angular apps are just like any other web apps - you load a bunch of JavaScript in an HTML document, and that JavaScript makes the app work.

The one unique thing in the above example is the <my-app> element, as that's not an element you'd regularly use in a web-based application. Angular's goal has always been to extend the vocabulary of HTML, and it does so by allowing you do define your own tags.

These custom tags are known as components and you define their behavior in code. Here's the world's simplest implementation of the <my-app> element.

import { Component } from "@angular/core"; @Component({ selector: "my-app", template: ` <h1>Hello World</h1> ` }) export class AppComponent {}

There are a couple things you need to know to understand what's going in the chunk of code above. The first is that code is TypeScript and not JavaScript. TypeScript can seem scary if you've never seen the language before, but the basics aren't too hard to understand.

TypeScript is a superset of JavaScript, meaning, all JavaScript syntax is valid TypeScript syntax. In fact, all of the funky looking syntax in the above example - import, export, @Component, and so forth - are all either current features of JavaScript, or proposed features that are likely coming to the language in the near future. So, for the most part, when you learn TypeScript, you're learning the future of JavaScript. And for the parts that are different, the TypeScript language has superb documentation that you can refer to at any time.

TypeScript was created and is maintained by Microsoft, and has been growing in popularity for the last few years; therefore it's not much of a risk to incorporate TypeScript in to your application development. It's not going anywhere.

Let's look back at the TypeScript code that defines the <my-app> component.

import { Component } from "@angular/core"; @Component({ selector: "my-app", template: ` <h1>Hello World</h1> ` }) export class AppComponent {}

In Angular you use the @Component tag, which is known as a decorator, to mark classes that should be considered elements that can be used in your HTML markup. You have the ability to pass that @Component properties to describe the element.

The selector property determines that tag's name when typed in HTML. The use of selector: "my-app" is how Angular knows what to do when it see a <my-app> tag in HTML.

The template property controls what HTML gets rendered when this component is used. The use of template: "<h1>Hello World</h1>" is how Angular determines what to render when it sees <my-app>, and is why this app renders a basic <h1> tag when you preview it in a web browser.

How our basic "Hello World" example renders in a web browser.

Why would I use this again?

Angular is not the world's simplest framework, and it takes time to understand some of the concepts that Angular builds on top of. But once you do, there are some really powerful things you can do in a surprisingly small amount of code. For example, suppose you wanted to add data binding to the previous example. There's a really easy-to-use syntax for doing so.

Want to build a form to drive this app? Want that form to have validation and two-way data binding? There's an easy-to-follow guide for that. Is your app getting big and you want help structuring it to grow? There's a guide for that too. Getting into unit testing and want to know how to test your code? That's built-in too. Want to add professional web widgets like charts and graphs? Frameworks like Kendo UI make it simple to add in these high-quality user interface components.

With Angular you're not getting the world's easiest-to-use framework, but you are getting an incredibly robust, well-documented, and battle-tested framework used by millions of developers to create powerful applications. The Angular community is enormous, and help is readily available via Google searches, Stack Overflow, and all around the web. Hiring? There are tons of Angular developers available, and there are even recruiting sites dedicated to Angular jobs.

Oh, and remember how I mentioned that Angular runs on multiple platforms? With a small tweak to the Hello World example, you can have the beginning of the next great iOS and Android app - just switch the <h1> HTML element to a component that NativeScript can render in native mobile environment, like <Label>. Here's what that code looks like.

import { Component } from "@angular/core"; @Component({ selector: "my-app", template: ` <Label text="Hello World" class="h1"></Label> ` }) export class AppComponent {}

And here's what that code renders in a completely native iOS and Android app.

Angular makes this possible, and a whole more. From enabling teams to build awesome apps, to empowering developers to build on multiple platforms, Angular may be the solution you're looking for on your next development project.
Related resources:
If you're looking for more details than this simple introduction can offer, go ahead and go through Angular's quick-start tutorial to start to learn the framework by coding. And if you're looking to use Angular to get into mobile development, give using Angular with NativeScript a shot; you'll learn one of the web's most popular JavaScript frameworks, while getting familiar with the in-demand world of mobile application development.

# data[].attributes.attachment_link.description
Every once in a while it's worth taking a step back and looking at the development world from a beginner's perspective. Here at Progress, we use Angular a lot. Angular is a fundamental building block in both our web framework Kendo UI, as well as our mobile framework NativeScript.

# data[].attributes.attachment_link.title
Angular Development Services Company | Rishabh Software

# data[].attributes.attachment_link.description
As an Angular development company, we provide Angular web development services covering custom web & mobile apps, application modernization & migration.

# data[].attributes.attachment_link.readable_text
(commonly referred to as " Angular 2+" or " Angular CLI") is a TypeScript-based free and open-source web application framework led by the Angular Team at Google and by a community of individuals and corporations. Angular is a complete rewrite from the same team that built AngularJS.

Google designed Angular as a ground-up rewrite of AngularJS.

Angular does not have a concept of "scope" or controllers; instead, it uses a hierarchy of components as its primary architectural characteristic.

Angular has a different expression syntax, focusing on "[ ]" for property binding, and "( )" for event binding

Modularity - much core functionality has moved to modules

Angular recommends the use of Microsoft's TypeScript language, which introduces the following features:

Dynamic loading

Asynchronous template compilations

Iterative callbacks provided by RxJS.

Support to run Angular applications on servers.

The rewrite of AngularJS was called "Angular 2", but this led to confusion among developers. To clarify, the Team announced that separate terms should be used for each framework with " AngularJS" referring to the 1.X versions and "Angular" without the "JS" referring to versions 2 and up.

Angular 2.0 was announced at the ng-Europe conference 22-23. October 2014. The drastic changes in the 2.0 version created considerable controversy among developers. On April 30, 2015, the Angular developers announced that Angular 2 moved from Alpha to Developer Preview. Angular 2 moved to Beta in December 2015, and the first release candidate was published in May 2016. The final version was released on September 14, 2016.

On 13 December 2016 Angular 4 was announced, skipping 3 to avoid a confusion due to the misalignment of the router package's version which was already distributed as v3.3.0. The final version was released on March 23, 2017. Angular 4 is backward compatible with Angular 2.

Angular version 4.3 is a minor release, meaning that it contains no breaking changes and that it is a drop-in replacement for 4.x.x.

Features in version 4.3

Introducing HttpClient, a smaller, easier to use, and more powerful library for making HTTP Requests.

New router life cycle events for Guards and Resolvers. Four new events: GuardsCheckStart, GuardsCheckEnd, ResolveStart, ResolveEnd join the existing set of life cycle event such as NavigationStart.

Conditionally disable animations.

Angular 5 was released on November 1, 2017. Key improvements in Angular 5 include support for progressive web apps, a build optimizer and improvements related to Material Design.

Angular 6 was released on May 4, 2018. This is a major release focused less on the underlying framework and more on the toolchain and on making it easier to move quickly with Angular in the future, like: ng update, ng add, Angular Elements, Angular Material + CDK Components, Angular Material Starter Components, CLI Workspaces, Library Support, Tree Shakable Providers, Animations Performance Improvements, and RxJS v6.

Angular 7 was released on October 18, 2018. Updates regarding Application Performance, Angular Material & CDK, Virtual Scrolling, Improved Accessibility of Selects, now supports Content Projection using web standard for custom elements, and dependency updates regarding Typescript 3.1, RxJS 6.3, Node 10 (still supporting Node 8).

Angular 8 was released on May 28, 2019. Featuring Differential loading for all application code, Dynamic imports for lazy routes, Web workers, TypeScript 3.4 support, and Angular Ivy as an opt-in preview. Angular Ivy opt-in preview includes:

Generated code that is easier to read and debug at runtime

Faster re-build time

Improved payload size

Improved template type checking

Backwards compatibility

Angular 9 was released on February 6, 2020. Version 9 moves all applications to use the Ivy compiler and runtime by default. Angular has been updated to work with TypeScript 3.6 and 3.7. In addition to hundreds of bug fixes, the Ivy compiler and runtime offers numerous advantages:

Smaller bundle sizes

Faster testing

Better debugging

Improved CSS class and style binding

Improved type checking

Improved build errors

Improved build times, enabling AOT on by default

Improved Internationalization

Angular 10 was released on June 24, 2020.

New Date Range Picker (Material UI library)

Warnings about CommonJS imports

Optional Stricter Settings

Keeping Up to Date with the Ecosystem

New Default Browser Configuration

Deprecations and Removals

Angular 11 was released on November 11, 2020.

Angular 12 was released on May 12, 2021.

Deprecated support for IE11

Angular 13 was released on November 04, 2021

Angular 14 was released on June 02, 2022

Since v9, the Angular team has moved all new applications to use the Ivy compiler and runtime. They will be working on Ivy to improve output bundle sizes and development speeds.

Each version is expected to be backward-compatible with the prior release. The Angular development team has pledged to do twice-a-year upgrades.

All the major releases are supported for 18 months. This consists of 6 months of active support, during which regularly-scheduled updates and patches are released. It is then followed by 12 months of long-term support (LTS), during which only critical fixes and security patches are released.

Angular versions v2 to v11 are no longer under support.

This section needs expansion. You can help by adding to it.

Angular Material is a UI component library that implements Material Design in Angular.

# data[].attributes.attachment_link.description
(commonly referred to as " Angular 2+" or " Angular CLI") is a TypeScript-based free and open-source web application framework led by the Angular Team at Google and by a community of individuals and corporations. Angular is a complete rewrite from the same team that built AngularJS.

# data[].attributes.attachment_link.description
Angular is a platform for building mobile and desktop web applications. Join the community of millions of developers who build compelling user interfaces with Angular.