Become an Angular contributor: Where to Start

Michael Prentice | ng-conf | Feb 2019

This is part 1 of a multi-post guide to contributing to Angular open source projects.

There are many personal and professional benefits to contributing to open source software projects. These may include an enhanced learning experience, the emotional feedback of helping a community, or establishing your public profile and building a reputation.

If you have attended ng-conf (or another Angular Community Conference) or have spoken to a past attendee, you may have seen or heard about the amazing, inclusive Angular community. You may have felt a desire to get more involved or to help give back to the community. This series of posts will help you do that while reducing some of the unknowns and concerns that many new contributors first encounter.

What and Where?

The first issue that many new contributors run into is that they have a desire to help, but they don’t know where to start.

When a new contributor looks at the Angular organization on GitHub, it can be a bit intimidating. There are 189 repositories that span AngularJS (version 1.x), Angular (version 2+), Testing, Builds, Tooling, Documentation, and Components.

Throughout this series of posts, we’re going to break this down and disambiguate these repositories… In this first post, we’ll provide focus on the core Angular Framework repository and its related packages. In future posts, we’ll cover the Angular CLI, Material Components, and provide details about some of the ancillary repositories and naming patterns.

Contributing to Angular (original background, foreground)

The angular/angular Repository

URL: github.com/angular/angular

Description

This repository hosts the Angular Framework, its core packages, and documentation.

The core packages are found in the [packages/ directory](https://github.com/angular/angular/tree/master/packages) and they include:

animations

Code related to animating HTML elements using CSS. Guide

bazel

Code related to building Angular using the open source Bazel build system

benchpress

Code related to End-to-End Performance testing of Angular using benchmarking. Guide

common

Code related to common pipes (JSON, date, async, etc.), directives (*ngIf, *ngFor, ngStyle, ngPlural, etc.), location and path strategies, and internationalization (localization, date/number/currency formatting, etc.)

compiler-cli

Code related to the ngcc and ngtsc compiler Command Line Interfaces (CLIs)

compiler

Code related to the Angular compiler including Ahead of Time (AOT), Just In Time (JIT), internationalization, parsers (templates, expressions, CSS), the view compiler, and compiler utilities

core

Code related to Change Detection, Dependency Injection, renderers, the linker, sanitization, metadata, and the View

elements

Code related to packaging Angular components as Custom Elements. Guide

forms

Code related to integrating Angular with Forms using a template-based or Reactive style. Guide

http

Code related to integrating Angular applications with backend APIs using the HTTP protocol. Guide

language-service

Code related to the Angular Language Service which provides enhanced support for editors that provide code completion, error highlighting, hints, and code navigation. Guide

platform-*

Code related to specific platforms that Angular supports including Server Side Rendering (server), web browsers (browser, browser-dynamic), and Web Workers (webworker, webworker-dynamic)

router

Code related to the Angular Router. Guide

service-worker

Code related to using Service Workers with Angular. Guide

upgrade

Code related to upgrading or downgrading modules to migrate from AngularJS to Angular. Guide

Documentation

Additionally, this repository hosts the code for the primary documentation site: angular.io (abbreviated aio in the repository). If you want to help with the documentation, you’ll need to follow the AIO Developer Guide.

Contribution Guide

The Angular Contribution Guide covers a lot of topics including where to submit questions, where to submit bugs, how to submit feature requests, how to create pull requests, and how to join the live community chat for real-time help. It also covers coding standards, Git commit message guidelines, and details about signing a Contributor License Agreement (CLA).

Additionally, you can join or participate in the Angular mailing list via Google Groups. The mailing list is a good place to ask questions that you might have before submitting a bug or feature request.

Help with new issues

Contribution is not only about making source code updates. One great way to start contributing is to comment on newly reported issues that you are knowledgeable about. This includes helping provide reproductions on StackBlitz or debugging someone’s problem locally to see if you can reproduce it. It may also include doing some research and reviewing the API docs to see if the issue reported is using the API properly and if it has the proper syntax. If you aren’t ready to start fixing bugs or updating docs, this is a great way to learn while contributing to the community.

Help with pull request reviews

If you are an experienced developer or if you want to move beyond helping others with issues, you can help by reviewing pull requests. In many cases, it is helpful just to politely ask someone to explain why they took a specific approach. Sometimes when a pull request author explains their approach to a reviewer, they realize that there is a better way that they had previously not considered. Other times they realize that they did not consider certain edge cases. The pull request author’s responses and discussion can help you learn more about the project and better equip you for making source code contributions.

If you have questions about any of these topics, please leave a comment and I will do my best to provide an answer for you.

Good First Issues

You can find issues that are good for new contributors here. These issues are generally limited in scope and have better guidance and instructions than a standard issue.

If you have questions or concerns about one of these issues, please post it as a comment on the issue. Please note that there are no stupid questions here. If you need help or guidance, please post a comment to ask for it. This is what these issues are designed for.

Note that some questions, that require a significant amount of effort to address, may receive a response that directs you to a specific educational resource. This may be a blog post, Markdown document, Podcast, etc.

Code of Conduct

Please note that the Angular Code of Conduct applies to all interactions within the Angular community. This includes public and private communications between Angular community members. The following are some examples of where you should follow the Code of Conduct: GitHub, Gitter, IRC, mailing lists, Twitter, Conferences, Podcasts, instant messaging, face to face communications, conference calls, interviews, press releases, website and blog content, etc. Any questions or violations should be sent to [e-mail].

Developer Guide

The Angular Developer Guide includes details about prerequisites, getting the source code, installing dependencies, building the Angular framework, and running tests locally.

Next steps

I plan to similarly document contributing to the Angular Command Line Interface (CLI), Angular Component Dev Kit (CDK), and the Angular Material Components.

I also plan to dig into some of the details based upon feedback and what questions are raised by the community. This is especially true for the Developer Guide, but I’m waiting for a few of my PRs, that help smooth some rough edges, to land.

Subscribe to the ng-conf publication to be notified of those updates.