Introduction to React Yarn
The technical community shares hundreds and thousands of pieces of code every day in the community of JavaScript. As a result, engineers and developers can get rid of the worry of writing basic components again and again. It can be anything such as Basic components, libraries, or even our own framework. Each piece of code can be dependent on any other piece of code. Also, the package managers are there to manage these kinds of dependencies. Npm client is the most popular JavaScript package manager that provides us with more than 300,000 packages in the npm registry. Npm is so famous and also it is useful for over 5 million engineers. This is so, because of the registry that npm provides and there are an estimated 5 billion downloads each month.
At Facebook, they use the npm client successfully but with the growth in the codebase over the years. And simultaneously their engineers also grew and they started to run into problems. Those problems were basically a matter of consistency, performance, and also the security of their project. After they tried to find the solutions for each problem separately, they finally set out to take on the problems differently. As a result, they started their endeavor to find a new solution that would help them manage the dependencies. This management will be in a more reliable manner. The output that came out of that endeavor is nothing but yarn. And that is a fast and reliable client that we can use as an alternative to npm. And it is also extremely secure at the same time.
Why React Yarn?
You know you can trust Yarn. This is because its announcement was the open-source where Facebook took the initiative. Also, Tilde, Exponent, and Google were in collaborations. The good part about using Yarn is that engineers still have full access to the registry for npm. Along with that, they get an extra benefit of installing the packages much more quickly. Not just this, it also manages the dependencies much consistently across all the machines and the secure environment offline. Engineers and developers really love Yarn because Yarn makes it possible for them to move faster. Also, it provides much more confidence when they use shared code. This results in less wastage of time on unnecessary things and more focus on important ones. For example, it focuses on the creation or updating of more features and products.
Building the New Client:
So Facebook decided to look at the problems to build clients in a more holistic way. They thought of making a new client that will address the core issues they found while working. As they were working on React Yarn, they spoke with numerous engineers all around the globe. And they found that everyone had common problems in similar programs or functions. It was pretty obvious for them that by collaborating on the set of problems that were common to the community.
Architecture:
In the ecosystem of Node, the node_module directory in your project places the dependencies. But the fact is that this file structure can be different from the actual tree of dependency. This is because the duplicate trees merge together. The node_modules directory installs dependencies by the npm client.
The lock files lock the dependencies into any specific version that the developer prefers. This also ensures that every install you do will result in the exact same file structure every time across any machine. The lock file that is in use has a fixed format that has ordered keys. These keys ensure that the changes between different versions are minimal. Also, it is very simple to review.
There are three parts the process of installation can be broken down into:
- Resolution: The dependencies are resolved by Yarn by making the requests to the respective registry. It looks up each dependency recursively.
- Fetching: The next step that is followed is that it takes a look at the global directory for cache for seeing if the package needed is already downloaded or not. If it isn’t already downloaded then the yarn fetches the specific tarball and places it in the global cache.
- Linking: Linking is the last step and it is done by linking everything together and it is done by copying all the files that are needed from the global cache. It is then later pasted into the directory of node_modules which is a local directory.
Features of React Yarn:
Yarn, in addition, makes the installation much faster and reliable. It has many features that further simplify the workflow of dependency management.
- It is compatible with clients such as npm and bower workflow and it also supports the mixing of the registries.
- React Yarn has this ability to restrict the licenses of installing the modules. It means that we can use it to output the information of the license.
- Yarn can expose a stable public API for JavaScript. We can abstract it with login for consumption via the tools for building.
- The yarn has a readable, minimal, and also a very pretty CLI than other clients.
Installation of React Yarn:
The easiest way to install Yarn is to run: npm install -g yarn. It will result in the Yarn CLI replacing the npm in the workflow of your development. And we can do it either with any matching command or a command that is new but similar.
- Npm install -> yarn
Yarn is going to read the package.json and fetch the packages from the registry of npm. And it will result in the population of the node_module folder that you have. It will be the equivalent of running the npm install.
- npm install –save → yarn add
What it does is removes the “invisible dependency” that we have when using the npm install and instead we split the command.
Conclusion:
Many great developers came together for the purpose to build Yarn so as to solve all the common problems. They knew that they wanted Yarn to really be a project for the community. And by the community, it means that it should be accessible to everyone. You can easily find Yarn on Github and guess what? It is an essential tool for the React community for doing what it does best and that is making good use of Yarn for sharing ideas, writing the documentation, and supporting each other in the process of development. It will grow into a strong community one day with your help and Yarn is already on a great start but it can be even better with your help.