5 ms·

I expected angular.io to be a flashy example Angular 2 SPA and was disappointed when I realized it was just a regular old static HTML website. I guess most of t

I expected angular.io to be a flashy example Angular 2 SPA and was disappointed when I realized it was just a regular old static HTML website. I guess most of the content is more suited for a static site. At least the search bar on the docs page looks like it has some Angular going on. Also it would be neat if the docs had dynamic examples instead of screenshots.

borplk 10y ago
Same. I think it would be a nice statement to make if angular.io itself was an Angular app that was a joy to use.
unknowingone 10y ago
But can it compete with this? https://react-bootstrap.github.io/components.html https://react-bootstrap.github.io/components.html
- Bahamut 10y ago
  I think ultimately ng-bootstrap* (https://ng-bootstrap.github.io/ https://ng-bootstrap.github.io/) will be better, but I'm biased. API signature looks much better than shoehorning everything into components that don't belong there - we have a lot of work to go though, so it currently is still a work in progress. * I am a part of the UI Bootstrap/ng-bootstrap team - we worked on ng-bootstrap starting back in last August/September and have the benefit of two of our team members currently working on the Angular team.
  - winstonewert 10y ago
    Could you elaborate on what you mean by "shoehorning everything into components that don't belong there"?
    - Bahamut 10y ago
      There seems to be a lot of advocacy for tossing everything into the component tree in the React ecosystem - recently I got linked to a snide remark by Ryan Florence on Twitter implicitly arguing for putting everything in the component tree, including constructs that should have a better separation such as routing (which the tweet appeared to be a reference to). Some services don't belong in JSX though - this is why you have the idea of stores in Flux/Redux/etc. Some data doesn't make sense to couple to the component hierarchy - doing so makes it very easy to create dependencies on the component tree, which decreases modularity, as well as has perf ramifications by increasing the DOM elements that get rendered unnecessarily by React. Some examples are data models, routing, and interactions with non-element DOM api (window.location, XHR, etc.). This also has a side-effect of increasing difficulty of testing what generally should be vanilla constructs not tied to various frameworks/libraries unnecessarily.
      - unknowingone 10y ago
        From a purely pragmatic point of view, I can say that I write very little code when using react-bootstrap, can create screens quickly and the results look good. Not sure how much simpler of an API you can get. But to each their own. +1 to choice.
        Bahamut 10y ago
        It's not about just simple - it's about making the right architectural choices that don't come back to bite you due to the need to make a change that brings down a house of cards from a library perspective. ng-bootstrap avoids problematic apis such as component-based modals, and makes use of the much more natural service-based approach to allow developers maximum flexibility. If a developer prefers a component-based modal, a developer can very easily build a lightweight component on top of it. However, having poor design built into such a third party library that is meant to be used for a large variety of cases is a terrible experience for developers, speaking as a consumer and as a library maintainer. Extensibility is the key here, and we maximize for that while keeping the library as small as possible - bloat is bad, and that shouldn't be the default in general.
    - unknowingone 10y ago
      Compare for yourself: https://react-bootstrap.github.io/components.html#btn-dropdowns-single https://react-bootstrap.github.io/components.html#btn-dropdo... (click on show code) vs https://ng-bootstrap.github.io/#/components/dropdown https://ng-bootstrap.github.io/#/components/dropdown (click on <>)
      - winstonewert 10y ago
        I don't understand the distinction you are trying to draw. Both examples seem to put the same configuration in the component tree.
- __derek__ 10y ago
  Opening that link in a new tab beach-balled Firefox for a few seconds. Woof.
  - unknowingone 10y ago
    Yeah it takes 2 seconds to render on my laptop. It's showing docs and examples of every component on a single page. It's convenient to use as a reference when programming. You probably wouldn't code your app like that.
- arc_of_descent 10y ago
  I'm currently developing a mobile app using React (web, not native). And I'm using the regular bootstrap. What advantage does react-bootstrap have? I seriously don't want to learn a new framework.
alxhub 10y ago
It actually is an Angular 1 app, for a very simple reason: when the docs site was started, Angular2 wasn't fully usable yet! There is an effort underway to rewrite it in Angular2, so it will be eventually.
robwormald 10y ago
We're all going to get a couple of nights sleep, but that project is in progress and should be out soon. We're making sure it shows off the best of ng2.
mstijak 10y ago
May I ask if you have seen yesterday's post about Cx and what do you think about it? Cx documentation is written using Cx and it offers plenty of interactive examples and code snippets. https://cx.codaxy.com/docs/widgets/grids https://cx.codaxy.com/docs/widgets/grids Disclaimer: I'm the author of Cx.

borplk 10y ago

Same. I think it would be a nice statement to make if angular.io itself was an Angular app that was a joy to use.

unknowingone 10y ago

But can it compete with this? https://react-bootstrap.github.io/components.html https://react-bootstrap.github.io/components.html

Bahamut 10y ago
I think ultimately ng-bootstrap* (https://ng-bootstrap.github.io/ https://ng-bootstrap.github.io/) will be better, but I'm biased. API signature looks much better than shoehorning everything into components that don't belong there - we have a lot of work to go though, so it currently is still a work in progress. * I am a part of the UI Bootstrap/ng-bootstrap team - we worked on ng-bootstrap starting back in last August/September and have the benefit of two of our team members currently working on the Angular team.
- winstonewert 10y ago
  Could you elaborate on what you mean by "shoehorning everything into components that don't belong there"?
  - Bahamut 10y ago
    There seems to be a lot of advocacy for tossing everything into the component tree in the React ecosystem - recently I got linked to a snide remark by Ryan Florence on Twitter implicitly arguing for putting everything in the component tree, including constructs that should have a better separation such as routing (which the tweet appeared to be a reference to). Some services don't belong in JSX though - this is why you have the idea of stores in Flux/Redux/etc. Some data doesn't make sense to couple to the component hierarchy - doing so makes it very easy to create dependencies on the component tree, which decreases modularity, as well as has perf ramifications by increasing the DOM elements that get rendered unnecessarily by React. Some examples are data models, routing, and interactions with non-element DOM api (window.location, XHR, etc.). This also has a side-effect of increasing difficulty of testing what generally should be vanilla constructs not tied to various frameworks/libraries unnecessarily.
    - unknowingone 10y ago
      From a purely pragmatic point of view, I can say that I write very little code when using react-bootstrap, can create screens quickly and the results look good. Not sure how much simpler of an API you can get. But to each their own. +1 to choice.
      - Bahamut 10y ago
        It's not about just simple - it's about making the right architectural choices that don't come back to bite you due to the need to make a change that brings down a house of cards from a library perspective. ng-bootstrap avoids problematic apis such as component-based modals, and makes use of the much more natural service-based approach to allow developers maximum flexibility. If a developer prefers a component-based modal, a developer can very easily build a lightweight component on top of it. However, having poor design built into such a third party library that is meant to be used for a large variety of cases is a terrible experience for developers, speaking as a consumer and as a library maintainer. Extensibility is the key here, and we maximize for that while keeping the library as small as possible - bloat is bad, and that shouldn't be the default in general.
  - unknowingone 10y ago
    Compare for yourself: https://react-bootstrap.github.io/components.html#btn-dropdowns-single https://react-bootstrap.github.io/components.html#btn-dropdo... (click on show code) vs https://ng-bootstrap.github.io/#/components/dropdown https://ng-bootstrap.github.io/#/components/dropdown (click on <>)
    - winstonewert 10y ago
      I don't understand the distinction you are trying to draw. Both examples seem to put the same configuration in the component tree.
__derek__ 10y ago
Opening that link in a new tab beach-balled Firefox for a few seconds. Woof.
- unknowingone 10y ago
  Yeah it takes 2 seconds to render on my laptop. It's showing docs and examples of every component on a single page. It's convenient to use as a reference when programming. You probably wouldn't code your app like that.
arc_of_descent 10y ago
I'm currently developing a mobile app using React (web, not native). And I'm using the regular bootstrap. What advantage does react-bootstrap have? I seriously don't want to learn a new framework.

alxhub 10y ago

It actually is an Angular 1 app, for a very simple reason: when the docs site was started, Angular2 wasn't fully usable yet! There is an effort underway to rewrite it in Angular2, so it will be eventually.

robwormald 10y ago

We're all going to get a couple of nights sleep, but that project is in progress and should be out soon. We're making sure it shows off the best of ng2.

mstijak 10y ago

May I ask if you have seen yesterday's post about Cx and what do you think about it? Cx documentation is written using Cx and it offers plenty of interactive examples and code snippets. https://cx.codaxy.com/docs/widgets/grids https://cx.codaxy.com/docs/widgets/grids Disclaimer: I'm the author of Cx.