Top tools and resources for front-end developers

Posted by Pixafy Team


Our team at Pixafy is always on the lookout for tools that can help make our lives a little easier. The web has so many useful resources for developers, and with new tips and tutorials being published regularly, we thought it might be beneficial to our readers to compile some of our favorites.

This week we’ll focus on tools for front-end developers, where we’ll share our go-to websites that help us with things such as CSS typography, HTML5, Magento, and more.

Style & Design

  • CSS-Tricks: CSS-Tricks is a great all-around website for front-end developers. With ongoing forums, videos, and even an almanac for CSS Selectors and CSS Properties, you are bound to find some answers here.
  • Smashing Magazine: This online tech mag aims to inform readers about the latest trends and techniques in web development. As a destination for both developers and designers alike, the site contains a bevy of informative articles from JavaScript to responsive design.
  • Newnet-Soft CSS Typography Cheat Sheet: This roundup on CSS features will help improve your web typography skills, and touches on things such as font-face irritations, hyphenation, and OpenType ligatures.


  • Quicoto: Ricard Torres is a front-end developer from Barcelona who started this site to share what he knows about HTML, CSS, and JavaScript. There’s also a great section for Magento, which includes this useful post on URL paths.
  • ThinkClay: This online resource runs the gamut when it comes to tech topics and tips. Their collection of Magento articles is impressive with many useful tutorials.
  • Magento Wiki: If you ever hit a roadblock with Magento, it’s always smart to go directly to the source for answers. The Magento wiki can provide quick resolutions to problems that may be delaying your work. This particularly useful  segment details which template tags can be used on CMS pages, in static blocks, and in email templates.

HTML5 & Mobile/Responsive Design

  • HTML5 Rocks: Very helpful site for HTML5, with an extensive resources section that features books, documentation, and tools on the markup language. It also has a lot of valuable information on developing web applications to work across different device types.
  • GetBootstrap: Bootstrap is a free collection of tools for creating websites and web applications, and is a great front-end resource for developing responsive, mobile-first projects on the web.

Hopefully these front-end tools will help you with your own personal projects. Stay tuned for more collections of our favorite online resources for developers!

Was this roundup of front-end developer tools helpful? We’d love to hear from you, so drop us a line in the comments or tweet us @Pixafy!