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, Adsense have built their user interfaces using Angular. The powerful features of Angular allows 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 at the client-side. As the complexity of the JavaScript code increases, it gradually becomes difficult in coding and maintaining.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 which 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 Transpilation. TypeScript is one such language whose code can get transpiled 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 error 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, inheritance helps in 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
    Integrated development environment (IDE) is a software application that provides all necessary options like code refactoring, intellisense support, Debugging support to software programmers for software development. Only few IDEs has 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:
    1. Visual Studio 2015 and 2013 version and so on.
    2. Eclipse
    3. Sublime Text
    4. Atom
    5. WebStorm
    6. Emacs and
    7. 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 the 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 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!