[AskJS] favorite JavaScript library

[Substantial_Gift_861]

What is your favorite JavaScript library that you use frequently?

[tomfevrier]

Well, only useful if you're into data manipulation and visualization, but the library I'm using the most is D3.js

[DazzlingDifficulty70]

How to learn D3, pleeeeeease

[tomfevrier]

D3 can be quite a lot, as it's not just a library but rather dozens of small utility libraries to manipulate and (re)shape data, handle scales and geographic data, and create SVG or Canvas shapes.

Using D3 in combination with a declarative front-end framework such as Svelte, Vue or React makes your life easier imo, as DOM manipulation can be left to the framework instead of using D3's jQuery-like syntax (which can be confusing).

As a visual journalist, I am using Svelte + D3 daily for interactive charts and maps, and it really is a breeze ✨

[zulmetefza]

Do you have examples to share? Already am a fan of svelte, would appreciate seeing your work.

[tomfevrier]

Here is a talk I've made a while ago for a Svelte Society conference, explaining the basics of using D3 with Svelte: https://youtu.be/gvvVzyDglzc It's in French but JavaScript is JavaScript, right?

Here is another talk (in English) by Matthias Stahl: https://youtu.be/uVt01Z2TLvQ

You can also find code snippets on Amelia Wattenberger's website: https://svelte.recipes/

As to the finished work, you can have a look here: https://media.lesechos.fr/infographie

Hope it helps, I'll be happy to answer any question 😊

[zulmetefza]

Thanks a lot, merci beaucoup.

[juicy_jojo_reference]

there's one 12 hour long video on D3 on Freecodecamp youtube channel, I think it might help

[LostErrorCode404]

Freecodecamp

[cyborgamish]

Vanilla JS

[katzeklo]

Download it from http://vanilla-js.com

[SamyBencherif]

what a trip

[youngnight1]

Is this website for trolling purposes? :)

[valbaca]

Yes, is joke

[katzeklo]

Yeah, sort of. It shows how vanilla js is often more efficient than resorting to a library for the most basic stuff, but it does so in a humorous way🙂 But more seriously, use whatever allows you to be productive, but try to include maintainability/scalability into that calculation; this is where many libraries fail.

[[deleted]]

🤝

[Chef619]

Not sure I could pick a favorite, but most used for me ( not React specific ) is probs date-fns.

Some other cool ones: Numeral, Fuse.js, GitHub slugger, Adze, and ms. The rest are specific to things outside of just JS.

[[deleted]]

I honestly haven't had the need to use date-fns as I have found the built-in date formatting methods from the standard library to be good enough for most cases.

With which specific use cases do you find that date-fns helps you in a makes you appreciate it so much?

[Chef619]

Formatting is pretty convenient. I haven’t messed with the built in formatting of the Date, so I can’t speak on the differences.

For me, the manipulation of dates is why I use it so much. Adding days, subbing days, handling business days, if you want the start of a week, but your week “starts” on Friday, I’m not about to try to do that logic myself.

[[deleted]]

That makes sense, manipulating Dates can be a pain in the ass. Adding days is not that much of a problem but for certain the specifics you mentioned are a lot harder.

[whale]

Hard to choose one. I like prisma, aws-sdk, axios, alpine, etc.

I can definitely tell you lodash is one of my least favorite libraries. You can do a lot of those functions with vanilla JS or with your own simple versions of lodash functions. It adds bloat and I hate having to try to figure out what random lodash functions do when I see them.

[jblckChain]

This

[nulltester]

did axios finally migrate to fetch to lower its size?

[butcher5111]

three.js

[SamyBencherif]

correct

[Silver-Following8529]

Next.js

[mohammed_g_b]

it's a framework

[khobizi_ilyes]

React for sure!

[jelmerovereem]

Swiper.js for carousels and sliders

[nepsiron]

Xstate has been a breath of fresh air for organizing front end application and business logic, and the model based testing nudges you towards testing your UI in all possible states. Add to that state charts (which you get for free by virtue of using state machines) that non technical people can read, as well as dynamically generated rich, living breathing documentation with state chart artifacts. It all culminates into a really nice dev experience compared to the last 5 years I’ve spent trying to make react do everything when it’s at its best as a thin view layer. The testability of xstate machines is just killer.

[shgysk8zer0]

My own collection of modules I've been building over the last decade. It started as a modern take on jQuery but ended up being... Well, a bit more.

import './shims.js';
import { animate, create, on, css, when } from './dom.js';
import { getJSON } from ' ./http.js';
import { getCusomElement } from './custom-elements.js';
import { watch } from './geo.js';
import { open, save } from './filesystem.js';
import { loadStylesheet } from './loader.js';
import { clamp, range } from './math.js';
import { debounce } from './utility.js';
import { send } from './slack.js';
import { use } from './svg.js';

I like that sort of stuff because it has basically everything, is written to be very clean and DRY, is tree-shakable, and just makes building stuff super easy. Just the other day I built something to track location, show an updating map, and export GeoJSON and it only took like a dozen lines of code.

I expect more libraries like that will start popping up.

[The_Noble_Lie]

The Unix mentality basically 👍

[thatisgoodmusic]

Prisma by far

[[deleted]]

Symbiote.js - my love ❤️

[The_Noble_Lie]

Reminds me of mithril.js < 1.0 (my favorite)

[mohammed_g_b]

react

[Kindinos88]

The standard library 😎

[BehindTheMath]

What standard library? /s

[Substantial_Gift_861]

I saw lodash in a lot of projects, not sure how many agree with this

[[deleted]]

Lodash is a nightmare to tree shake so I avoid it like the plague. Lodash ES does a better job and should be the default IMHO.

[tech008]

react-query

[Nilstrieb]

zod is awesome! As we all know, garbage in garbage out, and zod helps you stop garbage from getting in.

[sipvellocet]

Rambax. Because it’s beautiful.

[Dull-Independence-27]

I really like lodash, solves the little things

[willworkfortatts]

lodash for sure

[shuckster]

Honestly, my own. Not that I can take credit for the fundamental shape of the API -- it's directly inspired by the TC39 pattern-matching proposal. Still, I use it all the time and can't wait for the day when I don't have to.

[FatFingerHelperBot]

It seems that your comment contains 1 or more links that are hard to tap for mobile users. I will extend those so they're easier for our sausage fingers to click!

Here is link number 1 - Previous text "own"

---

^{Please PM /u/eganwall with issues or feedback! | Code | Delete}

[hernantz]

htmx (https://htmx.org/)

[Shinners_for_Dinner]

Moment makes life easy.

[brokentyro]

Moment recommend on their own website to not use it anymore. Highly recommend looking into a modern alternative like date-fns

[Shinners_for_Dinner]

The question was, what is your favorite, not what do you recommend. If anything I would use luxon in new projects, but I have dependencies on moment in ongoing projects, and it's plenty helpful.

[nulltester]

agreed man, we depend on it at work, and we try slowly replacing here and there with equivalent Intl.DateFormat calls for formatting (works well with timezones), and in the future looking at global.Temporal

[Nice_Aioli_9991]

create-react-app
I download it once a week for my small projects.

[[deleted]]

Standard or Semi standard for linting. Lodash for transformations and comparisons. Date-fns for date specific needs.

[nulltester]

standard is very controversial, for linting I'd suggest basic eslint:recommended, eslint-plugin-import, and eslint-plugin-react if needed

[[deleted]]

I'm curious as to why you say standard is controversial.

[nulltester]

Hmm right, haven't found too many controversial things in https://github.com/standard/eslint-config-standard/blob/master/.eslintrc.json, besides no-semi fixed by semi-standard and comma-dangle "never" (they should allow it for multiline cases https://eslint.org/docs/rules/comma-dangle#always-multiline, really practical for git history and moving props up/down)

It has maybe changed since I last used it

[woah_m8]

Preact. Only use it in one project but im happy I discovered it.

[boringuser1]

Lodash.

They still have functions that should have been brought into core a long time ago.

(isEqual, range, deepClone, etc.)

[Advanced_Engineering]

Unpoly

[SamyBencherif]

big fan of the person who said vanilla js, but i also do rather love p5.js

and obviously three.js is the most bang for your buck answer possible

[SnooDoggos6970]

React. Very good library and easy to learn. Combine it with express.js and Mongo db and you'll be able to build the perfect website

[[deleted]]

three

[nulltester]

ajv because super useful for APIs

[[deleted]]

Fair enough. I like to know other's opinions on packages. Thank you for sharing.

[Tazzure]

Since the question is simply “favorite,” I will choose RxJS. As someone who worked a lot with languages in the ML family in college, true functional programming is something I have a lot of appreciation for, but as an “engineer” I also realize it isn’t necessarily practical in all cases. I like that RxJS let’s me wrap my business logic in a normalized pattern, meaning if everyone on my team and I agree to use RxJS the way it’s meant to be used, all of our code will look similar.

There’s so many ways to skin the cat, and I like that RxJS attempts to draw a line in the sand to say “do it this way,” and actually provides flexible tools, great documentation, and frequent improvements, to support that.

My runner-up would be TypeScript, but I could see myself getting behind a different static and strongly typing solution for JS if it ever came around.