Front end web-development: good resources [closed]

Closed. This question is opinion-based. It is not currently accepting answers.

---

Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.

Closed 9 years ago.

Improve this question

I am about to move to a job where I will be doing front end web development (mainly CSS and jQuery).

What are good resources (books, websites, blogs etc.) for learning more about those technologies in particular and anything front-end web development related (good technologies to know, user interface ideas etc.) in general?

Thank you!

ETA: Just to give some idea of where I'm holding, I have about 1.5 years of experience in web development. So I already have a pretty good grasp of CSS and know the basic开发者_运维知识库s of jQuery. I also know a fair amount about user interface design.

---

The JQuery docs is a must. Read it end to end, then start to start and keep it on a bookmark. Anything you can think of asking about jQuery is answered there (even most of the questions asked on SO).

A list apart is also a very good resource for web design. I highly recommend their CSS Floats 101 article.

There's a free ebook called Eloquent JavaScript. I find it very good at explaining Javascript (jQuery is just a Javascript library, there is nothing alien in it).

And some people might not agree with me, but W3Schools is a very good resource for beginners (it usually ranks high in search results).

---

Definitely checkout the Mozilla Developer Network...

https://developer.mozilla.org/

---

You need Firebug for Firefox. The Chrome Developer Tools are already installed in Chrome and are super useful!

---

JS FIDDLE!!!

---

http://css3please.com/

---

... and some other links:

• http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks
• http://www.w3.org/TR/CSS21/selector.html
• http://coding.smashingmagazine.com/2007/05/01/css-float-theory-things-you-should-know/
• http://www.cssstickyfooter.com/
• http://phrogz.net/CSS/vertical-align/index.html
• http://www.css3.info/

I hope this helps.

---

As Hristo says, Mozilla - I would recommned getting the Firebug plugin for Firefox - http://www.getfirebug.com, I can't stress enough how mucg easier this makes CSS (particularly debugging and tidying stuff up)

I would also suggest the w3schools reference page for CSS - covers all the most commonly used stuff http://www.w3schools.com/cssref/default.asp (handy for when you forget exact tags)

---

get your JS hat on! It's one thing to use JQuery, but you should really understand how JQuery works. You say that you know the basics of JS, so have a look at John Resigs Advanced JS page. This is a very good guide by one of the leading JS guys out there - you will learn more about JS here than anywhere.

---

i assume you will also be doing HTML since this is at the core of FE dev. HTML, seems simple and is easy to ignore as a technology, but you should not turn your nose up to it. Writing terse, clean and semantic HTML is a skill and requires lots of learning and practice just as CSS and JS.

Right, now onto things you actually requested :)

For jQuery i would definitely consider learning as much as you can about JavaScript proper. Whilst you can write jQuery without knowing all that much about JavaScript, you need to understand JavaScript to make the most of jQuery and write better code. And of course to know when you can get away with using plain ol' JS.

JS resources:

• JavaScript: The Good Parts - a concise but dense book by JS guru Douglas Crockford
• JavaScript: The Definitive Guide - a mammoth bible, not for the faint of heart!
• Crockford on JS video series - a ton of videos on crockford's site :-)
• jQuery docs - the jquery docs are very comprehensive and contain lots of examples and explanations

CSS resources:

• web standards solutions - it's the only CSS book i've ever read and is an excellent primer
• CSS Floats 101 - a list apart (an excellent website for FE development)
• CSS Positioning 101 - a list apart

Good websites to have in your RSS client:

• CSS Tricks - lots of cutting edge CSS
• Specky Boy - general front-end dev
• MS Script Junkie
• A List Apart (Again!)
• Smashing Magazine

hope that helps in your quest into front-end development!

---

www.csszengarden.com and the matching book were good resources for me with the CSS side. You might also take a look at www.jquerymobile.com if you think the work you'll be doing might also benefit from a tablet/smartphone finger-friendly interface version.

Greg