Compare this to any admin template from WrapBootstrap and you know why this is at the top.
If you look at a WrapBootstrap template, it generally looks nice -- but as soon as you look at the code, your opinion will change. They literally include any popular JavaScript library that exists, just to show off what's possible. And the code is not well-written, either. 70 HTTP requests and 5MB resources to load is the new normal there.
This one here, in contrast, is clean, polished, and shines due to its simplicity.
However, the html offers a couple of great chances to use angular directives or some databinding. Especially the custom directives offer a great way to show the semantics or the intent of what the page is all about, so that in the end the dashboard could read somthing like:
Hey, I'm the author of this and never knew this was posted on here.
I'm really a backend developer so my knowledge of Angular really isn't that great. I'll look into what you suggested, however I didn't want it to be too complex; quick and simple way to get up and running was the idea.
My other criticism is that it should avoid adding ngCookies as a requirement, as it is a not so great portion of angular.
I think some of the people criticizing this miss the point of something like this. It is a theme that is geared specifically towards people who use Angular & don't want to use jQuery. If you don't use Angular/want to use Angular, this isn't for you - or you can fork it and port it over.
Hey, thanks for the suggestions appreciated.
I'll dig into the width and apply areas, my JS isn't my strongest area so the implementation came from a "what works" situation.
Thought I'd leave this here. I'm Elliot (owner of the repo).
The dashboard isn't intended to be driven by Angular, it's more of a basis of getting going on a project without messing about with the initial setup - however have a 'clean' boilerplate to work with without the masses of plugins all of these premium dashboards come with.
I'm also not a pro coder, and do it for a hobby so comments on improving are much appreciated. It's free, open source, I'm massively open to people improving my code so if you can please do. I'm currently learning Angular so appreciate it may not be coded to a specific standard I don't know about.
While this looks good aesthetically, this is a prime example of needlessly using JavaScript for the hell of it. This is like an anti best practice. It loads 4 extra resources (Angular, Angular Cookie, Angular UI Bootstrap and the custom bootstrap.js) for no legitimate reason. And the CSS is inexplicably written using selectors like the following: "#page-wrapper:not(.active)". Why not target "#page-wrapper" and then "#page-wrapper.active" instead?
Your CSS quibble is a matter of taste, you have a legitimate complaint about the JS so I wouldn't muddy it with a taste based comment about CSS verbosity.
I found this in the readme (there's also a jQuery branch, too, apparently):
"AngularJS is simply being used to power the sidebar toggle (side in and out). It does a combination of detecting the browser size and managing a toggle cookie to keep the state the same when the page is reloaded. Check out the js/angular/bootstrap.js file."
It's responsive for me in FF 31 (OS X) and in Chrome. When the window size is reduced, the content boxes reflow from multi-column to single-column, and the navigation on the left goes from text+icon to icon only.
Not to criticize this project specifically but I was task some weeks ago to implement a design with a unfoldable menu like that.
Clueless manager loved it (yeah animation !) but it's not great. In practice you never want to unfold it because it doesn't give you anything other than labels. So then you are asked to display labels on mouse hover when it's folded.
Not at all. I know what you mean, however a tooltip is easy to add to the labels - issue is this won't solve the issue for mobile devices.
As for sub-menus, I never needed it for my project so never added it... and honestly didn't expect anyone else to see this. Will have a tinker with it though, see if I can make it look decent.
Not a dumb question. Responsive design is a modern web development technique for building sites that adapt to the screen on which they are being viewed. The idea is to provide a good user experience on mobile, desktop, and tablet with only a single web site (as opposed to detecting mobile/tablet devices and redirecting to a mobile-only version).
To see it in action, go to the link in the OP and just resize your browser window down to tablet size, and then down to mobile.
This is accomplished primarily through CSS3 media queries and fluid layouts (using percentages for element widths instead of fixed widths). You can read about CSS3 media queries here:
I agree it looks fine (though it's not exactly April Zero...), but I think the comments below legitimately address some of the issues with the JavaScript (60 or so poorly formatted lines, using Angular for no reason at all) and the CSS - and probably people are confused as to why this frankly somewhat amateurish project is currently at the top of HN.
From the title, I think you'd expect something that's cleverly using Angular to pull in data dynamically from disparate sources and plotting pretty charts from it, rather than just some static HTML and CSS.
>people are confused as to why this frankly somewhat amateurish project is currently at the top of HN.
Probably the GP's irritation comes from the same place as mine: needlessly abrasive remarks instead of encouragement and constructive criticism that a community like this should provide.
And why do people care so much that this is at the top of HN, as opposed to the bottom?
>I think you'd expect something that's cleverly using Angular to pull in data dynamically from disparate sources and plotting pretty charts from it,
That part is relatively easy to add, given the nice template this provides. Really, for me, creating this kind of layout is the time-consuming part. Pulling in data from some REST api is a relatively quick task.
> And why do people care so much that this is at the top of HN, as opposed to the bottom?
Well, there are only so many hours in the day, and it's nice to see exciting and innovative projects (and articles) gravitate towards the top - that is, surely, how HN is supposed to work.
Well it is at the top. It's obvious that this is representative of the interests of HN, otherwise it wouldn't be there. Sorry it doesn't meet your standards.
You mention it being amateurish. A constructive response would be to take it, pull in some REST data and show everyone whats possible. Or you could just complain.
Any links to your frankly great professional projects?
This project is better than lots of dashboards I've seen, even for quite celebrated companies. And don't get me started on freakishly expensive enterprise services dashboards...
From the title, I think you'd expect something that's cleverly
using Angular to pull in data dynamically from disparate
sources and plotting pretty charts from it, rather than just
some static HTML and CSS.
There's nothing to suggest the creator submitted the link - and Hacker News enforces the dumb <title> rule - so I don't see why that's a reason to get pissy in the comments.
We all have some random crap lying around on GitHub, and anyone can submit it arbitrarily one day. That still does not excuse the absurd mentality here from people who seem to never have made nor submitted anything of their own, since they don't know how obnoxious it is to read comments like these for your own project.
+ + +
this frankly somewhat amateurish project
You are such an asshole for writing this. I rest my case.
I'm happy this project is at the top of Hacker News; it means there's a silent majority who are not represented by the people behind the comments on this thread.
No need to apologise. Honestly, relax - it's Sunday, go spend some time with your friends and family instead of worrying about other people on the Internet. It's all going to be fine, I promise.
If you look at a WrapBootstrap template, it generally looks nice -- but as soon as you look at the code, your opinion will change. They literally include any popular JavaScript library that exists, just to show off what's possible. And the code is not well-written, either. 70 HTTP requests and 5MB resources to load is the new normal there.
This one here, in contrast, is clean, polished, and shines due to its simplicity.