10 Awesome JavaScript Libraries for Front-End Developers in 2020

3D, better dates, string manipulation, charts, and more\

Simon Holdorf
Jan 17 · 5 min read
Photo by Susan Holt Simpson on Unsplash

JavaScript runs the web. You can use it in the browser, you can use it on the server, and you can use it for mobile applications.

While JavaScript is awesome on its own, it becomes even better through the vital ecosystem. While developers can reinvent the wheel every time they start a new project, that’s a bad strategy and often it makes sense to use a third-party library. Such a library has a defined purpose and wants to take on for you the hassle of dealing with a specific problem or challenge during development — be it manipulating data, creating awesome visualizations, or helping you with functional programming.

I’m not saying you should use libraries for everything. Especially at the beginning of your career, it’s good to code things yourself in order to learn. But in many projects, it’s a good strategy to use libraries where they make sense.

There are plenty of good JavaScript libraries out there. I’m writing here about ten that I find highly useful. I’ve chosen these out of the many because they are well-documented, quite popular, around for some time, and actively maintained in 2020.


1. Ramda

Ramda is a cool JavaScript library for functional programming and currently has 18,000 Stars on GitHub. One of the beauties of JavaScript is that developers can choose whether they like functional or object-oriented programming. There are pros and cons for both philosophies, but if you like functional programming, you should definitely check out Ramda.

Key features are:

  • Immutability and functions free from side effects
  • Automatically curried functions
  • Parameters arranged to Ramda functions for convenient currying

2. Lodash

Lodash still is one of the most popular and useful JavaScript libraries out there. It takes the hassle out of working with strings, arrays, objects, etc. It currently has 43,000 Stars on GitHub.

Useful features are:

  • Iterating over strings, objects, and arrays
  • Creating composite functions
  • Manipulating and testing values

3. Moment

Moment is probably the best JavaScript library if you have to deal with manipulating, validating, parsing, or formatting dates. It’s lightweight, well-established, and has 43,000+ Stars on GitHub. It works both in the browser and with Node.js.

Here are a few examples of what you can do with Moment:

moment().startOf('day').fromNow(); //8 hours ago
moment('2019-15-11').isValid() //false
moment('2019-02-21').isValid() //true

4. Highlight.js

Hightlight.js is a library for syntax highlighting working both in the browser and on the server. It works with almost any markdown and comes with automatic language detection.

Highlight.js will search for programming code between <pre><code> tags, try to detect the language automatically, and highlight the syntax. It also supports different color schemes.

Here is an example with a code snippet in JavaScript and a common theme from code editors:

It’s a useful library if you have a documentation site or a blog, for example.


5. D3

D3 is the most popular library for Data Visualization with currently 89,500(!) Stars on GitHub. It uses web standards and helps you bring data to life with HTML, SVG, and CSS, making use of the power of modern browsers.

Here are a few example categories for what you can do with D3.js:

D3 Examples

It has a steep learning curve, but if you have the discipline to learn it, you can do awesome things with D3.


6. Three.js

Three.js is an outstanding 3D library for JavaScript that uses WebGL as the primary renderer but also supports other renderers like Canvas 2D, SVG, and CSS3D. It has 58,000 Stars on GitHub, and you can create really cool things with it.

Here are a few examples of what is possible:

Three.js Examples

7. Voca

Voca is a great JavaScript library for manipulating strings. It is supported long-term and currently has 2,800 Stars on GitHub. You can use it for manipulating strings such as change case, trim, pad, slugify, latinise, truncate, escape, etc.

Other features are:

  • Complete set of functions to manipulate, chop, format, escape and query strings
  • An easy-to-read and searchable documentation
  • Supports a wide range of environments, e. g., Chrome, Firefox, Node.js
  • 100% code coverage and no dependencies

8. Immutable.js

Working with immutable data structures has some major advantages like simplified application development, no defensive copying, and advanced memoization concepts.

Immutable.js gives you immutable data structures like List, Stack, Map, Set and more.


9. Hammer.js

Hammer.js is a JavaScript library with 20,900 GitHub Stars that brings multi-touch gestures to your web apps. It is small, does not have any dependencies, and can recognize gestures made by touch, mouse, or pointer events. By default it adds recognizers for tap, doubleTap, swipe, press, etc. but you can define your own sets of such recognizers.

Here is an example for singleTap and doubleTap:


10. Leaflet

Leaflet is a great JavaScript library when it comes to creating mobile-friendly interactive maps. It is open source, has 26,700 Stars on GitHub, is very lightweight, and has all the features most developers ever need.

It works on all major mobile and desktop platforms out of the box, can be extended through plugins, and has a well-documented, simple API.

Here is an example in combination with OpenStreetMap:


I hope you like these libraries and can use them in one of your projects!

Better Programming

Advice for programmers.

Simon Holdorf

Written by

Technologist 🚀 Full-Stack Engineer ⚡ Entrepreneur 🤖 Programming is the best job in the world! Contact Me: contact@simonholdorf.com

Better Programming

Advice for programmers.

More From Medium

More from Better Programming

More from Better Programming

More from Better Programming

More from Better Programming

Why Do Incompetent Managers Get Promoted?

496

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade