Get Your Reaction V 2.0 Review on a Silver Platter

Welcome, Reaction v 2.0, the brand-new version of Reaction Commerce and the focus of this review. It’s been a while since July 2019, when its authors announced the release of the much-anticipated new Reaction. Since then, the community has had enough time to get acquainted with new features, report issues and ask the right questions. Now, it’s Apiko’s turn to combine the most interesting facts about this popular e-commerce platform from the Reaction Community Call into a Reaction Commerce review.

Reaction v 2.0 is the second major release of the Reaction Commerce open-source platform for retailers and brands. We have already covered the tips for building e-commerce projects using Reactive Commerce in one of our previous blog posts. We’ve also discussed the pros and cons of building e-commerce projects using Reaction Commerce, and you are more than welcome to check them out too.

Reaction Commerce gains popularity and has already assembled a big, helpful community. How did it manage to earn its reputation while the market is buzzing with competitors like Magento, Shopify WooCommerce, FastSpring, Square E-Commerce, and others? Here are some of the reasons.

The Highlights of Reaction v 2.0

It’s better to flesh out new features when you examine them in contrast. We’ll try to compare the brand-new offering by Reaction Commerce against what was typical for earlier versions. The general concept of Reaction Commerce v 1.0 came down to a monolithic application for e-commerce, as said by Spencer Norman, Director of Engineering at Reaction Commerce in the Ask Me Anything (AMA) YouTube session. Version 2.0, however, is an API-first, headless, event-driven and real-time platform that came very close to being enterprise-focused. Let’s go through each of the main highlights spotted in Reaction v 2.0.

A Modern Tech Stack

To be flexible and adaptable, as it’s declared by the creators, the platform must have a strong foundation in the form of modular and micro service-oriented system design. To achieve that, the Reaction engineering team relies on:

• Apache Kafka for a real-time event-driven architecture

• A GraphQL API-based headless system for better customization

• Popular JavaScript frameworks Node.js and React

Here’s the complete tech stack used in Reaction Commerce 2.0.

A Headless and Modular Platform

The headless approach to e-commerce systems implies that the frontend, or the “head” presentation layer of a website, is removed from the backend with the e-commerce functionality. In contrast to traditional commerce platforms where a predefined frontend is tightly coupled with the backend, the headless approach gives developers a possibility to create any UI and have full control over it. Frontend developers are free to use any language, framework, and tool on a project. Backend developers can do exactly the same on the backend as long as it supports GraphQL.

In version 2.0 of Reaction Commerce, you can customize or build your own UI aside from the backend core application. Whatever endpoints you need to connect to the Reaction backend, use GraphQL API for that purpose.

To demonstrate the connection to Reaction API, the engineering team showcased Example Storefront. It contains all the resources to create your own storefront. More than that, you can refer to it as a starting point for building your own storefront in the way and technology you prefer. The only mandatory condition is that it must connect to the Reaction GraphQL API. In the earlier version, it was called Reaction Next.js Starter Kit.

Another novelty on version 2.0 is the move toward modularity. Decomposing the monolith of Reaction Commerce into different pieces will help users select the modules they need. Each of the modules will serve a specific function, like pricing service or inventory service, and can run independently.

Extended GraphQL API for Customization and Real-Time Data

The Reaction Commerce team knows that to win the buy-in of a bigger audience, they would have to cover a broader range of functionality and integration aspects. That’s why the improved functionality of GraphQL API covers all core commerce features, which attracts enterprise users and makes the platform more extensible and adaptable. GraphQL API now covers:

• Catalogs

• Shopping carts

• Order creation

• Checkout

• Payments

• Pricing

• Taxes

• Shipments

• Shipment restrictions

• Customer profiles & addresses

• Site navigation

• Enhanced tag management

Full-Page Operator UI for Better Usability and Smoother Workflows

Reaction store operator interface is where the marked improvements took place. With the newly-released version, Reaction Commerce engineers try to move beyond a purely open-source model. Better usability and smoother workflows for store operators are critical if they want to attract more enterprise clients. Some panels were borrowed from the older versions, but in general, they’ve rewritten the Operator UI a lot. The changes are:

• Full-page operator experience increases the usability on all screens

• Full-page operator interface allows for user-friendly workflows

• Admin panel UI for managing products is no longer based on the WYSIWYG product editor

• The operator admin panel is separated from the Storefront interface

The overhauled Reaction store Operator UI now features brand-new product editors, catalog editors and navigation editors, which can be easily managed by dragging and dropping. The engineers changed the logic that required operators to work over the top of the existing storefront. There’s no longer a need for using WYSIWYG to edit products or different pieces of reaction products, either. Following their enterprise-focused strategy, the Reaction team managed to simplify the routine for the operators and allowed them to edit or manage different products like an enterprise-size catalog or enterprise-size shops.

Full-Featured Example Storefront

Example Storefront is Reaction Commerce’s headless e-commerce storefront. In the past versions, it was developed by creating plugins and working with the main Reaction repo. But the approach had its downsides:

• Very slow reload times

• Limited ability to customize without modifying the core

• Using Meteor pub/sub, which is by no means a popular technology

In Reaction v 2.0.0, we see a more rational approach. Example Storefront is a convenient starting point even for the frontend developers who are unfamiliar with Reaction. Moreover, it showcases the flexibility and custom frontend possibilities of the headless commerce underlying the entire Reaction Commerce ecosystem. The present tech stack for Example Storefront covers popular technologies with solid community support:

• Next.js, a light framework to build fast React server-side rendered applications

• Apollo Client, a data fetching framework for smooth integration with Reaction's GraphQL API

• MobX, a reactive client state management library that is straightforward and scalable

• React, a JavaScript library for building user interfaces appreciated for its efficiency and flexibility

As a result, the Reaction Commerce engineering team received a JavaScript Storefront with fast restarts, decent customization capacities and the technologies favored by the development community. Example Storefront is now hosted on localhost 4000, on a different server, in a completely different repository where all the code is split out.

Improved Development Experience and Performance

Reaction Commerce 2.0 is different from the monolith systems the earlier versions were. Having moved away from that approach, Reaction has become a distributed system with lots of different components. Frontend developers can now work on a Storefront independently, with no need to start up/restart the entire server every time they start up/restart the frontend.

Performance enhancement and improved developer experience were central to the teams responsible for the Reaction’s new versions. It means that one way or another, most of the highlights of Reaction Commerce 2.0 improve the development experience and system performance. Just take a look at the case with extended GraphQL API. Being a new layer on top of the existing Meteor application and architecture, it helped to completely separate Storefront UI from the Meteor server. Now, software engineers have more flexibility to change the business logic without disrupting the frontend user experience, and vice versa.

As soon as you get started with the Reaction Platform, you may notice that the time required to build, run and network all the required containers has been reduced. It currently takes about six minutes the first time you run the Reaction Platform, and about one minute every time you start and stop it after that. For example, it took up to 20 minutes to start version 1.17. A considerable improvement in performance as it is.

Updated Documentation

The Reaction Commerce team tried their best to document the features, procedures, and workflows really well. We mean it: Reaction Commerce Docs is another piece of developer excellence that was improved a lot in version 2.0. This section covers all the basic relevant documentation for Reaction, Reaction Platform, Example Storefront, and other supporting services. Docs is the right place to start, especially if you’re new to Reaction Commerce. Explore Reaction Platform by learning how to customize it, build your own storefront or extend the API. The Documentation also covers different parts of Reaction, schemas and fundamental entities built-in Reaction.

Advanced Functionality for Entreprise Retailers and Brands

Although the team plans to open-source many features that are now private, they‘ve put a lot of effort into attracting enterprise clients. With the upgraded Reaction Commerce, retailers and marketers have more tools to focus on marketing and find it easy to operate their shops. We’ve already mentioned that Operator UI was completely rewritten for better usability and smoother workflows of enterprise users. For the same reason, they’ve extended GraphQL API that now covers all the major commerce features. Take a look at other enterprise capabilities that were upgraded in the latest version:

• Search. All hail Elasticsearch! Here’s how the updated search works: products from the Reaction product catalog are fed into Elasticsearch and are then surfaced for the users on the Storefront. All-in-all, the search based on Elasticsearch is much more powerful than the one that was built on top of Mongo in the previous versions.

• Pricing. Retailers can now benefit from a brand-new dedicated pricing engine to manage complex pricing and support different price books. It allows carrying out the concept of multiple tiers for pricing and scheduling different prices for a particular category of products based on regions, time periods and other business needs.

• Routing. The Reaction engineering team added advanced routings for bulk URL rewrites or redirects. It helps enterprise users to improve customer experience and boosts the SEO of their stores.

• Integrations. Another step forward in Reaction Commerce 2.0 is the ability to integrate with enterprise content management systems (CMS), payment processors and other third-party services.

Community Matters

A large supportive community is the dream of any technology product, more so for the development platforms. They simply won’t survive without community support provided through websites like GitHub and Stack Overflow. With the release of Reaction v 2.0.0, the management team put a huge effort into fostering a bigger community of developers. The company provides substantial resources to help community members work together, help each other with issues and share tips and tricks. You can try doing the following to engage with Reaction Commerce more:

• Use the Request a Feature repo on GitHub to file a feature request. It’s the place to create issues around feature requests, check out the requests of other community members or join a feature-related discussion.

• Open an issue on GitHub to point out what to improve in the next releases of Reaction Commerce. Especially if you’re new to open-source and are wondering how to contribute, the issues repo is a great place to start. The company also emphasizes the value of each contributor, so don’t hesitate to submit even a tiny bug or a suggestion.

• In case you have questions related to the technology or code, you can leave them in a dedicated repo.

• Share your Reaction Commerce websites in the Site Showcase section in Docs. Whether it’s a storefront, a plugin or an entire shop built on Reaction, feel free to show off.

• Join the community by writing to hello@reactioncommerce.com. This way, you can contribute to the Reaction Commerce Council, a group of people that have contributed massively to the development of the platform.

The Bottom Line

The first thing that strikes you while reviewing Reaction v 2.0 is that it’s finally ready for enterprise retailers and brands. Take GraphQL API, which allows better customization, smoother Operator user interface and other new enterprise-ready features gathered in Example Storefront. We see Reaction Commerce as the right choice for those who seek speed and flexibility in e-commerce platforms and try to move beyond the bulky existing ones or outdated legacy technologies. Even though Reaction Commerce 2.0 is a huge leap in targeting enterprise users, we believe that at the moment, it’s mostly suitable for medium and small businesses. However, their sincere devotion to the open-source principles makes us believe in the promising future of this technology.

If you’re considering Reaction Commerce or any other platform for your next e-commerce solution, the Apiko team is ready to help you augment and extend it to meet your business needs.