Integrating with Stream: Backend & Frontend Options
When we first built Stream, the platform was intended to be a pure back-end integration, allowing companies to build complex feed structures in a matter of minutes to hours rather than days or months. Since the inception of Stream, the platform has grown to be much more than a back-end solution; Stream now offers front-end libraries and integrations that compliment powerful back-end SDKs and APIs.
With the shortage of front-end developers and long turnaround times due to cross-browser support, design iterations, etc., we’ve found that this has become a bottleneck for many companies trying to take their product to market. On average, we’ve noticed a turnaround time lasting weeks to months, which is often a deal breaker for companies who are working on new products.
To combat this, Stream has introduced React Activity Feeds, a fully functional set of React and React Native components, allowing for React developers to hit the ground running with Stream quickly, without sacrificing the time required to build a front-end UI around their applications feed structure. The components offer every piece of functionality a developer would need to build out a functional feed structure, while also providing additional components to support posts, listing activities, notifications, and more.
The new addition to Stream is a very exciting step forward for developers around the world who are integrating on top of our platform. With any new product comes questions – this post will break down the differences between a front-end and back-end integration with Stream.
Note: For the full documentation on React Activity Feeds for React and React Native, you can visit the docs here: https://getstream.github.io/react-activity-feed/.
Consumer Identifiable Information
Generally speaking, personally identifiable information (PII) is one of the topics that individuals most frequently have questions about in regards to our platform. Regardless of your integration with Stream (front-end or back-end), you should ensure that PII is kept off of the Stream platform. And, if you truly need to hold onto this type of data, please do so on your own servers using a back-end integration with Stream. Additionally, if you do choose to hold on to PII about your consumers, please make sure that you are adhering to HIPAA and/or GDPR policies.
Where Stream’s front-end components shine are holding onto Consumer Identifiable Information (something I like to call CII for short). CII encompasses information like usernames, avatars, names and activities (text, images, file uploads, etc.). You can easily store this information in Stream, or retrieve this information from Stream’s front-end integrations. Best of all, when you go to use such information, regardless of which of the above methods you chose, it comes back in an enriched format – that’s right, no more enrichment from your application's database!
Feeds vs. Users
In a pure back-end integration with Stream, we don’t have the concept of a user. Rather, we have the concept of a feed. Every action taken is considered an activity, which is stored inside of a feed. All logic within your application is entirely handled based on the feeds that you have and what they follow (e.g. another feed), in addition to what is being held inside of them.
With client-side React and React Native components, we introduce the concept of a user. Feeds are now specific to individual users and, best of all, users can have profiles that we store in collections – think of a collection as a key-value / JSON store, similar to that of MongoDB. All modifications to a user and a user’s activities are controlled by a heavy permission layer that decides whether or not a user is able to take a certain action.
With that said, users do not take the place of feeds; whether you’re running a back-end integration or a front-end integration, your application will still require feeds for things such as groups, apps, etc.
With a back-end integration, you’re provided with an app ID, key, and secret; all of which are used, in combination, to generate the necessary credentials for API calls. With a front-end integration, you must make an API call to a single endpoint that you setup (let’s call it the /token endpoint), where you will receive back a JWT that is used for all future calls. This token takes care of the back-end access control layer (ACL) that is provided by Stream.
With the knowledge we laid on you above, we hope that you feel you have a better understanding of whether going with Stream’s back-end solution or front-end integration works more seamlessly with your application. To simplify the matter one step further, we find that the front-end integration is much easier to work with, implement, and build upon. On top of that, if you’re using React, you will have the ability to leverage powerful components. If you need extra security or are simply more of a back-end fanatic, we fully support diving into our back-end solution.
If you haven’t already signed up to try Stream, you can do so here. Stream’s 5-minute tutorial will walk you through the various feed types that are powered by Stream, and provide you with high-level overview of how feeds interact with each other.