Where I live people say “The sun that doesn’t rise in the sky, rises in our hearts”. We’re in the middle of Summer and this has never been so true. I don’t know about your place but if you barely remember what sunny means I’ve got good news for you. Our training plan doesn’t require outside workouts.
In the first part I showed you a list of cool languages you should definitely try. But as every developer I want to be productive so I also have plenty of frameworks and libraries in my tool belt helping me in my daily work.
Web Frameworks
Knowing languages is one thing. But in the real world you never reinvent the wheel and to take the most of those you need to be familiar with common libraries and frameworks in their ecosystems.
Some of them will even condition the choice of a language. Remember. Who was coding Ruby before Rails?
Let’s have a look at some of my favourites.
Ruby on Rails
This one is a classic. This framework not only contributed to the wide adoption of Ruby, it also changed the way of building Web applications introducing concepts such as Convention Over Configuration.
This allows RAD (Rapid Application Development) avoiding painful projects initialisation and configuration. The old school Java Enterprise folks know what I’m talking about.
This magic doesn’t come without downsides. Lots of things are abstracted and happen backstage. The code generators are a huge time saver but they require you to do things the Rails Way.
And let’s be honest … The Rails Way is amazing for prototyping or writing tutorials about building a blog in 15 minutes but when it comes to huge applications it becomes a real pain.
However Rails is still one of my main tools on a daily basis and once your knowledge of the framework allows you to step out of the way it can be really powerful.
More info: http://rubyonrails.org/
Sinatra
You like Ruby but Rails is overkill for your task at hand? No worries, the community has your back covered.
Sinatra is a micro-framework for web applications. You can literally have a web app running under a minute from a single file. It can go further as well and is sometimes used for bigger projects.
Anyway it’s a killer weapon for prototyping.
More info: http://www.sinatrarb.com/
Padrino
Want to bring your Sinatra app to the next level but still afraid of the Rails voodoo? Meet Padrino.
It’s a set of libraries for Sinatra that bring more advanced functionalities to it. Might be your sweet spot so definitely check it out.
More info: http://www.padrinorb.com/
Symfony
The Ruby community was not the only one to get its rapid web development framework. The PHP one also got a few of those like CakePHP or Symfony.
I have to say that I’m not a big Symfony 1 fan and at that time it didn’t really convince me. I was still using Rails for my personal projects and Spring (Java) for serious business.
It’s only when Symfony (2) came out that the name gained my interest.
Symfony is not just a new iteration of the 1.4 version, it’s a completely different framework. It drops the Rails like magic out and adopts a whole new architecture which feels a bit like … wait for it … Spring. But a lot lighter. Which is great.
If I was a PHP guy, I would probably build all of my projects with it.
If you’re wondering, Symfony is one of the technologies powering PAYMILL.
More info: https://symfony.com/
Laravel
I personally never used Laravel but I heard only good things about it. If you don’t go for Symfony you should probably have a look at this one.
More info: http://laravel.com/
Silex
Silex is a micro-framework based on Symfony. Not much to say it’s basically Sinatra for PHP.
Phoenix
I would like to add a touch of exoticism in our list. Phoenix is a new web framework for Elixir. I’m pretty new to it and only used it for pet projects. But I have to say I love it.
Here’s the Phoenix promise:
Most web frameworks make you choose between speed and a productive environment. Phoenix gives you both.
As a Rails developer I felt at home and was able to find the same level of productivity I had with it when I started. It feels more modern though and provide a good support for both Web and API projects out of the box.
For the response time we’re not talking about milliseconds anymore. Using Phoenix you need to get used to the micro prefix even in development mode.
Am I kidding? Check it out for yourself!
More info: http://www.phoenixframework.org/
Node / IO
I already hear you scream “But Node is NOT a framework” and you’re right. But it had to go somewhere.
Node is a platform built on V8 (the Chrome Javascript engine) for building network applications. Some use it for command line tools as well.
Basically it allows Javascript execution out of the browser.
It has a very rich ecosystem including a plethora of Web Frameworks.
Here are a few you can take a look at:
- Express: Classic Web micro framework
- Koa: Written by the Express team. same but different
- Sails: More complete than the former ones
- Meteor: An isomorphic application framework
- Fluxible: Another isomorphic application framework based on Facebook React and Flux
Frontend Frameworks and Libraries
What would be the Web nowadays without highly interactive applications? 1995 right? A spinning mailbox GIF on your website won’t be enough anymore to make it popular.
So you’d better know how to use some of the Javascript libraries out there.
Let’s be honest. I can’t tell you which are the best ones nor give you an exhaustive list as there are probably a dozen being released as I’m writing.
The best I can do is just tell you about the ones I liked.
AngularJS
Well ok … Not only the ones I liked as I’m not a huge fan of AngularJS. I built a couple projects with it a long time ago, before it was officially endorsed by Google but lost interest in it since then.
Anyway if you’re a frontend developer you almost can’t avoid it so you should at least know about it.
The principle is that it basically allows you to extend HTML capabilities through Javascript.
It has quite a steep learning curve and some concepts are not necessarily easy to grasp.
Note that the version 2.0 called Angular is coming and is radically different. It seems a lot easier to get started with but I didn’t try it myself yet.
More info:
- AngularJS: https://angularjs.org/
- Angular: https://angular.io/
Aurelia
Aurelia is one of the new kids on the block worth mentioning. It is similar to Angular (2.0) which is not a surprise as it’s written by Rob Eisenberg who was a core Angular developer. He didn’t like the direction taken by the team so he created a new framework matching his plans and vision.
Aurelia leverages cutting edge capabilities of the Web and supports out of the box ES6, ES7 and popular transpilers like CoffeeScript or TypeScript.
I only tried the getting started guide but was impressed by the capabilities and the fast learning curve.
So if you’re aiming for a modern solution supporting all evergreen browsers go for it.
More info: http://aurelia.io/
Backbone.js
Backbone is a lightweight library that helps you structure your application. It provides useful components that can be used independently and doesn’t impose anything to you. You’re free to use any part of the library in the way that suits you.
This freedom comes with a price as it can be confusing to newcomers.
But you should definitely have it in your toolbox. You can even use it besides other libraries. I personally use it with React to replace Backbone views.
Ember
At the opposite of Backbone are very opinionated frameworks providing you with everything you need for building your application out of the box.
Ember is one of those. It’s often used with Rails backends as it brings common concepts such as conventions over configuration. The Ember-cli even provides command line tools and generators.
The learning curve is quite steep but once you master it you get an impressive productivity.
If architecture freedom is not a concern for you and your application needs fit its concepts you might fall in love with it.
More info: http://emberjs.com/
React
As a web developer you probably always have been told about the importance of the separation of concerns. HTML templates have to be separated from code otherwise it’s evil.
Be prepared! React could shake your world.
React focuses on the view layer of your application. Thus you can use it alongside other libraries (see the Backbone part).
It is components oriented. The template of your component is described directly in Javascript besides the rest of the logic. To ease the process React introduces the optional JSX format which allows writing HTML directly in JS.
The other particularity it doesn’t provide traditional data binding. Your component DOM is rebuilt every time its state changes.
All of this sounds like a heresy. But believe me it’s quite the opposite.
React has a virtual DOM which is blazing fast. It only injects the changes in the actual browser DOM. So no performance issue there. It’s a lot more efficient than traditional data binding.
Regarding the separation of concerns just think about it … Does putting a component code and it’s template in different files really separate concerns?
“Templates separate technologies, not concerns.”
If you take the time to understand React and get used to this different way of thinking I’m sure you’ll have great time with it.
Take the leap! http://facebook.github.io/react/
Riot
Some find React too heavyweight and difficult to grasp. If you’re in this case but still like the concepts it brings just take a look at Riot. It’s a simpler and easier yet powerful alternative.
More info: https://muut.com/riotjs/
Have fun!
Looking for frameworks on the Web is like being a child (or an adult like me) roaming in a toy store. You’re all excited and don’t know which one to play with. And usually after you had fun for a couple of hours you just lose interest in it. But sometimes you find that special one that makes your life brighter.
Maybe you’ll find that one toy in my list or maybe you already have yours and can share it in the comment.
Next time I’ll tell you how to boost your editing skills.
Until then you can have a look at the libraries and plugins page in our Developers Centre and let me know if your favourite framework integration is missing.
[cta-variant1]