Package.json & Package-lock.json

Hello Everyone, Welcome to my blog 🙏.
I hope you are all safe and that this blog finds you in good health ❤️.

As a Frontend developer, if you are using Node Package Manager (NPM) you would have come across these two files. So why do we need them?

What is Package.json?

package.json is the main and heart of the project where you see all dependencies along with versions which are you used in your project.

Then, What about Package-lock.json?

It is the file where all the versions are tracked in order to maintain consistency among the other developers who collaborate with your project.

Okay, This is okay for the definition 😀.

BUT, Let’s dive deep into these files and how it works?

Suppose you are working on a project and used NPM for installing packages, as you know there will be two files generated as soon as you start installing the packages that are used for your project.

Let’s say you have installed one package in your project.

npm install element-ui@2.1.0 -S
Note: here, I am just taking element-ui as an example.

So, here you have installed it and also you see some dependency versions for your installed package (element-UI) in package-lock.json and those all are required to run your package in your project.

Everything is good so far, Due to excessive requirements in your project, you need one more resource to help you in the project.

The other developer should have
1. The same packages with the same versions that are used in your project.
2. Most importantly, those packages should match yours.

Seems easy right, zip your file and share it with the resource that’s all and also most important node should be installed in the resource system.
Note: zip your project along with your node_modules

It’s okay to do when you both work at one place. but, when it comes to remote locations it is very difficult for you to send the zip file which can be too much to share online. Don’t you think it is quite foolish to zip your project along with your node_modules and share?

Then what can be done here?

So simple, just share the zip along with your project code, package.json, package-lock.json excluding node_modules. Now your zip is roughly less than 1 MB.
Now what your teammate should do, just unzip and run npm install
that’s it, the project will run with the same packages and with the same versions. this is what we wanted right.
But how is it possible, How node knew to install those packages in your project? That is only because of your package.json and package-lock.json.

Do we require both package.json & package-lock.json?

The answer is No. you can also install your packages only having the package.json file with you. Then why do we need a package-lock.json file?
Okay!! Let’s get to know that as well 
To understand this, Lets first know ^ & ~
These two signs are normally seen in your package.json file, what do they mean?

~ → which means it will update your project with future patch versions when you run npm install.

^ → which means it will update your project with future patch/minor versions when you run npm install.

Blah Blah Blah 😅
what do all these mean?
patch versions mean suppose you have installed v1.2.0, here
1 → Major
2 → Minor
0 → patch
I am not diving deeper here but having a basic idea is always a plus.
If there is a bug fix, normally they are covered in patch versions
If there is a feature along with backward compatibility, normally they are considered to be minor releases. 
If there is a feature and also there is no backward compatibility, then that is considered to be a major release.

So far this knowledge is enough to understand the current scenario of our blog 😄.
Let’s get back to our topic, Now if you only share package.json with your teammate and ask her/him to run npm install then what happens here? Any guesses…
Nothing happens, you will see a new package-lock.json file generated and your project works fine but there are a few issues here.
If your package.json file contains “~1.2.0 or ^1.2.0”
when your teammate runs npm install. 
By that time if your packages have updated versions, then those updated versions will be included in his system that means if there is a minor release happened in one of your packages and the version is 1.3.0
so 1.3.0 will get installed in your teammate's system.

Okay, then what happens to your project, Nothing happens to your existing project because as there will be backward compatibility your project runs fine and the same as yours but if your teammate starts to code and uses some function that is newly introduced in the package 1.3.0 version and that particular thing doesn’t work with you.

So this will be a kind of threat to your project.

If you are not bothered about the patches or minor releases, then you can go ahead by sharing package.json with your co-worker.

The final verdict here, 
Sharing package.json and package-lock.json files with your teammate is the best way to keep your project on the same track as your team.

Hope this blog clears all your doubts related to package.json & 
package-lock.json.
If you like it, please give it a clap and share it with your friends.
So it might help someone as well.

Thank You, Everyone.
until next time, 
Happy learning 😃.