Getting Started With Angular

Introduction

In this article, we will discuss the basics of Angular and the features of typescript.

What is Angular?

Angular is performance efficient and one of the most powerful Javascript frameworks used to build single-page applications for both web and mobile. Angular follows a component-oriented application design pattern to develop completely reusable and modularized web applications. Popular web platforms like Google Adwords, Google Fiber, and Adsense have built their user interfaces using Angular. The powerful features of Angular allow us to create complex, customizable, modern, responsive, and user-friendly web applications.

Angular Framework uses Typescript for developing single-page applications, as it supports static typing to write structured code with the help of modules and object-oriented concepts. As a result, less error-prone JavaScript code can be developed using TypeScript features.

Why do we use Typescript?

JavaScript is the language used for client-side scripting. We can use JavaScript frameworks for writing complex business logic which runs on the client side. As the complexity of the JavaScript code increases, it gradually becomes difficult to code and maintain. This is because of the limitations of JavaScript language. We do not have an option to change the language for the client-side scripting, as the browser understands only JavaScript.

The solution is to choose a language that is rich in features and the code can be converted to JavaScript. This process of converting code written in one language into another language is called Transpiration. TypeScript is one such language whose code can get transpired to JavaScript.

Pitfalls of Javascript

Dynamic Typing: Dynamic typing means deciding the data type of the variable dynamically at run time. To avoid a runtime error, we can use static typing in Typescript, where we will add data type to the function argument while defining it. By doing so, we can detect errors early at compilation time itself.
Interpreted Language: Interpreted Language is a language in which the code instructions are executed directly without prior compilation to machine-language instructions. The disadvantage of Interpreted Language is that we will get to know most of the errors only at run time. We can overcome this by using TypeScript which will be transpiled to JavaScript and we can get most of the errors fixed during the transpilation time itself. This will save application development time for a JavaScript developer.
Minimal Object-Oriented Support: Object-oriented programming (OOP) is a programming methodology based on the concept of objects. Object-oriented concepts like classes, encapsulation, and inheritance help in the readability and reusability of the code. On the other hand, TypeScript supports interface and generic concepts which is not supported by JavaScript.
Minimal IDE support: An integrated development environment (IDE) is a software application that provides all necessary options like code refactoring, intellisense support, and Debugging support to software programmers for software development. Only a few IDEs have code refactoring, intellisense support for JavaScript application development. Intellisense support helps in writing the code quickly. Refactoring support helps in changing the variable or function names throughout the application quickly.

Most of the IDEs have good support for TypeScript, some of them are,

Visual Studio 2015 and 2013 versions and so on.
Eclipse
Sublime Text
Atom
WebStorm
Emacs and
Vim

TypeScript is a superset of JavaScript and transpiles to the preferred version of JavaScript. TypeScript makes the development of JavaScript nearer to a more traditional object-oriented experience.TypeScript is based on ECMAScript 6 and 7 proposals. Any valid JavaScript is TypeScript.

Features of Typescript

Static Typing: It adds static typing to JavaScript, due to which the readability of the code improves and also helps in finding more early compilation errors than run time errors.
Object-Oriented Programming: TypeScript supports object-oriented programming features such as class, encapsulation, interface inheritance and so on which helps in creating highly structured and reusable code.
Modules support: TypeScript provides an option to create modules so that we can modularize the code for easy maintenance. Modules also help in making the application scalable.
Cross-Platform: It works across the platform.
Tooling Support: TypeScript works extremely well with Sublime Text, Eclipse, and almost all major IDEs compared to JavaScript.
Open Source: TypeScript is open source. The source code of TypeScript can be downloaded from Github.

Summary

In this article, I have discussed the basic concepts that are good to know before starting your first Angular application. I hope this article helps you groom your basic concepts. In the next article, we are going to learn how to set up a Typescript environment. Until next time, Happy Reading.

Cheers!