6 Best NPM Packages

if you're anything like me the first time you open up a node modules folder you were probably amazed at how many libraries were inside of that single folder but that's not even a small percentage of the number of libraries that are available on NPM for you to install so in this video I'm going to take a look at this six by far most useful NPM libraries in my opinion and these aren't going to be libraries like react or angular or view or Express that are more framework based I'm going to talk about small libraries that take up a specific use case that'll be useful in any project that you create so let's get started now the first library I want to talk about is date FNS also known as date functions and this is essentially a library that contains a collection of hundreds of different functions that make doing anything from adding days to dates to subtracting dates comparing dates formatting dates locales for dates literally anything you would ever want to do with dates it makes it incredibly easy because by default javascript dates are really not that easy to work with they don't really have that much functionality built into them so date functions is a library that adds all of that functionality that you need into it and you may be hearing of something called moment j/s that's another date library that's out there but in my opinion and the opinion of a lot of other people date functions is just a better version of moment jeaious because it allows you to import only the parts of it that you'd need as you can see here they're importing only four functions from date functions so it allows your bundle size to be incredibly small and it also allows you to use native JavaScript dates moment requires you to wrap your date in a moment object but with date FNS you can just use the normal JavaScript date object and do all of your operations on it that way date FNS is also entirely functional programming so it's really easy to get started with because all the functions are peer there's no classes to worry about it's just really straightforward helpful functions that'll be useful in any scenario also as I've mentioned it has internationalization which makes working with different locales incredibly easy on the front end if we actually go over and look at the documentation for this you can see over here that there are absolutely an incredible amount of different functions that you can use in your dates and they're also incredibly useful because like I said JavaScript really doesn't have that many good date functions built into the standard library the next library I want to talk about is e and V and I use this in almost every single node project that I create what it lets you do is it lets you create a local file called env and you can store all of your environment variables in here for example your database information and then you can pull that into your application by just calling require env doc config and it'll load all your environment variables into the process env variable in nodejs this is incredibly useful for when you're developing things locally and you want to be able to use environment variables without having to manually set these environment variables every single time you run node just having that file and be able to easily change things in that file and share that file with other people makes this library incredibly useful also as you can see up here it has zero dependencies which means this library is going to be incredibly small and since you're only going to be using in development that's really nice because you don't have to download a bunch of different node modules just to work with your application next moving on to a slightly larger library I want to talk about socket IO which makes doing WebSocket real-time communication between your server and all of the different clients absolutely a breeze I have an entire two-part series on creating a chat application using this library so if you're interested in figuring out more in depth about this library make sure to check that out linked in the cards and the description below but essentially what this library does if we go to the documentation here you can see that all we need to do is set up a very basic server and then inside of that server what we can do is we can actually send information down if we scroll down a little ways here we can just use our IO to create functions essentially that we can call from our client on our server and then that server can send information down to the client by essentially calling functions on our client this allows us to make really easy real-time communication from our client up to our server and then back from our server to all of our different clients it's absolutely amazing how easy it is and you definitely have to check this library out next moving on to another really straightforward library we have UUID which as you can see gets 16 million downloads a week so it is incredibly popular and essentially what this library lets you do is it allows you to create unique identifiers uu IDs in your application with just single lines of codes and it has all the different versions of UUID that you could ever want to use for example version 5 4 3 2 1 it doesn't matter you can include whichever version works for your application this is incredibly useful when you're working with any form of clients application or even a server-side application where you need to create unique identifiers because you can use this in both node as well as front-end JavaScript and let me tell you I use this all the time in my applications because all the time you need to create unique identifiers especially when working with react up next we have everybody's favorite fetch replacement Axios essentially what Axios lets you do is to create web requests very similarly to how fetch works but it's so much easier to use and gets around a lot of the GAT shoes that you have to deal with when you're doing javascript and json related fetch request it just does all that backend information for you behind the scenes so you don't have to worry about it also Axios is incredibly small when you bundle it into your application so it really doesn't add much bulk for you and most importantly is it actually goes back very far for support as you can see IE 10 for example IE 8.1 chrome 7 edge 10 it just has massive support which fetch doesn't even come close to doing so if you want to support older browsers Axios is a great way to do that and if we scroll down a little ways you can see just how easy the application is just Axios git and you pass it a URL and there you go you've already done a get request and it's way easier than doing it with fetch and it's all promise based so you can use async await if you want which is incredibly useful with this library there are many other libraries out there that do similar things to Axios but they may not be promised based or they may be larger or not support as many features as Axios Axios has a great balance of being incredibly easy to use incredibly great on the client-side incredibly great on the server side and just all-around amazing for creating things that fetch makes difficult and finally onto our very final library this one is incredibly small and simple it's called class names and what class names does is it allows you to really easily combine different class names together conditionally or whatnot to make one single class name for your different HTML elements it's really useful in libraries such as react view angular any library that has a lot of front-end manipulation but you most often see this and react and essentially as you can see over here you just call class names it's just a single function and you pass it in an array essentially of your class name so for example we have a classmate here foo and bar on this first example and it gives you the string through bar for your class names also here we can see that you can pass objects as well and if you you have true as the option that it's going to return that class name and down here as you can see we have false for duck so duck does not show up and list down here that is really what's super powerful about this class names function as you can really easily create lists of class names based on different options and parameters true/false that you're going to have inside of your application because otherwise you have to do a bunch of nested turn Ares which makes it really difficult to create these class names but this function right here single function super small takes care of all of that for you and it's just so great to work with short sweet and to the point those are my six favorite NPM libraries and if you want to see more videos from me make sure to check out over here and also subscribe to the channel for more videos of me simplifying the web for you thank you very much for watching and have a good day

Channel: Web Dev Simplified

Views: 69,756

Keywords: webdevsimplified, best npm packages, npm packages, top 10 npm packages, top 5 npm packages, top 6 npm packages, must install npm packages, best npm libraries, best node modules, top 10 npm libraries, top 5 npm libraries, my favorite npm packages, npm, npm best packages, npm package download, date-fns, dotenv, socket.io, axios, classnames, best node js packages, best node js libraries, top 5 node js packages, top 10 node js packages, top 5 node js libraries, top 10 node js libraries

Id: EG11xNoVaHg

Length: 7min 24sec (444 seconds)

Published: Sat Aug 03 2019