How I contributed to Angular Components

How I contributed to Angular Components

In this post, I want to share my experience and lessons learned contributing to @angular/components and collaborating with the team at Google maintaining it. As an engineer at Infragistics, among other things, I am responsible for developing and maintaining our IgxOverlayService.

In this post, I want to share my experience and lessons learned contributing to @angular/components and collaborating with the team at Google maintaining it. As an engineer at Infragistics, among other things, I am responsible for developing and maintaining our IgxOverlayService. It allows rendering of an Angular component or an ElementRef overlaying other content in an app. Think dialogs, drop downs, tooltips and so on.

Several months ago I looked at Angular Components CDK (Component Dev Kit) — a set of tools that implement common interaction patterns whilst being un-opinionated about their presentation. It represents an abstraction of the core functionalities found in the Angular Material library, without any styling specific to Material Design. Think of the CDK as a blank state of well-tested functionality upon which you can develop your own bespoke components. One of the abstractions that it provides is an overlay service. This service has very similar functionality to the one I am responsible for in our product. Angular Components Overlay service also allows rendering of an Angular component or template overlaying other content in an app. This service looked like a good fit. Instead of implementing our own services I decided that we could use the ones provided by CDK. I started investigating if the CDK overlay is feature complete for our requirements.

Getting Started

I had a meeting with the management at Infragistics to discuss the possibility of switching from our IgxOverlayService to the Angular Components SDK Overlay. We decided that if we switched to the Angular overlay service we would have less code to maintain and we would be able to contribute to Angular Components open source project. Finally, the decision was made to try to switch to SDK Overlay. To make the switch happen developers at Infragistics were given the possibility to spend several hours a day contributing to Angular Components.

As a first step, I forked the repository, built the packages, ran the dev-app, and started looking at the contribution process and the standards that the Angular Components team follows. As soon as I felt more comfortable with the code I started looking at the issues in Material Components public repository on GitHub. If you want to contribute this is a nice first step to take along with helping with the documentation. Here’s a strategy for you to get started:

  • Look at the issues.
  • Grab one.
  • Try to solve it.

The more issues you go through the more familiar you get with the code and the way components are developed and work. Before contributing it’s important to look at “Contributing to Angular Material” guidelines. They will help you avoid common pitfalls when getting started with open source.

Photo by Alex Shutin on Unsplash

open-source contribute angula

Bootstrap 5 Complete Course with Examples

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Building a simple Applications with Vue 3

Deno Crash Course: Explore Deno and Create a full REST API with Deno

How to Build a Real-time Chat App with Deno and WebSockets

Convert HTML to Markdown Online

HTML entity encoder decoder Online

An Open-Source Book About the Open Source World

Open source today is a word that often include a lot of things, such as open knowledge (Wikimedia projects), open hardware (Arduino, Raspberry Pi), open formats (ODT/ODS/ODP) and so on.

Hacktoberfest 2020: Let’s Get Hacking

It's October and we're calling all programmers, designers, content writers and open-source contributors to join Hacktoberfest 2020. This is a fantastic opportunity to contribute to open-source or try your hand at something new.

What Is Open Source and How to Start Contributing

The world today is more democratic for those who want or need to use computers, more precisely those who need to make use of computer programs. But this was not always the case, and in part what made access to the computer world something a little simpler or less expensive was open source or open source software. But what exactly is it?

Did Google Open Sourcing Kubernetes Backfired?

With Google not owning the trademarks or control for Kubernetes, it also provided a competitive edge to AWS, Microsoft, IBM etc.

My First Open Source Contribution

How I got involved in open source, and how you can too. My First Open Source Contribution. Open source is a great way to get real-world software development experience from the comfort of your home. The open-source community is very helpful and encourages new developers to take part in their organizations. You gain exposure, test your skills, gain knowledge, and bond with the community to produce quality code that helps people around the world. You write code that benefits the user community.