Is Reactjs Open Source? A Guide to Project Sourcing.

Amongst frontend frameworks, Reactjs remains at the top of the most desirable and most utilized in enterprise software applications.

As a library, Reactjs was able to redefine the creation of component-based architecture of web applications. In addition, it was able to able make a big impact upon its initial release with excellent support for various reported issues and teething problems. The library is frequently getting significant updates to improve its quality of life for developers.

So, with all these positive plaudits of Reactjs being maintained correctly and with the huge community behind it, you might wonder, is Reactjs open source?

ReactJs is an open-source library developed by Facebook and is currently maintained with open source community. The source code for Reactjs can be found here. Initially, it was unclear to me as to why Facebook had made their very successful library an open-source project.

When looking to see the benefits of this, I was able to determine the following: When creating a framework, inevitably a lot of bugs will be produced. It is optimal to have as big of a testing pool as possible. When making a library open source, suddenly, the amount of available testers increases significantly.

Making a library open source also provides the ability to have use cases tested that would otherwise not been spotted by an internal team. The feedback received from a larger amount of testers can be very beneficial to a project to secure any gaps in its implementation.

This extra pool of testers essentially provides a safety net to the project and has the potential to save resources and revenue that would have otherwise been allocated to fixing various bugs within a confined team. Additionally, when a library has been used by many developers globally, the availability of potential hires that know your technology also increases.

In the long term. this can be very advantageous for a company when the development team of a library such as Reactjs needs to scale. Also, there is more visibility on the quality of the developers available to hire. This is because a company such as Facebook can clearly see, who has contributed valuable changes to their project.

There is also substantial value here for the libraries contributors, as if they have made an impact for a library in its early stages, this will undoubtedly stand to them in their future careers.

It can even act as a catalyst to get interviews in renowned companies that may have otherwise been impossible. Both the contributors and open source library creators stand to benefit in this scenario. Having an open-source library can also increase the reputation of the creators. If successful, it can be a direct way to show off the technical prowess of a technology to prospective developers. 

Some of the most talented developers are very particular about what kind of projects they are looking to work on. With a well-established reputation from an open-source library, a company can open up a channel of communication to a stronger pool of talented employees.

So, while an open-source library seems very beneficial, let’s discuss other common questions about Reactjs and its projects.

What are Some Reactjs Open Source Projects?

In addition to Reactjs being open source, countless amount of open source projects have been built using it. Here is a list of 5 popular ones:

  • React Navigation
    • A React Native library easy to use navigation solution written entirely in JavaScript. This library is a community solution to navigation that enables developers to set up different routes of an app with just a few lines of code.

  • Lottie React Native
    • A design-focused library for React Native that parses Adobe After Effects animations exported as JSON.

    • Allows designers to create and ship animations without having to get an engineer to slowly to recreate it for them

  • React VR
    • Creates exciting VR experiences using React. It allows the developer to make immersive media that can be deployed across to desktop, mobile and VR devices.

  • ReactXP
    • Allows developers to share the view layer of a React project between React and React Native. This includes sharing definitions, styles, and animations.

  • React-Cosmos
    • React-Cosmos is a  tool for ambitious UI developers. It allows the isolation of  UI components to iterate quickly. It allows a project’s UI to stay organized for long term design.

This wide ecosystem of open source projects being built on already open source libraries such as Reactjs really shows the positive knock-on effect an open-source project can have. The origins of these projects might have been only been in as a hobby or in somebody’s spare time.

However, because of the support and contributions from the community, they have quickly turned into very successful projects in their own right. While the decision to make these projects open source cannot be directly attributed to Reactjs’s decision to originally be open source. It stands to reason that it had a positive effect, to begin with, has subsequently been adopted by its users.

What makes a good open source library?

While the positive aspects of open source have been discussed already, you might wonder, what actually makes a good open-source library? While it is difficult to have a definitive outline of a good open-source implementation. 

Some general guidelines could include:

  • Having a healthy Github repository
    • Owners are responsive to issue coming in
    • Pull requests and bugs found are dealt within a reasonable time
    • Open issues that have been idle for too long are categorized correctly in order to give priority to more urgent problems
    • Test coverage is expanding with every minor release
    • Frequent and meaningful contributions from the community
  • Comprehensive Documentation
    • The Readme is clear and concise on what the library does
    •  All APIs are up to date and have clearly defined roles and structure

Why is Reactjs not a framework?

You may have heard that popular frontend technologies commonly fall into two categories, libraries, and frameworks.

As opposed to Angular or Emberjs, Reactjs is deemed to be a library. A high-level overview might tell you that it provides similar functionality as these other frameworks. So, why is React not a framework?

Trying to distinguish React as a framework or library can be somewhat tricky. This comes down to the amount of functionality that Reactjs provides.  When it comes to defining what a framework is as the usual distinction is the amount of control and flexibility that it gives.

This is also known as inversion of control. For example, in a framework, a lot of the decisions about how things work under the hood have been already made for you. In a framework such as Angular, these decisions have been made by the creators. They have implemented their opinionated code structure and you are very much working inside the constraints of what they have provided.

This includes functionality like:

  • HTTP requests
    • This is handled by a module that Angular has provided
  • Routing system
    • Angular has created its own system of routing that is ready to use
  • Styling Structure 
    • Each component generated by Angular has an associated SASS file

In comparison, in Reactjs and other libraries, functionality such as routing and HTTP requests is specified by the user. The user has the flex-ability to use whatever he/she sees fit for these kinds of interactions. A framework guarantees that its parts will work together, whereas libraries give you the option to utilize anything you see fit.

This is an important distinction because a framework can be viewed as being batteries included, whereas a library such as Reactjs allows for much more customizable experiences. A more visual comparison of these two types can be shown in the diagram by  Tom Lokhorst below:

The diagram portrays libraries as something that is able to synchronize with external tool kits much easier. Essentially, the main tradeoff between these two types is the flexibility that libraries provide over frameworks.

A framework is going to be easier to hit the ground running while a library can provide a configurable toolkit that might serve a better long term solution. There is no guarantee an external library will seamlessly integrate with Reactjs. However, is quite likely that you will be able to find one that does.

Conclusion

Overall, the benefits of having an open-source library such as Reactjs have opened up the door for others to follow suit. The positive exposure and fanatical community that can be created from having an open-source project can enable the acceleration of growth.

Constant feedback from those who have invested their time in the more complex areas of a library will do nothing but improve the overall experience. Issues and bugs that might not be encountered otherwise have huge value to the overall health of a library.

And while Reactjs is only one success story mentioned here, there are plenty of others that have been boosted by having their projects open source from the beginning.

Gareth Dunne

Senior JavaScript Engineer and creator of JSdiaries. Passionate about the latest in web technologies and how it can provide value for my clients.