Tales Of An Open Source Library

Adam KleinCTO @ 500Tech

MAKE A POINT

https://angular2-tree.readme.io/

MVPCustomizable & Extendible

MVPCustomizable & Extendible

Listenable

MVPCustomizable & Extendible

Listenable

API

MVPCustomizable & Extendible

Listenable

API

Killer Feature - Keyboard Navigation

A year later…

222 stars

87 forks

187 github issues

80 support tickets

29 pull requests

Version 3.2.3Async Data

Drag & Drop

Filter

Virtual Scroll

Integration tests

And more…

TIPS FOR THE OPEN SOURCERER

LIBRARY

SystemJS

Webpack

UMDTree Shaking

AoT Typescript

http://blog.mgechev.com/2016/06/26/tree-shaking-angular2-production-build-rollup-javascript/

Read This

import { TreeModule } from ‘angular-tree-component’

Typescript• components\

• tree.component.ts • tree-node.component.ts

• models\ • tree.model.ts

• components\ • tree.component.js • tree-node.component.js

• models\ • tree.model.js

Typescript• components\

• tree.component.ts • tree-node.component.ts

• models\ • tree.model.ts

• components\ • tree.component.js • tree.component.d.ts • tree-node.component.js • tree-node.component.d.ts

• models\ • tree.model.js • tree.model.d.ts

Webpack• components\

• tree.component.ts • tree-node.component.ts

• models\ • tree.model.ts

• components\ • tree.component.js • tree.component.d.ts • tree-node.component.js • tree-node.component.d.ts

• models\ • tree.model.js • tree.model.d.ts

SystemJS

SystemJSrollup

SystemJSrollup

bundle vendors

SystemJSrollup

bundle vendors

tree shaking

SystemJSrollup

bundle vendors

tree shaking

UMD

SystemJS• components\

• tree.component.js • tree.component.d.ts • tree-node.component.js • tree-node.component.d.ts

• models\ • tree.model.js • tree.model.d.ts

• angular-tree-component.umd.js

AoTngc

metadata.json

VersioningSemVer

MAKE A POINT

VersioningSemVer

Backwards Compatibility & Deprecation

VersioningSemVer

Backwards Compatibility & Deprecation

Doc versions

readme.io

VersioningSemVer

Backwards Compatibility & Deprecation

Doc versions

Changelog

OH THE ISSUES….

SOME KIND WORDS

“I saw your project named angular2-tree-component and got happy. I guess you are the first one who

developed a tree-view component with latest angular2 version. Congratulations!”

“Hi Adam, Thanks for the awesome tree menu. It's great

and easy to use.“

“Hey, Nice work done on the tree component!”

CALL FOR CONTRIBUTORS

slidehare.net/500tech

@adamklein500

Thank You