Angular – Basics

Share This Post

Over the next several posts I hope to write about Angular. This is a framework I have been using for some front-end development and it has been very enjoyable. I hope you learn something from it.

Angular is a framework to build web applications. It was created and is still maintained by Google. The main language used by Angular is TypeScript. You can use other languages, but TypeScript is the ideal. If you do not know TypeScript, it is a superset of JavaScript. You can perform some modern web application tasks and have it compiled in such a manner that it can be consumed by all browsers. I might delve more into TypeScript down the road.

Angular full color logo

Angular Advantages

Angular is structured in such a way to aid in easier maintenance. It utilizes a component and class-based structure. You modularize your code in a hierarchal structure. It also has simple declarative templates.

  • Hierarchal – Angular architecture is built with a hierarchy of components
  • Syntax – Angular has specific syntaxes for binding of events and properties
  • Dynamic loading – Angular loads items into memory at run-time and then unloads them
  • Callbacks with iteration – Angular uses the RxJS library to make asynchronous calls
  • TypesScript – Angular uses ES6 and the superset of TypeScript

The aforementioned list is but a “smidge” of what Angular offers.

Angular Architecture

So how do we build an Angular application? What is involved in creating the structure?

  • NgModules – Angular applications are comprised of at least on NgModule and many times more. NgModule declares the compilation context for components that are used in the application.
  • Components – Angular components are basically classes that contain application data and logic. Typically, each component also has an associated HTML view.
  • Templates – Angular uses HTML view templates to combine HTML markup with the data inside the component class to display the information to the user.
  • Directives – Angular directives attach behavior to DOM elements.
  • Data-binding – Angular can bind the parts of the template with the component. This can be one-way or two-way.
  • Services – Angular services are classes that allow for greater modularity where the code is reusable across the application, but is defined and narrow in scope.
  • Dependency Injection – Angular uses dependency injection to give components the functionality and data it needs to perform its tasks.
  • Routing – Angular provides detailed and extensive routing to customize the navigation for the end user. You can even preload data as a part of the routing!
Architecture of an Angular 2 application

More To Explore


Demystifying Scrum User Stories Confirmation: Ensuring Quality and Collaboration

One of the key elements of Scrum is the use of user stories to define the requirements of a system or feature from the perspective of the end user. As teams work through the product backlog, it becomes crucial to confirm the user stories to ensure they meet the desired criteria and are ready for development. In this blog post, we’ll explore the concept of Scrum user stories confirmation and its significance in delivering high-quality products.


The Power of Conversations in Scrum User Stories

At the heart of Scrum lies the concept of user stories, which serve as a means of capturing requirements from the perspective of end-users. However, the true power of user stories lies not just in their written form but also in the conversations that take place around them. In this blog post, we will explore the significance of conversations in Scrum user stories and how they contribute to the success of Agile projects.

Do You Want To Boost Your Business?

drop us a line and keep in touch

Scroll to Top

Need help?

Let's have a chat...


Jump Back In!

Here at Webolution Designs, we love to learn. This includes sharing things we have learned with you. 


Begin Your Learning Journey Today!

Come back inside to continue your learning journey.