A list of front end development resources (opens in new tab)

(gist.github.com)

382 pointsgphreak12y ago90 comments

90 comments

Seeing this mess again tells me that there's something fundamentally wrong with the web or at least with the standardized technologies that are supposed to solve the problem of frontend development (namely HTML, CSS and JS).

I think the web really needs a fresh start before I would even consider becoming a web developer (I'm a CS student atm)

williamcotton12y ago

It won't ever get a fresh start, so you might as well jump in now!

Hoffenheimer12y ago

You don't actually mention anything that's wrong with any of the libraries. Most of them seem well written. So why would the web need a fresh start?

andrewflnr12y ago

It's not so much the libraries themselves as the very need for all of them. I'm a fairly new front-end developer (for anything complicated, that is), and the browser as a platform can't help but feel like what it is, some good ideas with a lot of hacks and inconsistent philosophies accreted over time. It's a pain in the butt, even something like a two-column layout without tables. And that's just to get it working in one browser. Then you try your page in Firefox, and maybe it breaks in some obscure way. That's when you start breaking out the libraries, like bootstrap.

Right now, web is the best place for my app to be (assuming I can figure out offline support), but I tear my hair out every time I run into one of these issues. Just the other day I had some bizarre issue where offsetBottom and offsetTop + height were returning contradictory values, or something like that. And that was with jquery helping me. The web platform is cool for what it enables, but stinks for what it makes you do to get there.

3 more replies

bpatrianakos12y ago

I think you're looking at this all wrong. Front end development is not a problem that needs solving. It's already been solved. We have html markup for content, CSS for design, and JavaScript for interactivity. Problem solved. Now within front end development there are a number of other problems that need to be solved and that's why we have these different front end resources. So we can use the tools that solved the problem of getting content on the screen to achieve certain more specific goals. Some of these resources solve the same problem in different ways and some are for niche problems. Either way the fact that these exist shows that front end technologies have done their job well. They're versatile enough to handle a wide range of uses.

Front end tools aren't perfect but that's why they've been iterated upon. And what language doesn't have shortcomings? It's amazing that people have created these tools that are flexible enough to be used in seemingly infinite ways without being too narrowly focused or being all things to all people.

But I think I'm getting ahead of myself. Where's the mess you're talking about? This is a common thing to say among non web devs but I never can get any specifics. If you approach front end development the way you would back end or desktop development you're going to have problems. It's a totally different way of thinking.

andrewflnr12y ago

JavaScript and CSS stink in a lot of ways. CSS is pretty messy if you want to do something slightly weird or complicated, which is a large part of why we have frameworks for grids instead of just being able to write one. It seems you have to do this weird "margin: 0 auto" trick to center things sometimes. Last I heard, the only way to get something vertically centered is to make it a table cell and use "vertical-align: center" or something like that. A lot of the interesting CSS properties are inconsistently supported and/or have vendor prefixes; can you use border-radius yet and expect it to work in the big three browsers? If you want a page that fits in the window with a fixed footer, you have to use JS hacks to make it work (actually I don't think I ever got it right). Just the other day a friend of mine had to do some weird hack where he detected the width of the window and set CSS accordingly to make things work right on mobile devices. Honestly, browser inconsistency is half the problem.

As for JS itself, I'll just defer to Douglas Crockford and the infamous wat talk: https://www.destroyallsoftware.com/talks/wat .

If you want more, the HTML and SVG DOMs are not properly integrated. It turns out to be nearly impossible to have a functioning textarea inside SVG, or indeed any form of wrapped text. God knows I tried with Chrome and Firefox, and apparently it just gets worse with IE. I'm sure I'll encounter more irritants as I go on, or maybe someone else can chime in with something specific they encountered this week. Probably the reason you don't hear more specifics is that most of the irritations fade into the background as you work around them, leaving only a vague dissatisfaction.

Now granted, this is all much better than nothing. I know the web has enabled all kinds of cool things, which is the only reason anyone bothers to develop it. But I think it's absurd to call front-end dev a "solved problem", at least in any sense meant to silence pointing out potential improvements.

1 more reply

amorphid12y ago

I don't know if the way web development is done needs a reboot, but I can say as someone learning web development that there is a steep learning curve to all the different pieces! The fact that jQuery needs to exist because different browsers all have their own rules and JavaScript was designed in a rush is the most relevant example to me. It's nice to write a program that's not written for the web without having to worry about a bajillion different devices and UIs in mind!

I guess the reality is that technology evolves at a quick pace. If you want to develop anything user facing, there will alwahs be some hot new thing to keep up with. In the 80s it was the desktop GUI, we got the web in the 90s, the 00s gave us smartphones, and in the 10s we'll start using ?? ? Holodecks?! My only point is there will always be something to keep up with it when developing a UI.

benihana12y ago

That's like saying you don't want to eat the eggs in your fridge because there are too many ways to cook them, and you're certain, despite the fact that you don't have any experience cooking them, that cooking eggs needs to be rethought.

tripzilch12y ago

Great, more eggs for me!

nudetayne12y ago

It's not as big of a mess as the list would make it seem. None of the resources provided are required, and however useful they may seem, I've never found them to speed up development time. I do all of my HTML, CSS, and JavaScript from scratch for every site I build. It's a max of one day on only the most complex projects.

ben33612y ago

Uh... you're not building very complex projects then :) Before you get defensive, consider something like Amazon.com as an easy extreme example. Or a banking website or non-trivial html5 based onlline game as less extreme ones. None of those are getting built in a day, and probably not without the use of libraries (though for something like amazon the libraries may be mostly proprietary/internal)

2 more replies

ldng12y ago

Well it is a nice list but, it's a list, again.

By that I mean you either find compilation list like that or full stack framework but what a would personally find more useful would sets of cohesive tools, end-to-end.

Sure there are boilerplates out there but what I frustrating is that you hardly find "full stack" one. For instance what about a boilerplate for django + django-rest-framework + backbone.js + marionette + i18n tools for backend and frontend + manage.py-grunt.js integration + optimisation tools for css and images + ....

Yes, there are endless possibilities, the more the reason to find more of those out there don't you think ? Maybe it's me but I feel like there is either something missing, too much choice or both. I18N being often the most neglected (granted, it's harder)

What do HNers feel about that ?

porker12y ago

I agree. Even if I didn't agree with all the choices, to see what works well together (and have explanations of why these were chosen by the author, not an arrogant "this is my list, use it") would be great.