My Current Front-end Resources

06 Sep 2013

Tweet Share

In the last few days I’ve emailed the same list of links and resources to at least twenty different people, so I thought expanding the list a bit and posting it here would make it easier to reference and hopefully help some who haven’t seen these before.

There is so much noise information out there, I keep a list of my favorite sources for a variety of front-end topics to share with clients and colleagues. Learning, staying up to date and finding good references is always a challenge, so I hope you find some new sources here that help you out.

Please note, this list is not comprehensive, it just shows some of the sources I think are reliable and valuable.

HTML

Like most technical areas, HTML has gone from fairly simple to amazingly complex in recent years. Is it HTML, or HTML5? What about XML and XHTML? Here are some links I find very useful, and clients have been very happy to have.

HTML Tutorials

• Basic HTML and CSS has 10 bite-sized, free lessons that are really well done, easy to understand, and will give total beginners a great start on becoming much more comfortable with the basics.
• Advanced HTML and CSS is the next step, introducing topics like performance, positioning, RWD and even the basics of jQuery.
• Learn HTML is from the Mozilla Developer Network, a site I’m on all day long. Intro and advanced articles, with HTML5 coverage too.
• For more hands-on practice, the Codecademy HTML track is worth a look.

HTML News, Articles and Updates

• HTML5 Rocks for blog posts, tutorials, case studies and recent developments in markup standards.
• HTML5 Doctor is a must for your RSS reader.
• HTML5 Weekly is a great weekly newsletter.

HTML References

• The W3C HTML5 Draft Standard is a comprehensive reference.
• The WHATWG Living Standard is also very comprehensive and the Web Developer Version is nicely formatted and easier to read.
• For quick look up, I use the Mozilla HTML Reference or the W3C Elements List.

CSS

I have to confess that deep dives into a large batch of CSS files can give me headaches. One of the best sources I use for this is a dead-tree book version of Cascading Style Sheets: Designing for the Web (3rd Ed) by Bert Bos and Hakon Wium Lie, the guys that led development of the first standard. They explain the core concepts very well. Other online sources here:

CSS Tutorials

The first two HTML tutorial links above are a great introduction. For more in-depth coverage, these are helpful:

• Web Design/CSS Challenges is a good for practice.
• CSS Positioning is a valuable walk-through of an important topic.
• Mozilla’s Learn CSS is definitely recommended.

CSS News, Articles and Updates

• CSS-Tricks is incredibly valuable. Bookmark and add to your feed reader.
• Reading, watching and listening to everything that Nicole Sullivan and Lea Verou write, demostrate, talk about, tweet, and otherwise share is gold. Solid gold.
• A List Apart, Smashing Magazine and net tuts+ cover a lot more than just CSS.

CSS References

• The Mozilla CSS Reference is great for quick look ups.
• CSS tests from Quirksmode.org selectors, properties, values, units, browser comparison tables, etc.
• CSS 2.1 Selectors
• CSS3 Selectors
• CSS Lint hurts your feelings and helps you code better. Nuff said.

JavaScript

Searching for JavaScript on Google today shows “About 1,500,000,000 results”. In my futile attempts to cut through the noise, I stick with the sources I know.

JavaScript Tutorials

• Try jQuery is a gentle introduction to the jQuery library and to JavaScript in general.
• 30 Days to Learn jQuery has nice bite-sized lessons.
• The Codecademy jQuery track and the JavaScript track are great to practice getting the syntax and keyboard under your fingers.
• Eloquent JavaScript is an online (free) interactive book with practice examples - a great learning resource.
• Mozilla’s JavaScript Guide is a very readable intro.

JavaScript News, Articles and Updates

• JavaScript Weekly A free weekly email newsletter.
• EchoJS is like Hacker News for JavaScript.
• DailyJS is a JS focused blog.
• Follow @paul_irish, @addyosmani, @rmurphey, @pamelafox and @slicknet for community happenings, links, and more. Much more.

JavaScript References

• David Flanagan’s JavaScript: The Definitive Guide is, well, definitive. It’s also one of the best written technical books I ever read. Definitely goes to the deepest end of the pool, but the concept explanations are awesome.
• Nicholas Zakas’s Professional JavaScript for Web Developers is also a great book with lots of clear example code and clear explanations.
• Mozilla’s JavaScript Reference has a very handy search field that I use every day.
• caniuse.com is a must for quick browser compatibility look ups.
• JSLint also hurts your feelings and helps you code better.

One trick I use for finding reliable answers fast is with Google searches. I just prefix my search term with ‘mdn’ (no quotes) and the results are typically from Mozilla’s Developer Network. Like this.

If you have any favorites that I missed, please let me know @JeffChasin.