What goes into React projects?

React ecosystem
What goes into a React site?

Everyone knows the results of React. If you’re reading this now, you’re using a website made in React. If you’ve ever been on Facebook, you used React. If you’ve ever used Netflix, AirBNB, Reddit, Trello, IMDb or Twitch.tv then you’ve used React. The very creators and maintainers of React are the software team behind Facebook.

So you know what can be created with React, but do you know what is required in order to create those huge projects? How about the small ones? Probably not, as they are not open source. You’d have to do some deep diving into the source code and make assumptions and even then not truly know everything that was required to make them.

But we can figure out what goes into OUR React project. The first port of call is the file in the root directory called package.json. In this file is a list of all the node packages that have been included in the project, along with a version number such as "^2.0.16" .

The line "gatsby-plugin-offline": "^2.0.16" indicates that the project requires the package gatsby-plugin-offline of version 2.0.16 or above. By including the ^ we indicate that it is okay to update this plugin when any updates become available. To update use npm -i which will check all of the packages mentioned in package.json online to see if any new versions are available, and see if you have the full package and any dependencies (other packages) which it requires.