Angular Learning Resources

In the time of information overload and rapid technology advancement it is really hard to follow and try out all the interesting projects, articles and samples. I have compiled a list of resources for Angular framework that I am interested to try and review and share. I will split resources by topics.

# Sample projects


Angular for Beginners - Let's build a Tic-Tac-Toe PWA (opens new window)
"Learn the basics of Angular 8 by building a tic-tac-toe game from scratch...Then deploy it as an installable progressive web app (PWA). Go beyond the basics"

Build an Angular ToDo App with Angular CLI in 6 Easy Steps (opens new window)
"Do you want to learn how to create an Angular ToDo App? Here are 6 easy steps that will help you to create an app with little coding efforts." Github repo (opens new window)

Building a CRUD application with Angular (opens new window)
"In this tutorial, you'll learn how to build a CRUD application with Angular."

Component Inheritance in Angular (opens new window)
"Respect the DRY rule! Learn how to write code efficiently using component inheritance"

How to Preview Blobs With HTTP POST and Angular 5 (opens new window)
"In this quick but helpful article, a software architect documents how to upload images to a web page using Angular and HTTP POST."

Angular 8 HttpClient & Http Tutorial – Build and Consume RESTful API (opens new window)
"Angular 8 HttpClient & Http tutorial is going to be discussed in this blog today. We’ll learn to create and consume RESTful APIs in Angular 8 project. To manage the data on the remote server, we make GET, POST, PUT and Delete using HttpClient API. We are required to import and setup HttpClient service in Angular 8 project to consume REST APIs."

Learn Angular 8 in 10 Days – Day 1 (opens new window)
"Angular 8 is the latest production version of Angular. This Angular 8 tutorial, learn how to build large scale websites using Angular 8 in 10 days."

How to create an Angular 8 application with ASP.NET Core 3.0 (opens new window)
"In this post, I will explain the steps to create an Angular 8 application with ASP.NET 3.0. We will create a simple controller class to get latest C# Corner posts details and will be shown in the home component. We will get more features soon from Microsoft soon."

How to build Progressive Web Apps with Angular (opens new window)
"Progressive web apps are web applications built with technologies that make them behave like native apps. A benefit of progressive web apps is the ability to work smoothly when network coverage is unreliable. Also, unlike native apps, no installation is required, but they are faster than typical web apps"

Serverless REST API with Angular, Persistence and Security (opens new window)
"In this post I’ll show you how you can quickly build a serverless full stack app with static file hosting, a secure REST API, and a robust persistence layer."

Creating a Modal Dialog in Angular 8 with TypeScript (opens new window)
"There are plenty of plugins and libraries out there that include modal windows, in the past I used them myself when I needed to add a modal to a new project."

Implementing a Angular project with AspNet Core (opens new window)
"This article will help us understand how to use the .NET Core command line interface to create and run an ASP.NET Core web application."

Build A Real World Beautiful Web APP with Angular 8 — A to Z (opens new window)
"Today I am going to show you how to build a real world beautiful weather app that is production ready from scratch starting from design to development all the way to deployment using Adobe XD, Angular 7 & Firebase!"

# Authentication with Angular


Angular Authentication Tutorial for Beginners (opens new window)
"Angular Authentication Tutorial for Beginners: Learn the basic concepts that you will need to authenticate angular applications using JWT."

How to Add Authentication to Your Angular Application (opens new window)
"...While building a SPA, the developer, sooner or later, needs to think about authentication and authorization. Authentication usually requires a login page that can verify that a user is who he or she claims to be..."

Create Simple Login Page using Angular 8 and HTTP Authentication (opens new window)
"In this article, you'll learn how to setup a simple login page using Angular 8-9 and Basic HTTP authentication"

Login in with Facebook and Google in an apps using Angular 8 (opens new window)
"In this post, we will learn the step-by-step process of allowing users to log in to an application with Facebook and Gmail using Angular 8. Login with Facebook and Google makes it safe and easy for users to use applications."

# Angular Best Practices and Tips


Angular Universal (opens new window)
"The Angular Universal project is a community driven project to expand on the core APIs from Angular (platform-server) to enable developers to do server side rendering of Angular applications in a variety of scenarios."

Best practices for a clean and performant Angular application (opens new window)
"This article outlines the practices we use in our application and is related to Angular, Typescript, RxJs and @ngrx/store"

How to Create Angular Schematics for Developers (opens new window)
"Angular CLI is a command-line tool that creates a simple Angular project. Angular CLI asks you questions about your app and, based on your answers, it determines the routing and the stylesheet format. How does Angular CLI do this? It uses Schematics."

A complete Guide to the Angular CLI (opens new window)
"The experience provided by a graphical user interface or GUI is considered to be interactive but plagued with performance issues. This has lead to people who prefer performance over visuals, to use a command-line interface or a CLI. In this article, we will be discussing the command line interface that comes along with Angular, i.e the angular-CLI."

Exploring Angular Lifecycle Hooks - OnChanges (opens new window)
"Welcome back to our blog series, Exploring Angular Lifecycle Hooks!"

Are You Ready For Angular 9? (opens new window)
"The Angular 9 RC is out, what an exciting time to be Angular developer, no I am not saying this because of Angular 9 RC release. It's because Ivy is here, Ivy is now the default rendering engine in Angular."

Debugging Memory Leaks in Angular (opens new window)
"Building large applications entails writing lots of code, complex pages, long lists, and hundreds (if not more) of components. If you’ve worked at least once in a non-trivial web application, you may have found yourself battling a memory leak for hours and hours."

Angular 8 | Build Autocomplete Mode with Angular Materials (opens new window)
"Today we are going to create Autocomplete in Angular 8 using Angular Material UI components."

Using CSS Grid Layout in Angular project (opens new window)
"This CSS Grid layout tutorial is designed for Angular 7/8 developers that want to learn how to build responsive layouts with modern CSS."

How to Create Angular Toastr Notifications (opens new window)
"Create an Angular service called notification , which you'll use in your application for showing the toastr message. In src/app create a folder called utility . Navigate to the utility folder and create an Angular service."

# Chrome browser extensions


Angular Augury (opens new window)
"A Chrome and Firefox Dev Tools extension for debugging Angular applications"

Angular state inspector (opens new window)
"Helps you debug Angular component state"

# Testing Mobile Apps


Test Driven Development with Angular (opens new window)
"In this video, you will learn the basics of test-driven development while building a simple Angular web application."

# Angular resources on YouTube


Angular Node Express MongoDB MEAN Tutorial for Beginners (opens new window)
"In this video, Angular Node Express MongoDB MEAN Tutorial for Beginners, Udemy instructor Maximilian Schwarzmüller will teach you how to connect your Angular Frontend to a NodeJS & Express & MongoDB Backend by building a real Application."

Sharing Data between Components in Angular (opens new window)
"Sharing Data between Components in Angular. In this episode, I am going to show you four different ways to share data between Angular components"

Learn Angular 8 from Scratch for Beginners - Crash Course (opens new window)
"Angular 8 is out now, and for those who prefer to learn a framework with the current latest version, this tutorial is for you"

Google Maps in Angular (opens new window)
"Google maps meet Angular. Having such a strong developer community and being used by thousands of developers around the world made Angular ideal for bringing most tools to the framework"

# References


Comments