Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Comparison to other Angular starters. Path to convergence. #252

Open
dancancro opened this issue Feb 18, 2017 · 6 comments
Open

Comparison to other Angular starters. Path to convergence. #252

dancancro opened this issue Feb 18, 2017 · 6 comments

Comments

@dancancro
Copy link

dancancro commented Feb 18, 2017

This is a great project!

I have started adding the facts about this project to my collection and created the following work-in-progress comparison between it and some others. Now I'm looking for some help from you who know this project best. The goal is to help people choose among alternatives and also clarify a path to convergence. Now that the Angular-CLI project has provided access to webpack.config.js, this seems like a great time to start thinking about working together.

Once all the facts are in, we can talk about which things to add from which projects to which projects so that at the end of the day there are fewer, better choices.

If you would like to contribute what you know, please go here to get access to the database. All you need to do is scan through a Google Sheet and indicate which benefits this project provides.

Developer Experience great big angular2 example Angular-kitchen-sink angular-seed-advanced angular-webpack2-starter
Authentication X X
Authentication, with two-factor authentication UNIQUE
Can run on a desktop without a browser UNIQUE
Code coverage reporting (?) X X
Command line interface (CLI) X X
Compiled, supports ahead of time (AOT) compilation X X
Components communicate with events X X
Core Module X X
CSS style checking UNIQUE
Deployment automation, to a mobile native executable UNIQUE
Deployment automation, using Docker (?) X X
Deployment automation, using Heroku (?) UNIQUE
Error handling, Client-side logging X X
Hot Module Replacement (?) UNIQUE
In-memory server-side database UNIQUE
Local storage X X
No pluralization UNIQUE
Production build, generate docs (?) X X
Renders markup on the server (universal) (?) UNIQUE
Separation of smart containers and dumb components (?) UNIQUE
Server-side integration & unit tests X X
Shared Module X X
Single source of truth, central state management, without lots of boilerplate (?) UNIQUE
Style guide for code (?) X X
Update generated code in an existing app UNIQUE
User Experience great big angular2 example Angular-kitchen-sink angular-seed-advanced angular-webpack2-starter
Account Management, Forgotten Password with Resetting UNIQUE
Account Management, login/logout X X
Analytics UNIQUE
Asynchronously loaded data example X X X
Breadcrumbs (?) UNIQUE
Derived, computed properties X X
Dynamic component creation UNIQUE
External, 3rd party, API interaction X X
Footer UNIQUE
Full-stack CRUD (?) X X
Full-stack CRUD, with Create, Update and Delete X X
Full-stack CRUD, with Create, Update and Delete, individual records X X
Full-stack CRUD, with Create, Update and Delete, whole data structures UNIQUE
Full-stack CRUD, with Read X X
i18n, localization (?) UNIQUE
Many-to-many data UNIQUE
Mouse wheel (?) UNIQUE
Navigation bar X X
Panels, draggable X X
Responsive styles UNIQUE
Search, actually works with backend API UNIQUE
Dependencies great big angular2 example Angular-kitchen-sink angular-seed-advanced angular-webpack2-starter
Backend Frameworks Express Express Express
Client-side API interfaces @angular/http @angular/http @angular/http @angular/http
Continuous integration testers Travis Travis
Convenience method libraries lodash lodash lodash
Databases Redis
Documentation generators typedoc typedoc
Frontend Frameworks Angular 2.0 Angular 2.0 Angular 2.0 Angular 2.0
Languages JS ES5, JS ES6 (ES2015), JSX (opt), Typescript JS ES5, JS ES6 (ES2015), Typescript JS ES2016, JS ES5, JS ES6 (ES2015), Typescript JS ES5, JS ES6 (ES2015), Typescript
Linters codelyzer, ESLint, stylelint, tslint codelyzer, tslint tslint
Loaders/Bundlers Webpack Webpack Rollup, SystemJS Webpack
Misc Angular Style Guide, Helmet, nodemon, Redux, redux-devtools, RxJS Immutable, Redux, redux-devtools, RxJS Angular Style Guide, cssnano, Electron, Redux, redux-devtools, RxJS nodemon, Redux, redux-devtools, RxJS
Package Managers npm npm npm npm, Yarn (opt)
Routers Angular Component Router Angular Component Router Angular Component Router Angular Component Router
Runtime Environments Node Node NativeScript, Node Node
Stacks angular-cli angular-cli mgechev's angular-seed
State Managers ngrx ng2-redux ngrx ngrx
Task Runners Gulp Gulp
Test assertion libraries Chai, Jasmine, Mocha Chai, Jasmine, Mocha Jasmine Jasmine
Test coverage reporters Istanbul
Test runners Karma BrowserSync (opt), Karma Karma
Transpilers libsass libsass libsass
Widget collections Angular Material Angular Material Angular Material

EDIT: Added "Renders markup on the server" as the benefit of Angular Universal delivered by angular-webpack2-starter

EDIT: Added State Managers dependencies section for ngrx and ng2-redux

@Tuizi
Copy link
Contributor

Tuizi commented Feb 18, 2017

Very good post! A row missing is a row about the support of Angular Universal

@Matmo10
Copy link

Matmo10 commented Feb 18, 2017

I think https://github.com/AngularClass/angular2-webpack-starter might be worth adding

@dancancro
Copy link
Author

@Matmo10 Thanks. I don't have any info about that one yet, but you are welcome to fill in the details about it if you know it. Just go here and request access to the Google Sheet.

Here's a good list of other ones too.
https://www.reddit.com/r/Angular2/comments/5rj14a/helpful_angular_2_github_repos_curated_through/

@Waterstraal
Copy link

@dancancro Maybe you could add a row about @ngrx/store and @ngrx/effects integration? That's a big feature imho.

@dancancro
Copy link
Author

@Waterstraal I added the State Managers row to the dependencies section.

The database contains thousands of possible technology selling points and I give each one an importance weight based on my imperfect judgement.

To keep the above report to a reasonable size, the way it works is that it filters out benefits whose importance score is below a certain threshold and benefits that are delivered by all of the contestants in the report. In this case the benefit delivered by ngrx, "immutable state", is important but also delivered by all of the projects. So it doesn't appear in the table. However the dependencies part includes every project dependency (that I have in the db) even if all the options have it.

Now, if you know of something that's both important and delivered by ngrx but not ng2-redux, then that would show up because one of the options uses ng2-redux and not ngrx. So far I don't know of any salient distinction between them and I wish that they would just converge and make life a little easier. :)

@Waterstraal
Copy link

Waterstraal commented Mar 27, 2017

@dancancro Thank you for this, and your quest for a defacto starter for angular2. I was hoping angular-cli would move into that direction, but I think it would need a plugin system, or custom blue-prints for that to be flexible enough.

And I did not know that all starters have an immutable state solution built in, so that's already something I learned by putting it in the table, and not only the differentiators :).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants