Front-End Development: 5 Things You Should Definitely Learn in 2014A post by Joseph Howard@http://www.pencilscoop.com/2014/01/front-end-development-5-things-you-should-definitely-learn-in-2014/
We all know at what a rapid pace the world of web design and development moves. As designers and developers we are set with similar tasks of continually learning and improving to ensure we’re up to date with the latest trends, projects and practices in our continual attempt to stay relevant in such a fast-paced industry.
For front-end developers, improving on existing skills and taking on new best practices, new languages, implementation techniques and deployment are integral. However it’s very easy to fall behind, often through becoming complacent or overly protective of the workflow you’ve become so accustomed to using over the years. There’s nothing wrong with this kind of “If it aint broken, don’t fix it” attitude, however it comes at a risk – one of becoming obsolete, very quickly.
Today, the web is such a vibrant environment full of media, applications and interactivity. Sure, a simple HTML/CSS setup has worked for a long time, and will continue to do so– however we are now seeing a seemingly endless stream of innovative development and deployment projects released everyday.
Some of these are useful and develop a strong community and support network. However they almost always take a significant amount of time to become widely accepted as a recognised development practice.
One way of ensuring you’re at the forefront of the latest web development know-how is to make an active list of things you need to improve on or learn, and commit a structured time management road-map to improvement.
If you haven’t already – here are some useful things you should consider learning in 2014:
Learn and Start Using SASS
You’ve almost definitely heard of SASS right? However (like a lot of people) you may be reluctant to give it a try. Let me put it this way, every developer who currently uses SASS has gone through the exact same notion you’re going through. After years of religiously following your own workflow and structuring CSS files just the way you like them – why should you change? Well, there’s heaps of reasons, all the buzz around SASS wouldn’t be for nothing right? If so many people are using it, there must be something good about it right? Exactly and there’s a lot of things – once you start using it, you’ll wonder why you didn’t earlier. Here’s a few useful links to get started:
Why SASS? – A List Apart.
The Many Ways To Work With CSS Preprocessors – Jeff Croft.
First Moments With Grunt (screen cast video) – CSS Tricks.
Getting Started with SVG - Webdesign Tuts+.
Animated SVG Icons with Snap.js - Codrops.
Animating Vectors with SVG - 24 Ways.
Animate SVG With CSS and jQuery - PencilScoop.
Learn CSS Animation
Again, another feature that’s been around for a while. Traditionally most browser animation has been handled via jQuery, however CSS animations are becoming highly mediated lately. The debate continues as to which way of handling animations is the best, however ultimately the choice is up to you. Personally, I find CSS animations and keyframing pretty easy to use and relatively logical in general. Here are some useful links for getting started.
Intro to CSS Animations – CSS Tricks (Screen Cast)
Transitions & Animations - A Beginner’s Guide to HTML & CSS
CSS Keyframe Syntax - CSS Tricks.
Animate.CSS - A useful list of pre-made CSS animations and effects.
Learn Custom Parallax
Some would say the parallax effect has already come and gone, which is probably partly true. However it’s starting to be used in some more subtle ways which can help put the finishing touches on any project. That being said, there are a lot of plugins available for parallax effects, however if you really want to master it, you should really learn create your own custom effect. Here’s some more info:
A Simple Parallax Scrolling Technique – Nettuts+
Easy Parallax with jQuery – egstudio
What front-end development stuff are you using at the moment? Is anything notable you would recommend? Let us know in the comments.