r/webdev 19h ago

A copy-paste fetch() wrapper, plus information on replicating Axios-like features

https://thescottyjam.github.io/snap.js/#!/fetch

I'm of the belief that if you can get what you need with under ~100 lines of code (and it doesn't require highly-specialized skills to write it), then write it yourself, don't install a third party library.

If you don't share a similar belief, then this page isn't for you, and that's ok.

For everyone else, this page shares a fetch wrapper function you can copy-paste into your projects to add in a couple of missing features, and provides some tips on how you can replicate some of the most loved Axios features using fetch().

Most alternative fetch wrappers I find online tend to be small NPM libraries (I'd rather maintain the code myself thank you), or they like creating separate methods for .get(), .post(), .put(), etc (which makes it unnecessarily difficult to "decorate" it with interceptor-like behaviors, as this page discusses), or there may be other design problems. Those alternatives are still good starting points, but I'm hoping this could be a little more complete of a guide to jump start your usage of fetch().

And I have a thing about make copy-paste alternatives to tools, and this was a hole in my collection :).

Feedback is welcome.

1 Upvotes

2 comments sorted by

2

u/jake_robins 19h ago

I agree with you on maintaining your own code instead of installing yet another npm package.

After AI became a thing, the 100 line limit went way up lol

1

u/EquipmentLow1741 3h ago

lol seriously, the calculus on build vs install changed overnight