General & DOM
jQuery is used both by a lot of websites, and other projects either incorporate it or build upon it. The reason is simple. jQuery reduces the complexity and amount of code that you need to write.
Have you ever seen a website that allowed you to drag and drop pieces of it around and rearrange it? There’s a good chance Dragula was involved.
Dragula is a library that enables developers to create drag and drop features in their websites as easily as possible. It lays down all of the groundwork for you, so you can focus on applying it to the elements of your page.
Polymer is a different sort of library. It allows developers to create custom reusable HTML elements.
Those elements can be dynamic and interactive. Polymer turns static HTML into something which behaves more like an object oriented language.
Zepto is a lot like jQuery, but it’s super light weight. It’s built to be compatible with jQuery, and it uses the same syntax, but it cuts out a lot of the unnecessary extras that can slow jQuery down.
It doesn’t have the same constraints as jQuery. Zepto doesn’t worry about supporting legacy browsers or often unused parts of jQuery. It focuses on giving developers what they need, and nothing they don’t.
Animation and Graphics
This very simple library allows developers to include basic CSS animations with minimal effort.
It is able to create custom freeform animations that include more motion in a more natural and, well, animated way. Anime’s animations are fluid and natural
Big data has been exploding over the past few years, and developers need a way to visualize and present that data. That’s where D3 comes in.
D3 is designed to make creating a wide variety of data visualizations easy. It provides functions for making visually appealing and animated graphs using large sets of data. D3 is trusted and stable.
Chart is very much like D3, but simplified. It can easily create animated and well designed graphs of a number of varieties.
Chart doesn’t have the same number of options as D3, but it is also simpler to use. It’s fairly light weight for what it is and what it is capable of. For developers looking for a simple charting solution without the overhead of D3, Chart is a great option.
Here is another descendant of jQuery. Velocity re-implements jQuery’s animation functionality without the bloat of jQuery.
As its name implies, the goal of Velocity is speed. Surprisingly enough, Velocity hasn’t sacrificed browser compatibility to achieve its goal. Velocity doesn’t exactly use jQuery’s syntax, but it will immediately be familiar to any jQuery developer.
Parallax can empower developers to create amazing animations that play with visual depth to create 3D like effects.
It can create scrolling animations and create the impression of changing perspective. It handles a lot of the hard animation work for you, so you can focus on implementation.
Google made somewhat of a mistake, though. Angular 1 and Angular 2 are different frameworks, so there is no smooth upgrade between them. Make sure you know which you’re working with.
Vue can look a lot like Angular, but it’s generally more simple. It’s a front end MVC framework. It comes complete with routing and just about every feature you’d expect from a front end framework.
Despite that, Vue is lightweight and has a simple learning curve. It is intuitive and uncomplicated, and it’s a smaller dark horse project that’s managing to compete with Google and Facebook. Actually, it’s even included it the popular Laravel PHP framework.
Ember is the Rails of front end frameworks. It’s big, opinionated, and powerful. Ember tells you what to do, and if you follow, you can make some great things easily.
Ember is big, though. It comes bundled with the Handlebars templating engine and all the batteries included. This is awesome for larger desktop web applications, but might seriously slow down on mobile.
Facebook made it’s own front end framework, and that’s React. It’s a favorite among developers because it’s easy to learn and teaches developers. React also has a large and active community of developers.
React is centered around building and using independent components. These encapsulated components are reusable and don’t interfere with one another, making them the perfect building blocks of your applications.
Aurelia is another full-featured MVC framework that makes full use of two-way data binding, routing, and custom HTML components.
It’s a great option for developers looking for a more complete framework along the lines of Angular but without the baggage of the of Angular’s versioning.
Want something super minimal? Mithril may be for you. Mithril is a fast no-nonsense framework with many of the options that you’d expect from a much larger project.
For another more minimal solution, consider Backbone. It aims to provide the structure needed to build powerful web applications.
Backbone is lightweight with a design that focuses on passing data between models, views, and a database. Of course, it has existing functionality to make building these components easier.
Riot is something a bit different. It aims to bring the component based functionality of React and the ability to create custom HTML elements together.
Riot is a minimal framework alternative. If you don’t need a full framework, but do want reusable components, consider using Riot.
Redux isn’t really a full framework. It’s more of an add-on that you can use with React or another view library.
Redux refers to itself as a state container. It attempts to maintain the state of your web applications and enable them to run consistently.
Express is another key component of the MEAN stack. It’s a minimal back end MVC framework built on top of NodeJS.
Express is great for building both full featured web applications and APIs. Because Express is minimal by default you have the choice of how much you want to build, and you don’t end up with a lot of features that you’re never going to use.
Sails is actually based on Express. It’s sort of like Rails for NodeJS. It comes with a lot of work already done when you spin up a project.
It abstracts a lot of the more low-level work like interacting with databases away, making the process simpler. Sails also comes with features like automatically generated REST.
There’s an even more minimal solution than Express. Koa. Is a super minimal back end framework that can still be used to crate web applications and APIs.
Koa only provides a middleware kernel and builds upon Node’s existing HTTP modules. It’s much closer to NodeJS itself.
There’s another great full featured framework, Adonis. Adonis provides all of the major features that you’d expect from an MVC framework, like routing and ORM for handling database connections.
Adonis aims to build in all of the features that you’d want in just about every project so you can get started building your application faster.
It’s kind of hard to tell were to put Meteor. It’s actually a full stack framework that provides tools for building both the front end and the back end of your web applications.
Meteor would be most comparable to the entire MEAN stack. It provides everything in one package. That means that while Meteor can be convenient, it can also be somewhat inflexible.
Meteor is a complete toolkit that you can immediately begin building a web application with.