Angular: Everything You Need to Know [Tutorials]

DZone 's Guide to

Angular: Everything You Need to Know [Tutorials]

A compendium of great DZone articles that explain what Angular is and how to develop software with every Angular framework yet released (AngularJS-Angular 8).

· Web Dev Zone ·
Free Resource

Since its initial release as AngularJS in 2010, Google's Angular framework has become one of the most popular means for building front-end web applications. Now on Angular 8, this powerful framework allows developers to build browser-based applications and mobile apps using the TypeScript langauge.

With different applications and dev teams across the globe using different versions of Angular, we've compiled the best articles and tutorials on DZone about each version of this popular framework. So, no matter what version of Angular your team uses, you're sure to find something here to help you up your Angular game.

What Is Angular?

  1. React vs. Angular. Vue.js: A Complete Comparison Guide by Ankit Kumar. A comparative look at the three most popular front-end web development frameworks out there, Angular, Vue.js, and and React.js, and when to use each framework.

  2. Fun With Angular: A Quick Overview by John Willoughby. A quick overview of the basics of the Angular framework and TypeScript language, as well as some sample code in TypeScript and Shell to get you started.

  3. Angular Essentials Refcard by Dhanjanay Kumar and Gil Fink. This Refcard will teach you about the essential pieces of Angular and the main concepts behind working with this ever-growing platform for web-based applications through detailed diagrams, example code snippets, and in-depth explanations. You will learn about using TypeScript libraries, component classes, data binding mechanisms, and more.

  4. The Benefits of Angular by Jack Basso. An experienced developer and software industry executive describes the benefits of creating front-end web applications using the AngularJS framework.

  5. Differences Between Angular and React by Uroosa Sehar. A discussion of two of the most popular web development and front-end development technologies, React.js and Angular, and when it's best to use each one.

AngularJS Tutorials

  1. Creating a Simple Web App With Java 8, Spring Boot, and Angular by Ashish Lohia. We look at how to create a simple web app using various technologies such as Java 8, Spring Boot, Angular, Bootstrap CSS, SpringData JPA, REST, and H2.

  2. AngularJS: Different Ways of Using Arrays Filters by Siva Prasad Reddy Katamreddy. A software engineer presents a tutorial on how to work with the AngularJS framework for web application development and how to use array filter in AngularJS.

  3. Tutorial: Why Angular Dropdown Automatically Adds an Empty Value by Amar Srivastava. A web developer gives a tutorial on how to work with dropdown lists in Angular, explaining a peculiarity of Angular and how to work around it in your code.

  4. What Is a Service in Angular and Why Should You Use It? by Devquora Sharad. A software engineer introduces the concept of services in the Angular web development framework and how they work with the other components of Angular.

Angular Tutorials (i.e. Angular 2)

  1. Understanding @Output and EventEmitter in Angular Dhanjanay Kumar. A tutorial of some of the nitty gritty in Angular application development, specifically focusing on how a component can emit an event using Angular directives.
  2. Setting Up Your First Angular 2 Project by Deepa Makhija. If you're new to Angular, or are an experienced web dev looking to add a new tool to your arsenal, read on to learn how to set up a project in Angular.

  3. Angular 2 and Spring Boot: Development Environment Setup for Full Stack Developers by Amit Rathi. How to start a project with only a few full-stack developers, while keeping the environment flexible enough to later introduce Front-End and Server-Side teams.

  4. Data Bind Ratio Button Lists With Angular 2 by Juri Strumpflohner. A developer and architect gives a tutorial on how to use data binding to pull data from radio buttons in an Angular-based web application.

  5. Angular 2: Two Ways to Pass Data by Ajitesh Kumar. A discussion of web application data and a tutorial on two different techniques that can be used to pass data in an Angular 2-based web application's code.

Angular 4 Tutorials

  1. [Note to Self] Debugging Angular 4 Routing by Yohan Liyanage. In this quick tutorial, we offer a great tip on how to easily debug your routing setup in Angular 4 with only a few key strokes. Read on for more details!

  2. Angular 2 vs. Angular: Features, Performance by Nyma Malik. We take a comparative look at Angular 2 and Angular 4 to see what each upgrade brought to the popular framework, and whether upgrading is worth it for you.

  3. Creating Your First Angular 4 App Using Angular IDE by Dmitry Karpenko. We walk you step-by-step through the process of creating an Angular application with the latest iteration of Angular, using the Angular IDE or Webclipse.

  4. .NET Core 2.0, Angular 4, and MySQL Part 1 by Marinko Spasojevic. An introduction to MySQL for web developers, including how to create a MySQL schema, MySQL tables and tables relationships, data scripts, and to insert data.

  5. Angular 4 and .NET Core 2.0 CRUD Operation by Neel Bhatt. We continue to explore the means to develop CRUD operations in a web application based on .NET Core 2.0 for the backend and Angular 4 for the front-end.

Angular 5 Tutorials

  1. Login Page Using Angular Material Design by Manoj Verma. A developer provides a tutorial on creating a login module for a web application using the Angular 5 web development framework and Angular Material Design.

  2. CRUD Operations With ASP.NET Core Using Angular 5 and ADO.NET by Ankit Sharma. A developer shows us how we can use Angular 5 inside ASP.NET Core 2 to create a full stack web application, using both C# and TypeScript to write our app.

  3. How to Preview Blobs With HTTP Post and Angular 5 by Suren Konathala. A software architect gives a brief tutorial on how to use Angular to create an HTTP POST call that will upload an image (or blob) to a basic HTML web page.

  4. Getting Started With Angular 5 Using Visual Studio Code by Ankit Sharma. A tutorial on how to use the popular Visual Studio Code to create a web application that runs on Angular 5 with minimum effort (only 11 lines of TypeScript!).

  5. Browser Push Notification in Angular 5 by Debasis Saha. A brief explanation of the importance and use of push notifications for devs and users, with sample code of enabling a push notification in Angular 5.

Angular 6 Tutorials

  1. Building a Web App Using Spring Boot, Angular 6, and Maven by Swathi Prasad. A web developer gives a tutorial on how to use the poplar technologies Angular 6, Spring Boot, and Maven together to create a basic fullstack web application.

  2. Angular 6: Lifecycle of a Component by Debasis Saha. A developer gives an overview of the most important component lifecycle methods in Angular, explaining the use case for each one and giving example code.

  3. Top 10 Features of Angular 6.0 by Debasis Saha. A developer takes an up-close and personal look at the features of Angular 6, going through the ten new features that benefit weg developers the most.

  4. Material Dashboard Using Angular 6 by Manav Pandya. A developer gives a tutorial on how to use Angular 6 and Material Dashboard's starter component to create dashboards for web applications.

  5. Deploying an Angular 6 Application to Cloud Foundry by Mohammed Sulthan. A software developer provides a tutorial on how to get a basic Angular 6 application up and running, and how to deploy it to the cloud using Cloud Foundry.

Angular 7 Tutorials

  1. Upgrade to Angular 7 in 5 Simple Steps by Rudar Daman Singla. A software developer walks us through the process of upgrading existing Angular applications to make use of the new Angular 7 framework and its benefits.

  2. Creating an Angular 7 App With ASP.NET Core: A Step-by-Step Guide by Neel Bhatt. A web application dev and software developer goes over the newest features of the freshly released Angular 7 framework, giving coding examples along the way.

  3. Angular 7 + Spring Boot Application: Hello World Example by Azlan Shaikh. A developer and architect gives a tutorial on how to create a full-stack web application using Spring Boot on the backend and Angular 7 on the front-end.

  4. Developing a PWA Using Angular 7 by Robert Witkowski. A discussion of Progressive Web Applications, and how to developer a PWA that can work on mobile devices, without internet, using the Angular 7 framework.

  5. Create an Angular 7/ASP.NET Core 2.2 Application and Push it to Azure by Bertrand Thomas. A software developer gives a tutorial on creating a web application using Angular 7 and ASP.NET Core in a DevOps workflow and then deploying it to Azure.

Angular 8 Tutorials

  1. Angular 8 and Kendo UI — Reactive Form Validation by Jason Watmore. In this article, we discuss how to use Angular 8 and Kendo UI in order to create reactive form validation for a web application.

  2. Full-Stack App With Angular 8 and Web API [Video]: Part 1 by Vinay R. In Part 1 of this eight-part video series, we set up our basic environment by introducing Angular 8 and installing Visual Studio and MS SQL Server.

  3. Full-Stack App With Angular 8 and Web API [Video]: Part 2 by Vinay R. We continue with our tutorial on full-stack development with Angular by learning how to use the Web API in our application.

  4. Full-Stack App With Angular 8 and Web API [Video]: Part 3 by Vinay R. We learn how to install several different technologies we'll need, including Node.js and VS Code, Angular 8, Angular Material, and Bootstrap.

  5. Full-Stack App With Angular 8 and Web API [Video]: Part 4 by Vinay R. We continue with our tutorial on full-stack app development by learning how to use Angular components, create navigation menus with Bootstrap, and more.

angular, angular tutorial, angularjs, angularjs tutorials, web dev, what is angular

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}